:root {
  --bg: #0e1217;
  --panel: #151b22;
  --panel-2: #1b222b;
  --line: #262f3a;
  --text: #d8dee6;
  --muted: #7f8a97;
  --up: #2f7de1;
  --up-bg: #12233a;
  --down: #d14b4b;
  --down-bg: #2e1517;
  --tie: #8a929c;
  --win: #2e9e68;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.4 -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}

button { font: inherit; color: inherit; cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }

.top {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 10px 20px; border-bottom: 1px solid var(--line); background: var(--panel);
  flex-wrap: wrap;
}
.brand strong { font-size: 16px; }
.brand .sub { color: var(--muted); margin-left: 8px; }
.controls { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.field { display: flex; align-items: center; gap: 8px; color: var(--muted); }
select {
  background: var(--panel-2); color: var(--text); border: 1px solid var(--line);
  border-radius: 4px; padding: 5px 8px; font: inherit;
}
.conn { color: var(--muted); font-size: 13px; }
.conn::before {
  content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  margin-right: 6px; background: var(--down); vertical-align: 1px;
}
.conn.on::before { background: var(--win); }
.conn.connecting::before { background: #c9a227; }
.balance { display: flex; align-items: baseline; gap: 8px; }
.balance span { color: var(--muted); }
.balance strong { font-size: 18px; }
.link { background: none; border: 0; color: var(--up); padding: 0; text-decoration: underline; }

.layout {
  display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px;
  max-width: 1180px; margin: 0 auto; padding: 16px 20px 32px;
}
@media (max-width: 900px) { .layout { grid-template-columns: 1fr; } }
.col-main, .col-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }

.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 14px; }
.label, .muted { color: var(--muted); font-size: 13px; }

.price-row { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 10px; }
.price { font-size: 26px; font-weight: 600; }
.change { font-size: 14px; }
.change.up { color: var(--up); }
.change.down { color: var(--down); }
#chart { display: block; width: 100%; height: 220px; }

.round-head { display: flex; justify-content: space-between; align-items: baseline; }
.status { font-size: 15px; font-weight: 600; }
.round-no { color: var(--muted); font-size: 13px; }
.progress { height: 4px; background: var(--panel-2); border-radius: 2px; margin: 10px 0 12px; overflow: hidden; }
#bar { height: 100%; width: 0; background: var(--muted); transition: width .2s linear; }

.ticks { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.tick {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 4px;
  padding: 8px; min-height: 52px;
}
.tick .t-label { color: var(--muted); font-size: 12px; }
.tick .t-val { font-size: 14px; font-weight: 600; margin-top: 2px; }
.tick.up .t-val { color: var(--up); }
.tick.down .t-val { color: var(--down); }

.table { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.side {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
  padding: 18px; border-radius: 6px; text-align: left; border: 1px solid var(--line);
  transition: border-color .15s, background .15s;
}
.side.up { background: var(--up-bg); }
.side.down { background: var(--down-bg); }
.side:not(:disabled):hover.up { border-color: var(--up); }
.side:not(:disabled):hover.down { border-color: var(--down); }
.side.won.up { border-color: var(--up); box-shadow: inset 0 0 0 1px var(--up); }
.side.won.down { border-color: var(--down); box-shadow: inset 0 0 0 1px var(--down); }
.side-top { display: flex; align-items: baseline; gap: 10px; }
.side-name { font-size: 22px; font-weight: 700; }
.side.up .side-name { color: var(--up); }
.side.down .side-name { color: var(--down); }
.side-alias, .side-pay { color: var(--muted); font-size: 13px; }
.side-stake { font-size: 13px; color: var(--muted); }
.side-stake b { color: var(--text); font-size: 15px; }

.chips-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.chips { display: flex; gap: 8px; }
.chip {
  width: 46px; height: 46px; border-radius: 50%; border: 2px dashed #5d6773;
  background: var(--panel-2); font-weight: 700;
}
.chip.sel { border-style: solid; border-color: var(--text); background: #26303c; }
.actions { display: flex; gap: 8px; }
.btn {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 4px; padding: 8px 14px;
}
.btn:not(:disabled):hover { border-color: var(--muted); }

.road-head { display: flex; justify-content: space-between; margin-bottom: 10px; font-weight: 600; }
.road {
  display: grid; grid-auto-flow: column; grid-template-rows: repeat(6, 18px);
  grid-auto-columns: 18px; gap: 3px; overflow-x: auto; padding-bottom: 4px; min-height: 126px;
}
.cell { width: 18px; height: 18px; border-radius: 50%; }
.cell.up, .dot.up { background: var(--up); }
.cell.down, .dot.down { background: var(--down); }
.cell.tie, .dot.tie { background: var(--tie); }
.legend { display: flex; gap: 14px; color: var(--muted); font-size: 12px; margin-top: 8px; }
.dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; }

.log { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow-y: auto; font-size: 13px; }
.log li { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--line); }
.log li:last-child { border-bottom: 0; }
.log .pos { color: var(--win); }
.log .neg { color: var(--down); }

.rules { color: var(--muted); font-size: 12px; margin: 0; }

.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%);
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 6px;
  padding: 10px 16px; opacity: 0; pointer-events: none; transition: opacity .2s;
}
.toast.show { opacity: 1; }
.toast.win { border-color: var(--win); }

.diag {
  margin: 12px 0 0; padding: 8px 10px; background: var(--bg); border: 1px solid var(--line);
  border-radius: 4px; color: var(--muted); font: 12px/1.5 Consolas, Menlo, monospace; white-space: pre-wrap;
}
.diag:empty { display: none; }

.btn.small { padding: 5px 10px; font-size: 13px; }
.auto { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; margin-left: auto; margin-right: 8px; cursor: pointer; }
.auto input { accent-color: var(--up); }

.banner {
  display: flex; justify-content: space-between; align-items: center;
  margin: -2px 0 12px; padding: 12px 14px; border-radius: 4px; border: 1px solid var(--line);
  background: var(--panel-2); animation: bannerIn .25s ease-out;
}
.banner[hidden] { display: none; }
.banner.up { border-color: var(--up); background: var(--up-bg); }
.banner.down { border-color: var(--down); background: var(--down-bg); }
.banner .b-side { font-size: 20px; font-weight: 700; }
.banner.up .b-side { color: var(--up); }
.banner.down .b-side { color: var(--down); }
.banner .b-net { font-size: 16px; font-weight: 600; }
.banner .b-net.pos { color: var(--win); }
.banner .b-net.neg { color: var(--down); }
.banner .b-net.none { color: var(--muted); font-weight: 400; font-size: 14px; }
@keyframes bannerIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.stake-pop { animation: pop .18s ease-out; }
@keyframes pop { from { transform: scale(1.18); } to { transform: none; } }

.road-head { gap: 12px; }
.road-head > span:first-child { white-space: nowrap; }
#stats { text-align: right; font-weight: 400; }

.account { display: flex; align-items: center; gap: 8px; }
.btn.primary { background: var(--up); border-color: var(--up); color: #fff; }
.btn.primary:hover { filter: brightness(1.08); }
body.real-mode .balance strong { color: #e8b04a; }
body.real-mode .top { border-bottom-color: #e8b04a; }

/* ---------- dado Par × Ímpar ---------- */
.dice-row { display: flex; gap: 14px; align-items: stretch; }
.dice-row .ticks { flex: 1; grid-template-columns: repeat(5, 1fr); }
.die-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.die {
  width: 76px; height: 76px; border-radius: 12px; background: #e9edf2; color: #10161d;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 -4px 0 rgba(0,0,0,.18), 0 2px 0 rgba(0,0,0,.35);
  border: 1px solid #c7ced6;
}
.die .die-face { font-size: 40px; font-weight: 800; line-height: 1; }
.die .die-face.flip { animation: flip .22s ease-out; }
.die.rolling.up .die-face, .die.final.up .die-face { color: #1c5bb0; }
.die.rolling.down .die-face, .die.final.down .die-face { color: #b02f2f; }
.die.final.up { outline: 2px solid var(--up); outline-offset: 2px; }
.die.final.down { outline: 2px solid var(--down); outline-offset: 2px; }
.die-label { font-size: 12px; color: var(--muted); }
@keyframes flip { from { transform: rotateX(80deg) scale(.85); opacity: .3; } to { transform: none; opacity: 1; } }

.tick .t-val { display: flex; align-items: baseline; gap: 1px; }
.tick .t-price { color: var(--muted); font-weight: 400; font-size: 13px; }
.tick .t-dig { font-size: 18px; font-weight: 800; }
.tick.up .t-dig { color: var(--up); }
.tick.down .t-dig { color: var(--down); }
.tick.last { border-color: #3a4552; }
.tick .t-empty { color: var(--muted); }

.price .p-dig.up { color: var(--up); }
.price .p-dig.down { color: var(--down); }

.cell { color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }

/* ---------- palco do dado (sobre o gráfico) ---------- */
.stage { position: relative; height: 240px; }
.stage #chart { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .28; }
.stage-center {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px; pointer-events: none;
}
.stage .die { width: 132px; height: 132px; border-radius: 22px; box-shadow: inset 0 -7px 0 rgba(0,0,0,.18), 0 6px 18px rgba(0,0,0,.45); }
.stage .die .die-face { font-size: 76px; }
.stage .die.spinning { animation: tumble .3s linear infinite; }
.stage .die.spinning .die-face { color: #5b6672; }
.stage .die.idle .die-face { color: #8a939e; }
.stage .die.final { animation: land .35s ease-out; }
.stage .die-label { font-size: 15px; color: var(--text); font-weight: 600; }
@keyframes tumble {
  0% { transform: rotate(0deg) translateY(0); }
  25% { transform: rotate(8deg) translateY(-6px); }
  50% { transform: rotate(0deg) translateY(0); }
  75% { transform: rotate(-8deg) translateY(-6px); }
  100% { transform: rotate(0deg) translateY(0); }
}
@keyframes land { 0% { transform: scale(1.12); } 60% { transform: scale(.97); } 100% { transform: none; } }

/* ---------- mesas de dados Ímpar × Par ---------- */
.arena .round-head { margin-bottom: 0; }
.tables { display: grid; grid-template-columns: 1fr auto 1fr; gap: 14px; align-items: stretch; margin: 6px 0 14px; }
.dtable {
  border-radius: 8px; padding: 18px 16px 16px; border: 1px solid var(--line);
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  transition: opacity .25s, border-color .25s;
}
.dtable.down { background: var(--down-bg); }
.dtable.up { background: var(--up-bg); }
.dtable.win.down { border-color: var(--down); box-shadow: inset 0 0 0 1px var(--down); }
.dtable.win.up { border-color: var(--up); box-shadow: inset 0 0 0 1px var(--up); }
.dtable.lose { opacity: .45; }
.dt-name { font-size: 22px; font-weight: 800; letter-spacing: .5px; }
.dtable.down .dt-name { color: var(--down); }
.dtable.up .dt-name { color: var(--up); }
.dt-sum { font-size: 30px; font-weight: 800; min-height: 36px; font-variant-numeric: tabular-nums; }
.vs { align-self: center; font-size: 26px; color: var(--muted); font-weight: 300; }

.dice { display: flex; gap: 16px; }
.pdie {
  width: 84px; height: 84px; border-radius: 14px; padding: 12px;
  display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr);
  box-shadow: inset 0 -5px 0 rgba(0,0,0,.25), 0 4px 10px rgba(0,0,0,.4);
}
.dtable.down .pdie { background: #c9393b; }
.dtable.up .pdie { background: #2a6fd6; }
.pdie i { width: 14px; height: 14px; border-radius: 50%; place-self: center; }
.pdie i.on { background: #fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.18); }
.pdie.blank { opacity: .35; }
.pdie.spinning { animation: tumble2 .38s linear infinite; }
.pdie.spinning:nth-child(2) { animation-duration: .44s; animation-direction: reverse; }
.pdie.land { animation: land .32s ease-out; }
@keyframes tumble2 {
  0% { transform: rotate(0) translateY(0); }
  25% { transform: rotate(12deg) translateY(-8px); }
  50% { transform: rotate(0) translateY(0); }
  75% { transform: rotate(-12deg) translateY(-8px); }
  100% { transform: rotate(0) translateY(0); }
}
@keyframes land { 0% { transform: scale(1.14); } 60% { transform: scale(.96); } 100% { transform: none; } }

.liveline { display: flex; gap: 14px; align-items: baseline; font-size: 13px; color: var(--muted); margin-top: 10px; flex-wrap: wrap; }
.liveline b { color: var(--text); font-weight: 600; }
.liveline .p-dig.up, .liveline .dig.up { color: var(--up); }
.liveline .p-dig.down, .liveline .dig.down { color: var(--down); }
.liveline .change { font-size: 13px; }

@media (max-width: 700px) {
  .pdie { width: 58px; height: 58px; padding: 8px; }
  .pdie i { width: 10px; height: 10px; }
  .dt-name { font-size: 18px; }
}
#chart[hidden], #ticks[hidden] { display: none; }

/* ---------- mesa única com dados 3D ---------- */
.felt {
  position: relative; height: 300px; margin: 6px 0 14px; border-radius: 14px; overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 40%, #1f5a3d 0%, #154530 55%, #0f3423 100%);
  border: 6px solid #3b2a1c; box-shadow: inset 0 0 0 2px #5a412b, inset 0 10px 30px rgba(0,0,0,.45);
  perspective: 900px;
}
.felt .half { position: absolute; top: 0; bottom: 0; width: 50%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 12px 0 10px; pointer-events: none; }
.felt .half.down { left: 0; background: linear-gradient(180deg, rgba(209,75,75,.16), rgba(209,75,75,0) 40%); }
.felt .half.up { right: 0; background: linear-gradient(180deg, rgba(47,125,225,.16), rgba(47,125,225,0) 40%); }
.felt .h-name { font-size: 20px; font-weight: 800; letter-spacing: 1px; }
.felt .half.down .h-name { color: #ff8a8a; }
.felt .half.up .h-name { color: #8fbaff; }
.felt .h-sum { font-size: 28px; font-weight: 800; color: #f1f4f7; min-height: 32px; }
.felt-line { position: absolute; top: 14px; bottom: 14px; left: 50%; border-left: 2px dashed rgba(255,255,255,.18); }
.felt.win-down .half.up, .felt.win-up .half.down { opacity: .45; }
.felt.win-down .half.down { background: linear-gradient(180deg, rgba(209,75,75,.32), rgba(209,75,75,.06)); }
.felt.win-up .half.up { background: linear-gradient(180deg, rgba(47,125,225,.32), rgba(47,125,225,.06)); }

.d3 { position: absolute; left: 0; top: 0; width: 62px; height: 62px; will-change: transform; }
.d3 .d3-shadow { position: absolute; left: 6px; right: 6px; bottom: -10px; height: 14px; border-radius: 50%; background: rgba(0,0,0,.38); filter: blur(4px); }
.d3 .cube { position: absolute; inset: 0; transform-style: preserve-3d; translate: 0 var(--hop, 0px); }
.d3 .face {
  position: absolute; inset: 0; border-radius: 7px; padding: 9px;
  display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr);
  backface-visibility: hidden; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15), inset 0 -4px 6px rgba(0,0,0,.18);
}
.d3.down .face { background: #cf3b3d; }
.d3.up .face { background: #2a6fd6; }
.d3 .face i { width: 11px; height: 11px; border-radius: 50%; place-self: center; backface-visibility: hidden; }
.d3 .face i.on { background: #fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.2); }
.d3 .face.front  { transform: translateZ(31px); }
.d3 .face.back   { transform: rotateY(180deg) translateZ(31px); }
.d3 .face.right  { transform: rotateY(90deg) translateZ(31px); }
.d3 .face.left   { transform: rotateY(-90deg) translateZ(31px); }
.d3 .face.top    { transform: rotateX(90deg) translateZ(31px); }
.d3 .face.bottom { transform: rotateX(-90deg) translateZ(31px); }

.d3 .core { position: absolute; inset: 2px; border-radius: 6px; }
.d3.down .core { background: #b53234; }
.d3.up .core { background: #245fb8; }
.d3 .core.cx { transform: rotateY(90deg); }
.d3 .core.cy { transform: rotateX(90deg); }

/* ---------- mesa 3D ---------- */
.felt3 { position: relative; margin: 6px 0 14px; }
.felt3d { position: relative; height: 340px; border-radius: 10px; overflow: hidden; background: #0b0f14; }
.felt3d .dice-canvas { display: block; width: 100%; height: 100%; }
.sums { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 10px; }
.sum { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 14px; border-radius: 6px; border: 1px solid var(--line); transition: opacity .25s, border-color .25s; }
.sum.down { background: var(--down-bg); }
.sum.up { background: var(--up-bg); }
.sum .s-name { font-weight: 800; letter-spacing: .5px; }
.sum.down .s-name { color: var(--down); }
.sum.up .s-name { color: var(--up); }
.sum .s-val { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; }
.felt3.win-down .sum.down, .felt3.win-up .sum.up { border-color: currentColor; }
.felt3.win-down .sum.down { border-color: var(--down); box-shadow: inset 0 0 0 1px var(--down); }
.felt3.win-up .sum.up { border-color: var(--up); box-shadow: inset 0 0 0 1px var(--up); }
.felt3.win-down .sum.up, .felt3.win-up .sum.down { opacity: .45; }
@media (max-width: 700px) { .felt3d { height: 230px; } }

.liveline[hidden] { display: none; }

/* =========================================================
   Layout moderno (estilo cassino ao vivo)
   ========================================================= */
:root {
  --bg: #07090d; --panel: #0f131a; --panel-2: #151a23; --line: #1f2632;
  --gold: #d2b26a;
}
body { background: radial-gradient(1200px 600px at 50% -10%, #141b29 0%, #07090d 60%) fixed; }
.top { background: rgba(10,13,19,.85); backdrop-filter: blur(6px); border-bottom-color: #1a202b; }
.brand strong { letter-spacing: .5px; }

.layout2 { max-width: 1100px; margin: 0 auto; padding: 16px 20px 40px; display: flex; flex-direction: column; gap: 14px; }

/* palco */
.stage-wrap { background: #05070a; border: 1px solid #161c26; border-radius: 14px; padding: 12px 12px 12px; }
.stage-top { display: flex; justify-content: space-between; align-items: baseline; padding: 2px 4px 0; }
.stage-top .status { font-size: 16px; font-weight: 700; }
.stage-wrap .progress { margin: 10px 4px 10px; height: 3px; }
.felt3 { position: relative; margin: 0; }
.felt3d { height: 430px; border-radius: 10px; background: #06080c; }
@media (max-width: 760px) { .felt3d { height: 260px; } }

/* resultado sobre a mesa */
.banner.overlay {
  position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%);
  min-width: 360px; margin: 0; padding: 12px 18px; gap: 18px;
  background: rgba(8,10,15,.88); border: 1px solid #2a3240; border-radius: 10px;
  animation: bannerUp .3s ease-out;
}
.banner.overlay.up { border-color: var(--up); }
.banner.overlay.down { border-color: var(--down); }
.banner.overlay[hidden] { display: none; }
@keyframes bannerUp { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* áreas de aposta */
.bets { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bets .side {
  position: relative; display: grid; grid-template-rows: auto 1fr auto; align-items: center;
  min-height: 150px; padding: 16px 20px; border-radius: 12px; text-align: left;
  border: 1px solid transparent; transition: transform .08s, border-color .2s, filter .2s;
}
.bets .side.down { background: linear-gradient(160deg, #5a0f1a 0%, #2a0a10 70%); border-color: #4a1520; }
.bets .side.up { background: linear-gradient(160deg, #0f2f6e 0%, #0a1733 70%); border-color: #19305e; }
.bets .side:not(:disabled):hover { filter: brightness(1.12); }
.bets .side:not(:disabled):active { transform: scale(.99); }
.bets .side:disabled { opacity: 1; cursor: default; }
.bets .side.won.down { border-color: #ff5a68; box-shadow: inset 0 0 0 1px #ff5a68; }
.bets .side.won.up { border-color: #5b95ff; box-shadow: inset 0 0 0 1px #5b95ff; }
.b-head { display: flex; align-items: baseline; gap: 12px; }
.bets .side-name { font-size: 26px; font-weight: 800; letter-spacing: 1px; color: #fff !important; }
.bets .side-alias { color: rgba(255,255,255,.55); font-size: 13px; letter-spacing: 2px; }
.score { justify-self: end; align-self: center; font-size: 54px; font-weight: 800; line-height: 1; color: rgba(255,255,255,.92); font-variant-numeric: tabular-nums; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); }
.b-foot { display: flex; gap: 18px; align-items: baseline; }
.bets .side-pay { color: rgba(255,255,255,.6); font-size: 13px; }
.bets .side-stake { color: rgba(255,255,255,.7); font-size: 13px; }
.bets .side-stake b { color: #fff; font-size: 17px; }

/* fichas de cassino */
.chips-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.chips { display: flex; gap: 10px; }
.chip {
  position: relative; width: 56px; height: 56px; border-radius: 50%; border: 0; padding: 0;
  background:
    radial-gradient(circle at 50% 50%, var(--c) 0 52%, transparent 53%),
    repeating-conic-gradient(var(--c) 0 20deg, #f2f2f2 20deg 32deg);
  box-shadow: 0 3px 0 rgba(0,0,0,.45), inset 0 0 0 2px rgba(0,0,0,.25);
  transition: transform .12s;
}
.chip span {
  position: absolute; inset: 11px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  border: 2px dashed rgba(255,255,255,.55); color: #fff; font-weight: 800; font-size: 14px; text-shadow: 0 1px 0 rgba(0,0,0,.4);
}
.chip.c1 { --c: #6b7480; } .chip.c5 { --c: #c42a33; } .chip.c10 { --c: #1f5fd0; } .chip.c25 { --c: #17914f; } .chip.c100 { --c: #191b20; }
.chip.c100 span { border-color: rgba(210,178,106,.8); color: var(--gold); }
.chip:hover { transform: translateY(-2px); }
.chip.sel { transform: translateY(-5px); box-shadow: 0 7px 0 rgba(0,0,0,.45), 0 0 0 3px var(--gold); }
.chips-row .auto { margin-left: auto; margin-right: 0; }
.chips-row .btn { background: #141922; border-color: #222a36; }

/* histórico */
.bottom { display: grid; grid-template-columns: 1fr 300px; gap: 14px; }
@media (max-width: 860px) { .bottom { grid-template-columns: 1fr; } }
.road-panel .road { grid-template-rows: repeat(6, 24px); grid-auto-columns: 24px; min-height: 160px; gap: 4px; }
.road-panel .cell { width: 24px; height: 24px; font-size: 11px; }
.log-panel .log { max-height: 160px; }
.panel { background: var(--panel); border-color: #19202b; border-radius: 12px; }

html { background: #07090d; }

/* =========================================================
   Terminal de operações (v0.12)
   ========================================================= */
:root {
  --bg: #0c0f13; --panel: #12161c; --panel-2: #181d25; --line: #222833; --line-2: #2c3440;
  --text: #dfe4ea; --muted: #8590a0;
  --odd: #e5484d; --odd-d: #3a1417; --even: #3d7cf0; --even-d: #12223f;
  --pos: #2fbf84; --neg: #e5484d;
}
body { background: var(--bg); font-feature-settings: "tnum" 1; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; }
.p-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.p-head h2 { margin: 0; font-size: 14px; font-weight: 600; color: var(--text); }
.p-head .muted { font-size: 12px; }
.pos { color: var(--pos); } .neg { color: var(--neg); }

/* somas sobre a mesa */
.stage-sum { position: absolute; top: 12px; display: flex; align-items: baseline; gap: 8px; padding: 6px 10px; border-radius: 4px; background: rgba(10,12,16,.72); border: 1px solid var(--line-2); font-size: 12px; color: var(--muted); }
.stage-sum b { font-size: 20px; color: var(--text); font-weight: 700; min-width: 18px; text-align: right; }
.stage-sum.down { left: 12px; border-left: 3px solid var(--odd); }
.stage-sum.up { right: 12px; border-left: 3px solid var(--even); }
.felt3.win-down .stage-sum.down, .felt3.win-up .stage-sum.up { border-color: var(--line-2); background: rgba(10,12,16,.9); }
.felt3.win-down .stage-sum.down b { color: #ff8a8e; }
.felt3.win-up .stage-sum.up b { color: #8fb4ff; }
.felt3.win-down .stage-sum.up, .felt3.win-up .stage-sum.down { opacity: .5; }

/* boleta */
.ticket { display: grid; grid-template-columns: 1fr minmax(260px, 320px) 1fr; gap: 10px; align-items: stretch; }
@media (max-width: 860px) { .ticket { grid-template-columns: 1fr 1fr; } .ticket .amount { grid-column: 1 / -1; order: -1; } }
.order {
  display: flex; flex-direction: column; justify-content: space-between; gap: 6px;
  min-height: 132px; padding: 14px 16px; border-radius: 6px; text-align: left; color: #fff;
  border: 1px solid transparent; transition: background-color .12s, border-color .12s, transform .06s;
}
.order.down { background: #b8323a; border-color: #c94048; }
.order.up { background: #2b63d1; border-color: #3a74e3; }
.order:not(:disabled):hover.down { background: #c53a42; }
.order:not(:disabled):hover.up { background: #3170e0; }
.order:not(:disabled):active { transform: translateY(1px); }
.order:disabled { opacity: 1; filter: saturate(.55) brightness(.62); cursor: default; }
.order.won { filter: none !important; box-shadow: 0 0 0 2px #fff inset; }
.o-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.order .side-name { font-size: 24px; font-weight: 700; color: #fff !important; letter-spacing: 0; }
.o-ret { font-size: 15px; font-weight: 600; color: rgba(255,255,255,.85); }
.o-digits { font-size: 13px; color: rgba(255,255,255,.7); word-spacing: 4px; }
.o-foot { font-size: 12px; color: rgba(255,255,255,.75); }
.o-foot b { color: #fff; font-size: 15px; font-weight: 600; margin-left: 4px; }

.amount { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 12px; display: flex; flex-direction: column; gap: 9px; }
.a-label { font-size: 12px; color: var(--muted); }
.a-field { display: grid; grid-template-columns: 40px 1fr 40px; border: 1px solid var(--line-2); border-radius: 4px; overflow: hidden; background: #0e1217; }
.a-field input { border: 0; background: transparent; color: var(--text); text-align: center; font: 600 20px/1 inherit; font-feature-settings: "tnum" 1; padding: 9px 4px; min-width: 0; }
.a-field input:focus { outline: none; background: #121821; }
.a-step { border: 0; background: var(--panel-2); color: var(--text); font-size: 18px; }
.a-step:hover { background: #202733; }
.presets { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.presets .chip {
  all: unset; box-sizing: border-box; text-align: center; cursor: pointer;
  padding: 6px 0; border: 1px solid var(--line-2); border-radius: 4px; font-size: 13px; color: var(--muted); background: transparent;
}
.presets .chip:hover { color: var(--text); border-color: #3a4352; }
.presets .chip.sel { color: var(--text); border-color: var(--text); background: #1a2029; }
.presets .chip:focus-visible, .a-step:focus-visible, .link-btn:focus-visible, .order:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; }
.a-actions { display: flex; justify-content: space-between; gap: 6px; }
.link-btn { background: none; border: 0; padding: 2px 0; color: var(--muted); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #3a4352; }
.link-btn:not(:disabled):hover { color: var(--text); }
.amount .auto { margin: 0; font-size: 12px; }

/* fita + distribuição + execuções */
.market { display: grid; grid-template-columns: 1fr 360px; gap: 10px; }
@media (max-width: 960px) { .market { grid-template-columns: 1fr; } }
.tape-panel, .log-panel { padding: 14px; }
.tape { display: flex; gap: 3px; overflow-x: auto; padding-bottom: 6px; min-height: 34px; scrollbar-width: thin; }
.tape .t { flex: 0 0 26px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 3px; font-size: 13px; font-weight: 600; color: #fff; }
.tape .t.down { background: var(--odd-d); color: #ff9da0; border-bottom: 2px solid var(--odd); }
.tape .t.up { background: var(--even-d); color: #9dbcff; border-bottom: 2px solid var(--even); }
.tape .t.now { outline: 1px solid var(--text); outline-offset: 1px; }

.dist { display: grid; grid-template-columns: 1fr 190px; gap: 18px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
@media (max-width: 600px) { .dist { grid-template-columns: 1fr; } }
.dist-bars { display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; align-items: end; height: 120px; }
.db { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.db i { display: block; width: 100%; min-height: 2px; border-radius: 2px 2px 0 0; transition: height .4s ease; }
.db.down i { background: linear-gradient(180deg, #e5484d, #7a2124); }
.db.up i { background: linear-gradient(180deg, #3d7cf0, #1b3a78); }
.db span { font-size: 13px; font-weight: 600; margin-top: 5px; color: var(--text); }
.db em { position: absolute; top: -2px; font-style: normal; font-size: 10px; color: var(--muted); }
.dist-side { display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--muted); }
.ds-row { display: flex; justify-content: space-between; }
.ds-row b { color: var(--text); font-weight: 600; }
.ds-row b.down { color: #ff8a8e; } .ds-row b.up { color: #8fb4ff; }
.ds-meter { height: 6px; border-radius: 3px; background: var(--even); overflow: hidden; }
.ds-meter i { display: block; height: 100%; background: var(--odd); transition: width .4s ease; }
.ds-streak { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--line); }

.exec { width: 100%; border-collapse: collapse; font-size: 13px; }
.exec th { text-align: left; font-weight: 500; color: var(--muted); font-size: 12px; padding: 0 0 8px; border-bottom: 1px solid var(--line); }
.exec td { padding: 7px 0; border-bottom: 1px solid #1a1f27; }
.exec .num { text-align: right; font-weight: 600; }
.exec tbody { display: table-row-group; }
.log-panel { max-height: 330px; overflow: auto; }
.lbl { font-weight: 600; }
.lbl.down { color: #ff8a8e; } .lbl.up { color: #8fb4ff; }
.empty { color: var(--muted); font-size: 13px; margin: 12px 0 0; }
.empty[hidden] { display: none; }
#pnl b { font-weight: 600; }

/* remove restos do layout antigo */
.bets, .chips-row, .bottom { display: none; }
.market > * { min-width: 0; }
.tape-panel { overflow: hidden; }
.dist-bars { height: 104px; gap: 8px; }
.order .o-digits { margin-top: -2px; }

.db em { position: static; order: 3; margin-top: 2px; }
.dist-bars { height: 124px; }

/* ---------- boleta v2 ---------- */
.amount { padding: 14px; gap: 10px; background: linear-gradient(180deg, #151a21, #11151b); }
.tk-head { display: flex; justify-content: space-between; align-items: baseline; }
.tk-title { font-size: 15px; font-weight: 600; color: var(--text); }
.tk-bal { font-size: 12px; color: var(--muted); }
.tk-bal b { color: var(--text); font-weight: 600; margin-left: 4px; }

.tk-clock { display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border-radius: 4px; background: #0e1217; border: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.tk-clock-bar { height: 3px; border-radius: 2px; background: #1c222b; overflow: hidden; }
.tk-clock-bar i { display: block; height: 100%; width: 0; background: var(--pos); transition: width .2s linear, background-color .2s; }
.tk-clock.open { color: var(--text); border-color: #1f3b30; }
.tk-clock.hot { color: #ffd166; border-color: #4a3b16; }
.tk-clock.hot .tk-clock-bar i { background: #f0b429; }
.tk-clock.closed { color: var(--muted); }

.a-label { margin-bottom: -4px; }
.a-field { grid-template-columns: auto 1fr 34px; height: 54px; }
.a-cur { display: flex; align-items: center; padding: 0 0 0 12px; color: var(--muted); font-size: 14px; }
.a-field input { text-align: left; font-size: 24px; font-weight: 700; padding: 0 8px; }
.a-steps { display: grid; grid-template-rows: 1fr 1fr; border-left: 1px solid var(--line-2); }
.a-steps .a-step { font-size: 15px; line-height: 1; }
.a-steps .a-step + .a-step { border-top: 1px solid var(--line-2); }
.presets { grid-template-columns: repeat(6, 1fr); }
.presets .chip.half { color: var(--muted); }

.tk-info { margin: 0; display: grid; gap: 6px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 13px; }
.tk-info div { display: flex; justify-content: space-between; }
.tk-info dt { color: var(--muted); }
.tk-info dd { margin: 0; color: var(--text); font-weight: 600; }

.a-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line-2); border-radius: 4px; overflow: hidden; }
.seg { background: transparent; border: 0; padding: 8px 0; font-size: 12px; color: var(--text); }
.seg + .seg { border-left: 1px solid var(--line-2); }
.seg:not(:disabled):hover { background: #1a2029; }
.seg:disabled { color: #4f5866; opacity: 1; }

.switch { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); cursor: pointer; }
.switch input { position: absolute; opacity: 0; pointer-events: none; }
.switch .sw { position: relative; width: 32px; height: 18px; border-radius: 9px; background: #262d38; transition: background .15s; flex: 0 0 auto; }
.switch .sw::after { content: ""; position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #c5ccd6; transition: transform .15s; }
.switch input:checked + .sw { background: var(--pos); }
.switch input:checked + .sw::after { transform: translateX(14px); background: #fff; }
.switch input:focus-visible + .sw { outline: 2px solid #8fb4ff; outline-offset: 2px; }

/* botões de ordem mais "corretora" */
.order { min-height: 100%; }
.order .o-ret { background: rgba(0,0,0,.22); padding: 2px 8px; border-radius: 3px; }

.order { justify-content: space-between; gap: 10px; padding: 16px 18px; }
.o-top { display: flex; justify-content: space-between; align-items: baseline; }
.o-top .o-digits { word-spacing: 5px; }
.o-mid { display: flex; align-items: baseline; gap: 8px; }
.o-pct { font-size: 46px; font-weight: 700; line-height: 1; color: #fff; }
.o-cap { font-size: 13px; color: rgba(255,255,255,.75); }
.o-cta { display: block; text-align: center; padding: 10px 0; border-radius: 4px; background: rgba(0,0,0,.2); border: 1px solid rgba(255,255,255,.18); font-size: 14px; font-weight: 600; color: #fff; }
.order:not(:disabled):hover .o-cta { background: rgba(0,0,0,.3); border-color: rgba(255,255,255,.35); }
.order:disabled .o-cta { visibility: hidden; }
.o-foot { padding-top: 8px; border-top: 1px solid rgba(255,255,255,.18); }
.order { align-items: stretch; }
.o-top { gap: 12px; }

/* ---------- painéis de ordem (v0.12.2) ---------- */
.opanel { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 6px; background: var(--panel); border: 1px solid var(--line); }
.op-head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.op-name { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 600; color: var(--text); }
.op-mark { width: 10px; height: 10px; border-radius: 2px; }
.opanel.down .op-mark { background: var(--odd); }
.opanel.up .op-mark { background: var(--even); }
.op-digits { font-size: 12px; color: var(--muted); word-spacing: 3px; }
.op-data { margin: 0; display: grid; gap: 7px; font-size: 13px; flex: 1; }
.op-data div { display: flex; justify-content: space-between; }
.op-data dt { color: var(--muted); }
.op-data dd { margin: 0; color: var(--text); font-weight: 600; font-feature-settings: "tnum" 1; }

.side.obtn {
  display: block; width: 100%; padding: 0; height: 46px; border-radius: 4px; border: 0;
  font-size: 15px; font-weight: 600; color: #fff; text-align: center; letter-spacing: .2px;
  transition: background-color .12s, transform .06s;
}
.side.obtn.down { background: #c9353d; }
.side.obtn.up { background: #2f6fe0; }
.side.obtn.down:not(:disabled):hover { background: #d7414a; }
.side.obtn.up:not(:disabled):hover { background: #3b7bec; }
.side.obtn:not(:disabled):active { transform: translateY(1px); }
.side.obtn:disabled { background: #1c222b; color: #5d6676; cursor: default; opacity: 1; filter: none; }
.side.obtn:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; }
.opanel:has(.obtn.won).down { border-color: var(--odd); }
.opanel:has(.obtn.won).up { border-color: var(--even); }
.side.obtn.won { box-shadow: none; }

.op-data { flex: 0 0 auto; align-content: start; }
.op-spark { flex: 1; min-height: 46px; display: grid; grid-template-columns: repeat(30, 1fr); gap: 2px; align-items: end; padding: 10px 0 2px; border-top: 1px solid var(--line); }
.op-spark i { display: block; height: 30%; border-radius: 1px; background: #232a35; }
.opanel.down .op-spark i.hit { height: 100%; background: var(--odd); }
.opanel.up .op-spark i.hit { height: 100%; background: var(--even); }
.op-spark i.pad { background: #1a1f27; }
.side.obtn { display: flex; justify-content: space-between; align-items: center; padding: 0 16px; }
.side.obtn .ob-amt { font-weight: 500; opacity: .85; font-feature-settings: "tnum" 1; }
.side.obtn { flex-direction: row; }
.op-spark { flex: 0 0 auto; height: 44px; min-height: 0; padding-top: 8px; }
.op-spark i { height: 28%; }
.opanel .obtn { margin-top: auto; }
.op-spark-cap { display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); margin: -6px 0 0; }
.opanel .op-spark { margin-top: auto; }
.opanel .obtn { margin-top: 4px; }

/* ---------- martingale ---------- */
.gale { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 4px; background: #0e1217; }
.gale.on { border-color: #2a3a52; }
.gale-row { display: flex; justify-content: space-between; align-items: center; }
.gale .switch { color: var(--text); font-size: 13px; }
.gale-lv { display: grid; grid-template-columns: repeat(3, 28px); border: 1px solid var(--line-2); border-radius: 4px; overflow: hidden; }
.gale-lv button { background: transparent; border: 0; color: var(--muted); font-size: 12px; padding: 4px 0; }
.gale-lv button + button { border-left: 1px solid var(--line-2); }
.gale-lv button.sel { background: #1f2631; color: var(--text); }
.gale-prev { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--muted); }
.gale-prev b { color: var(--text); font-weight: 600; }
.gale-prev .g-risk { margin-left: auto; }
.gale:not(.on) .gale-prev { opacity: .65; }

/* ================= boleta exclusiva (v0.14) ================= */
.tk2 { gap: 12px; padding: 16px; background:
  radial-gradient(120% 60% at 50% 0%, #1a2230 0%, rgba(26,34,48,0) 60%), linear-gradient(180deg, #141921, #0f1318); }
.big-amt { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 6px; padding: 6px 0 2px; }
.big-amt .a-step { height: 44px; border-radius: 50%; border: 1px solid var(--line-2); background: #151b23; color: var(--text); font-size: 20px; }
.big-amt .a-step:hover { border-color: #3d4757; background: #1b222c; }
.ba-val { display: flex; align-items: baseline; justify-content: center; gap: 6px; min-width: 0; }
.ba-val input { width: 6ch; }
.ba-cur { font-size: 16px; color: var(--muted); font-weight: 600; }
.ba-val input { width: 100%; min-width: 0; max-width: 190px; border: 0; background: transparent; color: #fff; text-align: center;
  font-family: inherit; font-weight: 800; font-size: 44px; line-height: 1.05; letter-spacing: -1px; font-feature-settings: "tnum" 1; padding: 0; }
.ba-val input:focus { outline: none; }
.ba-val:focus-within { box-shadow: 0 2px 0 var(--even); }

.ruler { position: relative; height: 46px; margin: -2px 2px 0; }
.ruler-ticks { position: absolute; left: 0; right: 0; top: 8px; height: 16px; display: flex; justify-content: space-between; align-items: flex-start; pointer-events: none; }
.ruler-ticks i { width: 1px; height: 6px; background: #3a4352; }
.ruler-ticks i.m { height: 10px; background: #4b5566; }
.ruler-ticks i.l { height: 16px; background: #6b7686; }
.ruler-marks { position: absolute; left: 0; right: 0; top: 28px; height: 14px; font-size: 11px; color: var(--muted); pointer-events: none; }
.ruler-marks span { position: absolute; transform: translateX(-50%); }
.ruler input[type=range] { position: absolute; inset: 0 0 auto 0; width: 100%; height: 26px; margin: 0; background: transparent; -webkit-appearance: none; appearance: none; cursor: ew-resize; z-index: 2; }
.ruler input[type=range]::-webkit-slider-runnable-track { height: 26px; background: linear-gradient(90deg, rgba(61,124,240,.28) var(--p, 0%), transparent var(--p, 0%)); border-radius: 3px; }
.ruler input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 4px; height: 26px; border-radius: 2px; background: #fff; box-shadow: 0 0 0 3px rgba(255,255,255,.12); }
.ruler input[type=range]:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; }

.profit { display: flex; justify-content: space-between; align-items: flex-end; padding: 12px 14px; border-radius: 6px; background: #0d1a14; border: 1px solid #1d3a2c; }
.pf-cap { display: block; font-size: 11px; color: #7fa892; }
.pf-val { display: block; font-size: 26px; font-weight: 800; color: #3ddc97; letter-spacing: -.5px; font-feature-settings: "tnum" 1; }
.pf-side { text-align: right; }
.pf-side b { display: block; font-size: 17px; color: #d8f5e7; font-weight: 700; }

.ladder { gap: 10px; }
.g-risk-top { font-size: 12px; color: var(--muted); }
.g-risk-top b { color: #ffb4b6; font-weight: 600; }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; align-items: end; height: 96px; }
.st { all: unset; box-sizing: border-box; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; gap: 3px; cursor: pointer; text-align: center; }
.st[disabled] { cursor: default; }
.st i { display: block; border-radius: 3px 3px 0 0; background: #222a35; transition: height .3s ease, background-color .2s; }
.st-amt { font-size: 11px; font-weight: 700; color: var(--muted); font-feature-settings: "tnum" 1; }
.st-lbl { font-size: 10px; color: var(--muted); border-top: 1px solid var(--line-2); padding-top: 3px; }
.gale.on .st.use i { background: linear-gradient(180deg, #4a8cff, #24508f); }
.gale.on .st.use .st-amt { color: var(--text); }
.gale.on .st:first-child.use i { background: #5b6575; }
.st.done i { background: #6b2b2f !important; }
.st.now i { background: linear-gradient(180deg, #ffd166, #b8860b) !important; }
.st.now .st-amt { color: #ffd166 !important; }
.st:not([disabled]):hover i { filter: brightness(1.25); }
.st:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; border-radius: 3px; }
.ladder .gale-prev { font-size: 11px; }

/* valor por % da banca */
.bank { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.bk { all: unset; box-sizing: border-box; cursor: pointer; text-align: center; padding: 8px 0 7px; border-radius: 6px;
  background: #151b23; border: 1px solid var(--line-2); display: flex; flex-direction: column; gap: 2px; }
.bk b { font-size: 15px; color: var(--text); font-weight: 700; }
.bk span { font-size: 11px; color: var(--muted); font-feature-settings: "tnum" 1; }
.bk:hover { border-color: #3d4757; background: #1a212b; }
.bk.sel { border-color: var(--even); background: #13223d; }
.bk.sel span { color: #9dbcff; }
.bk:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; }
.bank-mods { display: flex; justify-content: space-between; padding: 0 4px; }
.bank-mods .link-btn { font-size: 13px; }
.big-amt { padding-bottom: 4px; }

.bank-mods { display: grid; grid-template-columns: 1fr 1fr 1fr 2.2fr; gap: 6px; padding: 0; }
.mod { background: #151b23; border: 1px solid var(--line-2); border-radius: 6px; color: var(--text); font-size: 13px; padding: 7px 0; }
.mod:hover:not(:disabled) { border-color: #3d4757; background: #1a212b; }
.mod:focus-visible { outline: 2px solid #8fb4ff; outline-offset: 2px; }
.gale-btn { font-weight: 700; background: #2a2210; border-color: #5a4614; color: #ffd166; }
.gale-btn:hover:not(:disabled) { background: #3a2f12; border-color: #8a6a1c; }
.gale-btn:disabled { background: #151b23; border-color: var(--line-2); color: #4f5866; font-weight: 600; cursor: default; }
.gale-hint { font-size: 11px; color: var(--muted); line-height: 1.45; margin-top: -4px; }
.gale-hint:empty { display: none; }
.gale-hint b { color: var(--text); font-weight: 600; }

.gale-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; line-height: 1.15; }
.gale-btn b { font-size: 13px; }
.gale-btn span { font-size: 12px; font-weight: 600; color: #ffe39a; font-feature-settings: "tnum" 1; }

/* ---------- vitrine dos lados (v0.15) ---------- */
.opanel { position: relative; overflow: hidden; gap: 10px; }
.opanel.down { background: radial-gradient(90% 55% at 50% 38%, rgba(229,72,77,.14), rgba(229,72,77,0) 70%), var(--panel); }
.opanel.up { background: radial-gradient(90% 55% at 50% 38%, rgba(61,124,240,.16), rgba(61,124,240,0) 70%), var(--panel); }
.op-head { border-bottom: 0; padding-bottom: 0; }
.op-name { font-size: 22px; font-weight: 800; }
.op-mark { width: 12px; height: 12px; }
.op-die { position: relative; flex: 1 1 auto; min-height: 170px; margin: -6px -14px 0; cursor: grab; }
.op-die .preview-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.op-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.op-grid div { background: #10141a; padding: 9px 11px; display: flex; flex-direction: column; gap: 2px; }
.op-grid span { font-size: 11px; color: var(--muted); }
.op-grid b { font-size: 18px; font-weight: 700; color: var(--text); font-feature-settings: "tnum" 1; }
.opanel.down .op-grid div:nth-child(4) b, .opanel.up .op-grid div:nth-child(4) b { color: #3ddc97; }
.opanel .op-spark { margin-top: 0; height: 34px; }
.side.obtn { height: 56px; font-size: 17px; border-radius: 6px; }
.side.obtn.down { background: linear-gradient(180deg, #e0444c, #b52d35); }
.side.obtn.up { background: linear-gradient(180deg, #4383f5, #2559c7); }
.side.obtn.down:not(:disabled):hover { background: linear-gradient(180deg, #ea525a, #c2343c); }
.side.obtn.up:not(:disabled):hover { background: linear-gradient(180deg, #5190ff, #2b63d6); }
.side.obtn:not(:disabled) { box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 6px 16px rgba(0,0,0,.35); }
.side.obtn.down:disabled, .side.obtn.up:disabled { background: #1a2029; color: #6b7585; box-shadow: none; }
.side.obtn.won.down { background: linear-gradient(180deg, #e0444c, #b52d35); color: #fff; }
.side.obtn.won.up { background: linear-gradient(180deg, #4383f5, #2559c7); color: #fff; }

.asset { color: var(--text); font-weight: 600; font-size: 13px; }

/* ---------- vida nos painéis (v0.17) ---------- */
.flash-up { animation: flashUp .7s ease-out; }
.flash-down { animation: flashDown .7s ease-out; }
@keyframes flashUp { 0% { color: #3ddc97; } 100% { } }
@keyframes flashDown { 0% { color: #ff6b70; } 100% { } }

.op-spark i { transform-origin: bottom; transition: height .35s ease; }
.op-spark i.last { box-shadow: 0 0 0 1px rgba(255,255,255,.55); }
.op-spark i.new { animation: barIn .55s cubic-bezier(.2,.9,.3,1.2); }
@keyframes barIn { from { transform: scaleY(0); opacity: .2; } to { transform: scaleY(1); opacity: 1; } }

.opanel.won-flash.down { animation: wonDown 1.1s ease-out; }
.opanel.won-flash.up { animation: wonUp 1.1s ease-out; }
@keyframes wonDown { 0% { border-color: var(--odd); box-shadow: 0 0 0 1px var(--odd), 0 0 30px rgba(229,72,77,.35); } 100% { border-color: var(--line); box-shadow: none; } }
@keyframes wonUp { 0% { border-color: var(--even); box-shadow: 0 0 0 1px var(--even), 0 0 30px rgba(61,124,240,.35); } 100% { border-color: var(--line); box-shadow: none; } }

.side.obtn { position: relative; overflow: hidden; }
.side.obtn .ob-lbl, .side.obtn .ob-amt { position: relative; z-index: 1; }
.side.obtn .ob-time { position: absolute; left: 0; bottom: 0; height: 4px; width: var(--left, 0%); background: rgba(255,255,255,.55); transition: width .2s linear, background-color .2s; }
.side.obtn.hot .ob-time { background: #ffd166; }
.side.obtn:disabled .ob-time { display: none; }
.side.obtn.press { animation: press .25s ease-out; }
@keyframes press { 0% { transform: scale(.97); } 100% { transform: none; } }

.opanel { position: relative; }
.float-amt { position: absolute; right: 22px; bottom: 70px; font-weight: 800; font-size: 16px; color: #fff; pointer-events: none;
  text-shadow: 0 2px 6px rgba(0,0,0,.5); animation: floatUp .9s ease-out forwards; z-index: 3; }
@keyframes floatUp { 0% { opacity: 0; transform: translateY(10px); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(-36px); } }

@media (prefers-reduced-motion: reduce) {
  .flash-up, .flash-down, .op-spark i.new, .opanel.won-flash, .side.obtn.press, .float-amt { animation: none !important; }
}

/* ---------- cotação + posição (v0.17.1) ---------- */
.op-quote { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 4px 2px 12px; border-bottom: 1px solid var(--line); }
.oq-mult b { display: block; font-size: 38px; font-weight: 800; line-height: 1; letter-spacing: -1px; color: #fff; font-feature-settings: "tnum" 1; }
.oq-mult span { display: block; margin-top: 6px; font-size: 12px; color: var(--muted); }
.oq-mult em { font-style: normal; color: var(--text); font-weight: 600; }
.oq-ring { position: relative; width: 74px; height: 74px; flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.oq-ring svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.oq-ring circle { fill: none; stroke-width: 4; }
.rg-bg { stroke: #232a35; }
.rg-fg { stroke-linecap: round; transition: stroke-dashoffset .6s ease; stroke-dasharray: 113; stroke-dashoffset: 113; }
.opanel.down .rg-fg { stroke: var(--odd); }
.opanel.up .rg-fg { stroke: var(--even); }
.oq-ring b { position: relative; font-size: 17px; font-weight: 800; color: var(--text); line-height: 1; }
.oq-ring span { position: relative; font-size: 9px; color: var(--muted); margin-top: 3px; }

.op-pos { min-height: 40px; display: flex; align-items: center; padding: 0 2px; font-size: 13px; color: var(--muted); }
.op-pos .pos-line { display: none; align-items: baseline; gap: 8px; }
.op-pos.has .pos-empty { display: none; }
.op-pos.has .pos-line { display: flex; }
.op-pos .pos-line b { font-size: 20px; font-weight: 800; color: var(--text); font-feature-settings: "tnum" 1; }
.op-pos .pos-line i { font-style: normal; font-size: 12px; color: var(--muted); }
.op-pos .pos-line b.pos-ret { color: #3ddc97; }
.op-grid { display: none; }

/* ---------- últimos resultados como dadinhos (v0.17.2) ---------- */
.op-pos .pos-empty { display: none; }
.op-pos { min-height: 0; }
.op-pos:not(.has) { display: none; }
.op-last { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.ol-head { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); }
.ol-streak { font-weight: 700; }
.opanel.down .ol-streak { color: #ff8a8e; }
.opanel.up .ol-streak { color: #8fb4ff; }
.ol-row { display: grid; grid-template-columns: repeat(10, 1fr); gap: 5px; align-items: end; }
.ol-d { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 13px; font-weight: 800; font-feature-settings: "tnum" 1; }
.ol-d.miss { background: transparent; border: 1px solid #262e3a; color: #4d5767; font-weight: 600; }
.opanel.down .ol-d.hit { background: linear-gradient(180deg, #e54850, #a92a31); color: #fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.25); }
.opanel.up .ol-d.hit { background: linear-gradient(180deg, #4a88f5, #2556c2); color: #fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.25); }
.ol-d.last { outline: 2px solid rgba(255,255,255,.75); outline-offset: 1px; }
.ol-d.new { animation: dieIn .5s cubic-bezier(.2,.9,.3,1.3); }
@keyframes dieIn { from { transform: translateY(-14px) rotate(-25deg) scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ol-d.new { animation: none; } }

/* ---------- ordem aberta / cancelar (v0.17.3) ---------- */
.opanel.down { --sc: #e5484f; --sc-soft: rgba(229,72,79,.12); }
.opanel.up { --sc: #4a88f5; --sc-soft: rgba(74,136,245,.12); }
.opanel.in-pos { border-color: var(--sc); box-shadow: inset 0 0 0 1px var(--sc), 0 0 0 0 transparent; }
.op-pos.has { display: flex; flex-direction: column; align-items: stretch; gap: 6px; padding: 10px 12px; border-radius: 8px;
  background: linear-gradient(90deg, var(--sc-soft), transparent 85%); border-left: 3px solid var(--sc); animation: posIn .35s cubic-bezier(.2,.9,.3,1.1); }
.pos-tag { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text); font-weight: 700; }
.pos-tag .pos-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sc); box-shadow: 0 0 0 0 var(--sc); animation: posPulse 1.6s ease-out infinite; }
.pos-tag .pos-hint { margin-left: auto; font-style: normal; font-weight: 500; font-size: 11px; color: var(--muted); }
.pos-tag.live .pos-dot { background: #ffd166; animation: none; }
@keyframes posPulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--sc) 70%, transparent); } 100% { box-shadow: 0 0 0 8px transparent; } }
@keyframes posIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* botão vira "Cancelar ordem" */
.side.obtn.armed:not(:disabled) { background: #11161d !important; color: var(--text); box-shadow: inset 0 0 0 2px var(--sc) !important; }
.side.obtn.armed:not(:disabled):hover { background: #1a1f27 !important; }
.side.obtn.armed:not(:disabled) .ob-lbl::before { content: "✕"; display: inline-block; margin-right: 10px; font-size: 13px; opacity: .8; }
.side.obtn.armed .ob-amt { color: var(--sc); opacity: 1; font-weight: 700; }
.side.obtn.armed .ob-time { background: var(--sc); opacity: .6; }
.side.obtn.armed:disabled { background: #141920 !important; color: #c9d1dc; box-shadow: inset 0 0 0 1px var(--sc) !important; }
@media (prefers-reduced-motion: reduce) { .op-pos.has, .pos-tag .pos-dot { animation: none; } }

/* moeda da conta (v0.17.4) */
.op-quote span .cur, span.cur { display: inline !important; margin: 0 !important; font: inherit !important; color: inherit !important; }
.ba-cur.cur { display: inline-block !important; font-size: 15px !important; font-weight: 600 !important; color: var(--muted) !important; }

/* ---------- card de resultado green / loss (v0.18.1) ---------- */
.rcard { position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(3,5,8,.62); backdrop-filter: blur(3px); animation: rcFade .25s ease-out; }
.rcard[hidden] { display: none; }
.rc-box { position: relative; width: min(560px, calc(100vh - 140px), 100%); animation: rcIn .45s cubic-bezier(.2,.9,.3,1.15); }
.rc-img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px #222a35; }
.rc-x { position: absolute; top: -14px; right: -14px; width: 34px; height: 34px; border-radius: 50%; border: 1px solid #2a3340; background: #151a23; color: #c9d1dc; font-size: 14px; z-index: 1; }
.rc-x:hover { background: #1f2630; color: #fff; }
.rc-act { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.rc-act button { height: 44px; border-radius: 8px; border: 1px solid #2a3340; background: #151a23; color: #e6ebf1; font-size: 14px; font-weight: 600; }
.rc-act button:hover { background: #1c222c; }
.rcard.win { --rc: #2fd68a; } .rcard.loss { --rc: #ff5a5f; }
.rc-act .rc-save { background: var(--rc); border-color: transparent; color: #071009; }
.rcard.loss .rc-act .rc-save { color: #fff; }
.rc-act .rc-save:hover { filter: brightness(1.08); background: var(--rc); }
@keyframes rcFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rcIn { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .rcard, .rc-box { animation: none; } }

/* =====================================================================
   v0.19 — plataforma: topo + menu de jogos + jogo inteiro numa tela
   ===================================================================== */
:root { --top-h: 56px; --rail-w: 212px; --order-w: 340px; --gap: 12px; }
body.app { background: #07090d; min-height: 100vh; }

/* topo */
.app .top { position: fixed; inset: 0 0 auto 0; height: var(--top-h); z-index: 30; display: flex; align-items: center; gap: 24px;
  padding: 0 18px 0 0; background: #0a0d12; border-bottom: 1px solid #171d27; backdrop-filter: none; }
.app .brand { width: var(--rail-w); flex: 0 0 auto; height: 100%; display: flex; align-items: center; gap: 10px; padding-left: 20px; border-right: 1px solid #171d27; }
.app .brand strong { font-size: 17px; font-weight: 800; letter-spacing: .04em; color: #fff; }
.logo { position: relative; width: 22px; height: 22px; }
.logo i { position: absolute; width: 14px; height: 14px; border-radius: 4px; }
.logo i:first-child { left: 0; top: 0; background: #e5484f; }
.logo i:last-child { right: 0; bottom: 0; background: #3b7cf0; box-shadow: -2px -2px 0 #0a0d12; }
.ticker { display: flex; align-items: center; gap: 14px; min-width: 0; }
.tk-asset { font-size: 13px; color: #c9d1dc; white-space: nowrap; }
.tk-asset b { font-weight: 700; }
.tk-asset em { font-style: normal; font-size: 11px; color: var(--muted); border: 1px solid #263040; border-radius: 4px; padding: 1px 5px; margin-left: 4px; }
.tk-price { font-size: 17px; font-weight: 700; color: #fff; font-feature-settings: "tnum" 1; min-width: 92px; }
.tk-price .p-dig { display: inline-block; min-width: .7em; text-align: center; border-radius: 3px; margin-left: 1px; }
.tk-price .p-dig.down { color: #ff7a80; }
.tk-price .p-dig.up { color: #7fa9ff; }
.tk-chg { font-size: 12px; font-feature-settings: "tnum" 1; color: var(--muted); min-width: 48px; }
.tk-chg.up { color: #3ddc97; } .tk-chg.down { color: #ff7a80; }
.app .conn { font-size: 12px; white-space: nowrap; }
.app .controls { margin-left: auto; gap: 14px; flex-wrap: nowrap; }
.icon-btn { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; border: 1px solid #1f2632; background: #0f131a; color: #c9d1dc; }
.icon-btn:hover { background: #151a23; color: #fff; }
.icon-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icon-btn.muted .w { display: none; }
.icon-btn.muted { color: #5d6676; }
.app .balance { flex-direction: column; align-items: flex-end; gap: 0; line-height: 1.15; padding: 0 4px; }
.app .balance span { font-size: 11px; }
.app .balance strong { font-size: 16px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; }

/* menu de jogos */
.rail { position: fixed; top: var(--top-h); bottom: 0; left: 0; width: var(--rail-w); z-index: 20; display: flex; flex-direction: column; gap: 2px;
  padding: 14px 10px; background: #0a0d12; border-right: 1px solid #171d27; overflow-y: auto; }
.rail-cap { font-size: 11px; color: #5d6676; padding: 12px 10px 6px; }
.rail-cap:first-child { padding-top: 2px; }
.rail-item { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 10px; border-radius: 8px; color: #aab3bf; font-size: 14px; font-weight: 600;
  text-decoration: none; border: 0; background: none; text-align: left; width: 100%; cursor: pointer; }
.rail-item svg { width: 19px; height: 19px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.rail-item svg .f { fill: currentColor; stroke: none; }
.rail-item:hover { background: #121720; color: #fff; }
.rail-item.active { background: #141a24; color: #fff; box-shadow: inset 2px 0 0 #e5484f, inset 0 0 0 1px #1d2430; }
.rail-item.soon { color: #5d6676; cursor: default; }
.rail-item.soon:hover { background: none; color: #5d6676; }
.rail-item em { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 600; color: #6b7585; border: 1px solid #222a35; border-radius: 4px; padding: 1px 5px; }
.rail-foot { margin-top: auto; padding: 12px 10px 4px; font-size: 11px; line-height: 1.5; color: #4d5767; border-top: 1px solid #151b24; }

/* área principal */
.shell { margin-left: var(--rail-w); padding: calc(var(--top-h) + 14px) 16px 40px; display: flex; flex-direction: column; gap: 14px; max-width: none; }
.play { display: grid; grid-template-columns: minmax(0, 1fr) var(--order-w); gap: var(--gap);
  height: calc(100vh - var(--top-h) - 28px); min-height: 620px; }
.stage-col { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; min-height: 0; }
.app .stage-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 12px; border-radius: 12px; background: #05070a; border-color: #161c26; }
.app .stage-top { align-items: center; padding: 0 4px; }
.st-left { display: flex; align-items: baseline; gap: 12px; }
.st-game { font-size: 15px; font-weight: 800; color: #fff; }
.app .stage-top .status { font-size: 13px; font-weight: 600; color: #aab3bf; }
.app .round-no { font-size: 12px; color: var(--muted); }
.app .stage-wrap .progress { margin: 10px 4px; flex: 0 0 auto; }
.app .felt3 { flex: 1 1 auto; min-height: 240px; display: flex; }
.app .felt3d { height: auto; flex: 1 1 auto; min-height: 0; }

/* painéis Ímpar / Par compactos */
.app .sides { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); flex: 0 0 auto; }
.app .sides .opanel { display: grid; grid-template-columns: 118px minmax(0, 1fr); column-gap: 14px; row-gap: 8px; padding: 12px 14px 14px;
  grid-template-areas: "die head" "die quote" "die last" "pos pos" "btn btn"; border-radius: 10px; }
.app .sides .opanel.down { background: radial-gradient(60% 90% at 10% 30%, rgba(229,72,77,.12), transparent 70%), var(--panel); }
.app .sides .opanel.up { background: radial-gradient(60% 90% at 10% 30%, rgba(61,124,240,.14), transparent 70%), var(--panel); }
.app .sides .op-head { grid-area: head; align-items: center; }
.app .sides .op-name { font-size: 18px; }
.app .sides .op-die { grid-area: die; min-height: 0; height: 128px; margin: -4px 0 0 -8px; }
.app .sides .op-quote { grid-area: quote; padding: 0 0 8px; }
.app .sides .oq-mult b { font-size: 30px; }
.app .sides .oq-mult span { margin-top: 4px; font-size: 11.5px; }
.app .sides .oq-ring { width: 54px; height: 54px; }
.app .sides .oq-ring b { font-size: 13px; }
.app .sides .oq-ring span { font-size: 8px; margin-top: 1px; }
.app .sides .op-last { grid-area: last; margin-top: 0; gap: 6px; }
.app .sides .ol-row { gap: 4px; }
.app .sides .ol-d { font-size: 12px; border-radius: 5px; }
.app .sides .op-pos { grid-area: pos; }
.app .sides .obtn { grid-area: btn; height: 50px; margin-top: 2px; font-size: 16px; }

/* boleta */
.order-col { min-height: 0; display: flex; }
.order-col .amount.tk2 { flex: 1 1 auto; min-height: 0; overflow-y: auto; border-radius: 12px; scrollbar-width: thin; }

/* histórico abaixo */
.app .market { grid-template-columns: minmax(0, 1fr) 420px; }
.app .market .panel { border-radius: 12px; }
#history { scroll-margin-top: calc(var(--top-h) + 14px); }

/* como funciona */
.rules-dlg { width: min(560px, calc(100vw - 32px)); padding: 0; border: 1px solid #222a35; border-radius: 14px; background: #0d1117; color: var(--text); box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.rules-dlg::backdrop { background: rgba(3,5,8,.62); backdrop-filter: blur(3px); }
.rd-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid #1a212c; }
.rd-head h2 { margin: 0; font-size: 17px; }
.rd-x { width: 32px; height: 32px; border-radius: 8px; border: 1px solid #222a35; background: #131820; color: #c9d1dc; }
.rd-list { margin: 0; padding: 18px 22px 22px 42px; display: grid; gap: 12px; font-size: 14px; line-height: 1.55; color: #aab3bf; }
.rd-list b { color: #e6ebf1; }
.rd-list li::marker { color: #5d6676; font-weight: 700; }

/* telas menores */
@media (max-height: 760px) {
  .app .sides .op-die { height: 108px; }
  .app .sides .oq-mult b { font-size: 26px; }
  .app .sides .obtn { height: 44px; }
}
@media (max-width: 1180px) {
  :root { --rail-w: 64px; --order-w: 320px; }
  .rail-item span, .rail-item em, .rail-cap, .rail-foot, .app .brand strong { display: none; }
  .rail-item { justify-content: center; padding: 0; }
  .app .brand { padding-left: 0; justify-content: center; }
}
@media (max-width: 900px) {
  .rail { display: none; }
  .shell { margin-left: 0; }
  .app .brand { width: auto; border: 0; padding-left: 16px; }
  .app .brand strong { display: inline; }
  .tk-asset, .tk-chg { display: none; }
  .play { grid-template-columns: 1fr; height: auto; }
  .app .felt3 { min-height: 300px; }
  .app .market { grid-template-columns: 1fr; }
}
.rail-item span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rail-item em { font-size: 10px; padding: 1px 4px; white-space: nowrap; }
.app .sides .oq-mult span { white-space: nowrap; }
.rail-item.soon { display: grid; grid-template-columns: 19px 1fr; grid-template-rows: auto auto; column-gap: 10px; row-gap: 0; height: 46px; align-content: center; }
.rail-item.soon svg { grid-row: 1 / 3; align-self: center; }
.rail-item.soon span { overflow: visible; }
.rail-item.soon em { margin: 0; border: 0; padding: 0; font-size: 11px; font-weight: 500; color: #4d5767; line-height: 1.2; }
/* posição aberta ocupa o lugar dos últimos resultados — o painel não muda de altura */
.app .sides .opanel { grid-template-areas: "die head" "die quote" "die last" "btn btn"; }
.app .sides .op-pos { grid-area: last; }
.app .sides .opanel.in-pos .op-last { display: none; }
.app .sides .op-pos.has { gap: 4px; padding: 7px 10px; min-height: 52px; justify-content: center; }
.app .sides .pos-tag .pos-hint { display: none; }
.app .sides .op-pos .pos-line b { font-size: 17px; }
.app .sides .opanel { grid-template-rows: auto auto 54px auto; }
.app .sides .op-last, .app .sides .op-pos.has { height: 54px; min-height: 0; box-sizing: border-box; }
.app .sides .op-pos.has { padding: 6px 10px; gap: 3px; }
.app .sides .pos-tag { font-size: 11.5px; }
.app .sides .op-pos .pos-line { white-space: nowrap; gap: 6px; }
.app .sides .op-pos .pos-line b { font-size: 16px; }
.app .sides .op-pos .pos-line i { font-size: 11px; }
/* últimos resultados: dadinhos de tamanho fixo (não estouram em tela larga) */
.app .sides .ol-row { display: flex; gap: 5px; align-items: center; height: 26px; }
.app .sides .ol-d { width: 26px; height: 26px; aspect-ratio: auto; flex: 0 0 26px; }
.app .sides .op-last { overflow: hidden; justify-content: flex-start; }
@media (max-height: 760px) { .app .sides .ol-d { width: 23px; height: 23px; flex-basis: 23px; } .app .sides .ol-row { height: 23px; } }
/* botão com ordens fechadas */
.app .sides .obtn:disabled:not(.armed) { background: #121720 !important; color: #6b7585; box-shadow: inset 0 0 0 1px #1d2430 !important; }
.app .sides .obtn:disabled:not(.armed) .ob-amt { opacity: .6; }

/* ---------- histórico do mercado (v0.20) ---------- */
.app .market { grid-template-columns: minmax(0, 1fr) 400px; align-items: stretch; }
.mk-panel { padding: 0 !important; display: flex; flex-direction: column; overflow: hidden; }
.mk-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid #1a212c; }
.mk-head h2 { margin: 0; font-size: 15px; font-weight: 700; color: #fff; }
.mk-sub { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.mk-win { display: flex; border: 1px solid #222a35; border-radius: 7px; overflow: hidden; }
.mk-win button { min-width: 44px; height: 30px; border: 0; background: transparent; color: #8a95a3; font-size: 12px; font-weight: 700; }
.mk-win button + button { border-left: 1px solid #222a35; }
.mk-win button:hover { color: #fff; background: #131820; }
.mk-win button.on { background: #1a212b; color: #fff; }
.mk-body { display: grid; grid-template-columns: auto minmax(0, 1fr) 250px; flex: 1 1 auto; }
.mk-block { padding: 16px 18px 18px; min-width: 0; display: flex; flex-direction: column; }
.mk-block + .mk-block { border-left: 1px solid #1a212c; }
.mk-cap { display: flex; flex-direction: column; gap: 2px; margin-bottom: 14px; }
.mk-cap span { font-size: 13px; font-weight: 700; color: #d8dee6; }
.mk-cap em { font-style: normal; font-size: 11px; color: #5d6676; }

/* mapa 10×10 */
.bead { display: grid; grid-auto-flow: column; grid-template-rows: repeat(10, 22px); grid-auto-columns: 22px; gap: 3px; }
.bd { display: grid; place-items: center; border-radius: 4px; font-size: 11px; font-weight: 700; font-feature-settings: "tnum" 1; }
.bd.empty { background: #0f131a; }
.bd.down { background: rgba(229,72,79,.16); color: #ff8a8e; box-shadow: inset 0 0 0 1px rgba(229,72,79,.22); }
.bd.up { background: rgba(59,124,240,.16); color: #8fb4ff; box-shadow: inset 0 0 0 1px rgba(59,124,240,.24); }
.bd.now { outline: 2px solid #fff; outline-offset: 1px; color: #fff; }
.bd.now.down { background: #c9363e; } .bd.now.up { background: #2f69d8; }
.bd.pop { animation: bdPop .6s cubic-bezier(.2,.9,.3,1.4); }
@keyframes bdPop { 0% { transform: scale(.3); opacity: 0; } 100% { transform: none; opacity: 1; } }

/* frequência por dígito */
.dchart { position: relative; flex: 1 1 auto; min-height: 190px; display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; }
.dchart::before { content: ""; position: absolute; left: 0; right: 0; bottom: 22px; height: 1px; background: #232b37; }
.dc-exp { position: absolute; left: 0; right: 0; height: 0; border-top: 1px dashed #4d5767; z-index: 1; pointer-events: none; transition: bottom .5s ease; }
.dc-exp::after { content: "10%"; position: absolute; right: 0; top: -15px; font-size: 10px; color: #5d6676; font-style: normal; }
.dcol { position: relative; }
.dcol i { position: absolute; left: 50%; bottom: 22px; width: min(18px, 60%); transform: translateX(-50%); border-radius: 3px 3px 0 0; transition: height .6s cubic-bezier(.2,.8,.2,1); }
.dcol.down i { background: linear-gradient(180deg, rgba(229,72,79,.85), rgba(229,72,79,.35)); }
.dcol.up i { background: linear-gradient(180deg, rgba(59,124,240,.9), rgba(59,124,240,.35)); }
.dcol em { position: absolute; left: 0; right: 0; text-align: center; font-style: normal; font-size: 10.5px; font-weight: 600; color: #7f8a97; transition: bottom .6s cubic-bezier(.2,.8,.2,1); font-feature-settings: "tnum" 1; }
.dcol span { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; font-size: 13px; font-weight: 800; color: #c9d1dc; }
.dcol.hot em { color: #fff; }
.dcol.cold em { color: #4d5767; }
.dcol.cold i { opacity: .55; }

/* ímpar × par */
.sum-big { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sb span { display: block; font-size: 12px; color: var(--muted); }
.sb b { font-size: 30px; font-weight: 800; line-height: 1.1; font-feature-settings: "tnum" 1; }
.sb.down b { color: #ff7a80; } .sb.up { text-align: right; } .sb.up b { color: #7fa9ff; }
.mk-sum .ds-meter { margin: 10px 0 14px; height: 6px; border-radius: 3px; background: #3b7cf0; overflow: hidden; }
.mk-sum .ds-meter i { display: block; height: 100%; background: #e5484f; transition: width .6s ease; box-shadow: 2px 0 0 #07090d; }
.sum-tab { width: 100%; border-collapse: collapse; font-size: 12.5px; font-feature-settings: "tnum" 1; }
.sum-tab th { font-weight: 600; font-size: 11px; color: #5d6676; text-align: right; padding: 0 0 6px; }
.sum-tab th:first-child { text-align: left; }
.sum-tab td { padding: 6px 0; border-top: 1px solid #171d27; text-align: right; color: #9aa5b3; }
.sum-tab td:first-child { text-align: left; color: #7f8a97; }
.sum-tab tr.on td:first-child { color: #fff; font-weight: 700; }
.sum-tab td.lead { color: #fff; font-weight: 700; }
.sum-rows { margin-top: auto; padding-top: 12px; display: grid; gap: 6px; font-size: 12.5px; }
.sum-rows div { display: flex; justify-content: space-between; color: #7f8a97; }
.sum-rows b { color: #e6ebf1; }
.sum-rows b.down { color: #ff8a8e; } .sum-rows b.up { color: #8fb4ff; }

@media (max-width: 1500px) {
  .app .market { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .mk-body { grid-template-columns: 1fr; }
  .mk-block + .mk-block { border-left: 0; border-top: 1px solid #1a212c; }
}
.dchart { padding-right: 34px; }
.dchart::before { right: 34px; }
.dc-exp { right: 0; }
.dc-exp::after { top: -7px; right: 0; color: #6b7585; }

/* ---------- gráfico ao vivo + feed de rodadas (v0.21) ---------- */
.app .market { grid-template-columns: minmax(0, 1fr) 470px; align-items: stretch; }
.market2 { display: block; }
.lc-panel, .feed-panel { padding: 0 !important; display: flex; flex-direction: column; overflow: hidden; border-radius: 12px; }
.lc-panel { min-height: 360px; }
.lc-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 12px 16px; border-bottom: 1px solid #161c26; }
.lc-title { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.lc-title h2 { margin: 0; font-size: 14px; font-weight: 700; color: #e6ebf1; white-space: nowrap; }
.lc-px { font-size: 18px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; }
.lc-px b.down { color: #ff7a80; } .lc-px b.up { color: #7fa9ff; }
.lc-chg { font-size: 12px; font-weight: 600; color: var(--muted); font-feature-settings: "tnum" 1; }
.lc-chg.up { color: #2fbf7a; } .lc-chg.down { color: #ff7a80; }
.lc-tools { display: flex; align-items: center; gap: 14px; }
.lc-stat { font-size: 12px; color: var(--muted); white-space: nowrap; }
.lc-stat b { font-weight: 700; } .lc-stat b.down { color: #ff8a8e; } .lc-stat b.up { color: #8fb4ff; }
.lc-wrap { position: relative; flex: 1 1 auto; min-height: 300px; background: #07090d; }
.lc-wrap canvas { position: absolute; inset: 0; display: block; }
.mk-win { display: flex; border: 1px solid #222a35; border-radius: 6px; overflow: hidden; }
.mk-win button { min-width: 38px; height: 28px; border: 0; background: transparent; color: #8a95a3; font-size: 12px; font-weight: 700; }
.mk-win button + button { border-left: 1px solid #222a35; }
.mk-win button:hover { color: #fff; background: #131820; }
.mk-win button.on { background: #1a212b; color: #fff; }

.feed-panel { max-height: 100%; }
.feed-cols, .fr { display: grid; grid-template-columns: 66px 48px 1fr 92px 112px; align-items: center; gap: 8px; padding: 0 16px; }
.feed-cols { height: 32px; font-size: 11px; color: #5d6676; border-bottom: 1px solid #141a23; }
.feed-cols .r { text-align: right; }
.feed { flex: 1 1 auto; overflow-y: auto; max-height: 400px; scrollbar-width: thin; scrollbar-color: #222a35 transparent; }
.feed .empty { margin: 0; padding: 18px 16px; color: var(--muted); font-size: 13px; }
.fr { height: 40px; border-bottom: 1px solid #10151c; font-size: 12.5px; font-feature-settings: "tnum" 1; }
.fr:hover { background: #0e1218; }
.fr.in { animation: frIn .5s ease-out; }
@keyframes frIn { from { background: #18202c; } to { background: transparent; } }
.f-t { color: #7f8a97; }
.f-n { color: #5d6676; }
.f-px { color: #c9d1dc; font-weight: 600; }
.f-px b { font-weight: 800; } .f-px b.down { color: #ff7a80; } .f-px b.up { color: #7fa9ff; }
.f-res { font-weight: 700; display: flex; flex-direction: column; line-height: 1.15; }
.f-res.down { color: #ff8a8e; } .f-res.up { color: #8fb4ff; }
.f-res em { font-style: normal; font-size: 11px; font-weight: 700; }
.f-res em.pos { color: #3ddc97; } .f-res em.neg { color: #ff7a80; }
.fr.mine { box-shadow: inset 2px 0 0 #d2b26a; }
.f-dice { display: flex; justify-content: flex-end; gap: 8px; }
.fd-pair { display: flex; gap: 2px; }
.fd-pair img { width: 20px; height: 20px; display: block; }
.fd-pair.l { opacity: .38; filter: saturate(.6); }
@media (max-width: 1500px) { .app .market { grid-template-columns: minmax(0, 1fr) 430px; } .feed-cols, .fr { grid-template-columns: 62px 44px 1fr 84px 100px; } .fd-pair img { width: 18px; height: 18px; } }
@media (max-width: 1250px) { .app .market { grid-template-columns: 1fr; } }
.feed-cols span { white-space: nowrap; }
.feed-cols, .fr { grid-template-columns: 64px 44px minmax(96px, 1fr) 84px 108px; }
.feed-cols, .fr { grid-template-columns: 58px 38px minmax(76px, 1fr) 68px 96px !important; gap: 6px; padding: 0 14px; }
.fd-pair img { width: 18px !important; height: 18px !important; }
.f-dice { gap: 6px; }

/* =========== v0.22 — boleta no meio, colada nos botões =========== */
.play { grid-template-columns: minmax(0, 1fr) !important; }
.app .sides { grid-template-columns: minmax(0, 1fr) 330px minmax(0, 1fr); align-items: stretch; }
.app .sides .opanel { align-content: start; }
.app .sides .opanel .obtn { align-self: end; }
.app .sides .opanel { grid-template-rows: auto auto 54px 1fr; }

.oc { padding: 12px 14px !important; gap: 8px !important; border-radius: 10px; overflow: visible !important; }
.oc .tk-clock { padding: 7px 10px; }
.oc .big-amt { margin: 2px 0 0; }
.oc .big-amt .a-step { width: 38px; height: 38px; }
.oc .ba-val input { font-size: 38px; }
.oc-profit { display: flex; align-items: baseline; justify-content: center; gap: 8px; font-size: 12px; color: var(--muted); margin-top: -2px; }
.oc-profit > b { font-size: 15px; font-weight: 800; color: #3ddc97; font-feature-settings: "tnum" 1; }
.oc-profit em { font-style: normal; }
.oc-profit em b { color: #c9d1dc; font-weight: 700; }
.oc .bank .bk { padding: 6px 2px; }
.oc .bank .bk b { font-size: 13px; }
.oc .bank .bk span { font-size: 10.5px; }
.oc .bank-mods { grid-template-columns: 1fr 1fr 1.3fr 1.4fr; }
.oc .bank-mods .mod { height: 32px; font-size: 12.5px; }

/* gale manual: aparece em destaque logo depois de uma perda */
.gale-strip { display: none; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; background: rgba(255,186,73,.08); box-shadow: inset 0 0 0 1px rgba(255,186,73,.45); animation: gsIn .35s ease-out; }
.gale-strip.on { display: flex; }
.gale-strip .gale-btn { flex: 0 0 auto; height: 40px; min-width: 112px; padding: 0 12px; border-radius: 6px; border: 0; background: linear-gradient(180deg, #ffc35a, #e89a1c) !important; color: #1b1203 !important;
  display: flex; flex-direction: column; justify-content: center; line-height: 1.1; font-weight: 800; box-shadow: 0 4px 12px rgba(232,154,28,.25); }
.gale-strip .gale-btn b { font-size: 12px; }
.gale-strip .gale-btn span { font-size: 14px; font-weight: 800; }
.gale-strip .gale-btn:hover { filter: brightness(1.06); }
.gale-strip .gale-hint { font-size: 11.5px; line-height: 1.35; color: #c9b48a; margin: 0; }
.gale-strip .gale-hint b { color: #ffd38a; }
.gale-strip .gale-hint b.pos { color: #3ddc97; }
@keyframes gsIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* martingale automático compacto */
.oc .gale.ladder { padding: 8px 10px !important; gap: 6px !important; }
.oc .gale-row .switch { font-size: 12.5px; }
.oc .g-risk-top { font-size: 11.5px; }
.oc .steps { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 5px; height: auto !important; align-items: stretch; }
.oc .steps .st { height: 38px !important; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1px; padding: 0; border-radius: 6px; border: 1px solid #222a35; background: #10151c; }
.oc .steps .st i { display: none !important; }
.oc .steps .st .st-amt { position: static !important; font-size: 12.5px; font-weight: 800; color: #c9d1dc; }
.oc .steps .st .st-lbl { position: static !important; font-size: 10px; color: #6b7585; margin: 0; }
.oc .steps .st.use:not(:disabled) { border-color: #3a4556; }
.oc .gale.on .steps .st.use:not(:disabled) { border-color: #d2b26a; background: rgba(210,178,106,.08); }
.oc .steps .st.now { box-shadow: inset 0 0 0 1px #ffc35a; }
.oc .gale-prev { font-size: 11px; margin: 0; }
.oc .gale:not(.on) .gale-prev { display: none; }

.oc-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 2px; }
.oc-foot .switch { font-size: 12px; }
.link-btn { border: 0; background: none; color: #7f8a97; font-size: 12px; padding: 4px 0; }
.link-btn:not(:disabled):hover { color: #fff; }
.link-btn:disabled { color: #3d4654; cursor: default; }

@media (max-width: 1500px) {
  .app .sides { grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); }
  .app .sides .opanel { grid-template-columns: 88px minmax(0, 1fr); column-gap: 10px; padding: 12px; }
  .app .sides .op-die { height: 100px; }
  .app .sides .ol-d { width: 21px !important; height: 21px !important; flex-basis: 21px !important; font-size: 11px; }
  .app .sides .ol-row { gap: 3px; height: 21px; }
  .app .sides .oq-mult b { font-size: 26px; }
  .app .sides .oq-ring { width: 48px; height: 48px; }
}
@media (max-width: 1100px) {
  .app .sides { grid-template-columns: 1fr 1fr; }
  .oc { grid-column: 1 / -1; order: 3; }
}
/* compacto */
.oc .tk-clock { display: none !important; }
.oc { gap: 7px !important; padding: 12px !important; }
.oc .big-amt { margin: 0; height: 44px; }
.oc .ba-val input { font-size: 34px; }
.oc-profit { display: flex !important; flex-wrap: nowrap; white-space: nowrap; margin: 0; }
.oc-profit > span { font-size: 11.5px; }
.oc .bank { gap: 5px; }
.oc .bank .bk { height: 38px; padding: 0 2px; display: flex; flex-direction: column; justify-content: center; gap: 0; }
.oc .bank .bk span { white-space: nowrap; font-size: 10px; }
.oc .bank-mods { gap: 5px; }
.oc .bank-mods .mod { height: 30px; }
.oc .gale-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; white-space: nowrap; }
.oc .g-risk-top { white-space: nowrap; }
.oc .steps .st { height: 34px !important; }
.oc-foot { padding-top: 0; }
.app .sides .opanel { grid-template-rows: auto auto 54px minmax(0, 1fr); }

/* =========== v0.22.1 — boleta limpa =========== */
.oc { gap: 10px !important; padding: 14px !important; }
.oc-label { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; color: var(--muted); }
.oc-profit { font-size: 12px; color: var(--muted); display: inline-flex !important; gap: 5px; align-items: baseline; }
.oc-profit b { color: #3ddc97; font-weight: 800; font-size: 13px; }
.oc-profit i { font-style: normal; color: #3d4654; }
.oc-profit em { font-style: normal; color: #9aa5b3; font-weight: 600; }
/* campo de valor único, sem caixas soltas */
.oc .big-amt { height: 56px !important; margin: 0; display: grid; grid-template-columns: 48px 1fr 48px; align-items: stretch; border-radius: 10px; background: #0a0d12; box-shadow: inset 0 0 0 1px #222a35; overflow: hidden; }
.oc .big-amt:focus-within { box-shadow: inset 0 0 0 1px #4a5568; }
.oc .big-amt .a-step { width: auto !important; height: auto !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: #9aa5b3; font-size: 20px; box-shadow: none !important; }
.oc .big-amt .a-step:hover { background: #121720 !important; color: #fff; }
.oc .big-amt .a-step:first-child { border-right: 1px solid #1a212c !important; }
.oc .big-amt .a-step:last-child { border-left: 1px solid #1a212c !important; }
.oc .ba-val { display: flex; align-items: baseline; justify-content: center; gap: 6px; }
.oc .ba-val .ba-cur { font-size: 13px !important; }
.oc .ba-val input { font-size: 30px !important; width: 6ch; text-align: left; }
/* atalhos numa barra só */
.quick { display: flex; height: 32px; border-radius: 8px; box-shadow: inset 0 0 0 1px #1d2430; overflow: hidden; }
.quick button { flex: 1 1 0; min-width: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: #9aa5b3; font-size: 12.5px; font-weight: 700; padding: 0; height: 100%; display: grid; place-items: center; }
.quick button + button { border-left: 1px solid #1d2430 !important; }
.quick button:hover { background: #121720 !important; color: #fff; }
.quick .bk b { font-size: 12.5px; font-weight: 700; color: inherit; }
.quick .bk.sel { color: #fff; background: #19202a !important; }
/* martingale numa linha */
.oc-mg { padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; gap: 6px !important; }
.oc-mg .gale-row { display: flex; justify-content: space-between; align-items: center; }
.oc-mg .switch { font-size: 13px; color: #c9d1dc; }
.oc-mg .steps { display: flex !important; gap: 0; height: 26px !important; border-radius: 6px; box-shadow: inset 0 0 0 1px #1d2430; overflow: hidden; }
.oc-mg .steps .st { all: unset; box-sizing: border-box; width: 36px; height: 26px; display: grid; place-items: center; font-size: 11.5px; font-weight: 700; color: #6b7585; cursor: pointer; }
.oc-mg .steps .st + .st { border-left: 1px solid #1d2430; }
.oc-mg .steps .st:hover { color: #fff; background: #121720; }
.oc-mg .steps .st.sel { color: #fff; background: #1d2430; }
.oc-mg.on .steps .st.sel { background: #d2b26a; color: #17120a; }
.oc-mg:not(.on) .steps { opacity: .55; }
.oc-mg .gale-prev { display: none; font-size: 11.5px; color: #7f8a97; gap: 6px; align-items: center; flex-wrap: wrap; margin: 0; }
.oc-mg.on .gale-prev { display: flex; }
.oc-mg .gale-prev b { color: #e6ebf1; font-weight: 700; }
.oc-mg .gale-prev i { font-style: normal; color: #3d4654; }
.oc-mg .gale-prev .gp-risk { margin-left: auto; }
.oc-mg .gale-prev .gp-risk b { color: #ff9a9e; }
/* rodapé */
.oc-foot { border-top: 1px solid #161c26; padding-top: 10px !important; margin-top: auto; }
.oc-links { display: flex; gap: 12px; }
.oc [hidden] { display: none !important; }
.oc .ba-val input { width: 4.2ch !important; text-align: center; padding: 0; }
.oc-mg .steps { background: transparent !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }
.oc-mg .gale-row { gap: 10px; }
.oc-mg .steps .st { line-height: 26px !important; padding: 0 !important; display: block !important; text-align: center; }
.oc-mg .gale-row .switch, .oc-foot .switch { margin: 0 !important; padding: 0 !important; }

/* atalhos de valor estilo terminal (v0.22.2) */
.quick2 { display: grid; grid-template-columns: 1fr 1fr 1fr 1px 1fr 1fr; gap: 6px; align-items: stretch; height: 36px; }
.quick2 .q-sep { width: 1px; background: #222a35; margin: 4px 0; }
.quick2 button { border-radius: 8px; border: 1px solid #222a35; background: linear-gradient(180deg, #121720, #0d1117); color: #c9d1dc; font-size: 12.5px; font-weight: 700; padding: 0; white-space: nowrap; font-feature-settings: "tnum" 1; transition: border-color .15s, background .15s, transform .08s; }
.quick2 button .cur { font-size: 10.5px !important; color: #7f8a97 !important; margin: 0 2px 0 1px !important; }
.quick2 button:hover { border-color: #3a4556; background: #161c26; color: #fff; }
.quick2 button:active { transform: translateY(1px); }
.quick2 .qa:first-child { border-color: rgba(210,178,106,.55); color: #e9cf8f; }
.quick2 .qf { color: #9aa5b3; }
.quick2 .qf.mul { border-color: rgba(210,178,106,.55); color: #e9cf8f; background: linear-gradient(180deg, rgba(210,178,106,.12), rgba(210,178,106,.04)); }
.quick2 .qf.mul:hover { border-color: #d2b26a; color: #fff; }
.quick2 .qa:first-child { border-color: #222a35; color: #c9d1dc; }
.quick2 .qa { font-size: 13.5px; }
.oc-mg .steps { height: 28px !important; align-items: stretch !important; }
.oc-mg .steps .st { height: 28px !important; line-height: 28px !important; margin: 0 !important; top: 0 !important; position: static !important; }

/* =========== v0.23 — Sobe × Desce =========== */
.sd-stage { display: none; }
.op-arrow { display: none; }
.g-sd #felt3d, .g-sd .stage-sum { display: none !important; }
.g-sd .sd-stage { display: block; position: relative; flex: 1 1 auto; min-height: 0; border-radius: 10px; overflow: hidden; background: #06080c; }
.g-sd .sd-stage canvas { position: absolute; inset: 0; display: block; }
.g-sd .op-die { display: none !important; }
.g-sd .op-arrow { display: grid; place-items: center; grid-area: die; align-self: stretch; border-radius: 10px; margin: -4px 0 0 -6px; }
.op-arrow svg { width: 64px; height: 64px; filter: drop-shadow(0 8px 18px rgba(0,0,0,.45)); }
.op-arrow.up { background: radial-gradient(60% 60% at 50% 45%, rgba(59,124,240,.22), transparent 70%); }
.op-arrow.down { background: radial-gradient(60% 60% at 50% 55%, rgba(229,72,79,.2), transparent 70%); }
.op-arrow.up svg path { fill: url(#none); fill: #3b7cf0; }
.op-arrow.down svg path { fill: #e5484f; }
.g-sd .opanel.won-flash .op-arrow svg { animation: arrowPop .7s cubic-bezier(.2,.9,.3,1.4); }
@keyframes arrowPop { 0% { transform: scale(1); } 40% { transform: scale(1.25) translateY(-4px); } 100% { transform: none; } }
.g-sd .op-digits { font-size: 11px; letter-spacing: 0; }
.g-sd .ol-d { font-size: 10px !important; }
.g-sd .felt3.win-tie { outline: none; }
.f-dv { font-weight: 800; font-feature-settings: "tnum" 1; }
.f-dv.up { color: #7fa9ff; } .f-dv.down { color: #ff7a80; } .f-dv.tie { color: #9aa5b3; }
.f-res.tie { color: #9aa5b3; }
.bd.tie, .ol-d.tie { color: #9aa5b3; }
@media (max-width: 1500px) { .op-arrow svg { width: 52px; height: 52px; } }
.g-sd .op-digits { word-spacing: normal !important; letter-spacing: 0 !important; color: #6b7585; }

/* =========== v0.24 — Acumulador =========== */
.ac-auto { display: none; }
.g-ac #felt3d, .g-ac .stage-sum { display: none !important; }
.g-ac .sd-stage { display: block; position: relative; flex: 1 1 auto; min-height: 0; border-radius: 10px; overflow: hidden; background: #06080c; }
.g-ac .sd-stage canvas { position: absolute; inset: 0; display: block; }
.g-ac .opanel.down { display: none !important; }
.app.g-ac .sides { grid-template-columns: 330px minmax(0, 1fr) !important; }
.g-ac .op-die, .g-ac .oq-ring { display: none !important; }
.g-ac .op-arrow.up { display: grid; place-items: center; grid-area: die; align-self: stretch; border-radius: 10px; margin: -4px 0 0 -6px; background: radial-gradient(60% 60% at 50% 45%, rgba(210,178,106,.2), transparent 70%); }
.g-ac .op-arrow.up svg path { fill: #d2b26a; }
.g-ac .opanel.up .op-mark { background: #d2b26a; }
.g-ac .opanel.up .oq-mult b { font-size: 0 !important; }
.g-ac .opanel.up .oq-mult b::before { content: "+3%"; font-size: 30px; }
.g-ac .opanel.up .oq-mult span { font-size: 0 !important; }
.g-ac .opanel.up .oq-mult span::before { content: "por tick dentro da faixa"; font-size: 11.5px; color: var(--muted); }
.g-ac .op-digits { word-spacing: normal !important; letter-spacing: 0 !important; color: #6b7585; }
.g-ac .ol-d { width: auto !important; min-width: 44px; flex: 0 0 auto !important; padding: 0 6px; font-size: 11px !important; }
.g-ac .ol-row { flex-wrap: nowrap; overflow: hidden; }
.g-ac .opanel.up .ol-d.hit { background: linear-gradient(180deg, #3ddc97, #1f9d68) !important; color: #06150e !important; }
.g-ac .ac-auto { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ac-auto .switch { font-size: 13px; color: #c9d1dc; margin: 0 !important; }
.ac-x { display: flex; align-items: center; gap: 2px; height: 32px; padding: 0 8px; border-radius: 8px; background: #0a0d12; box-shadow: inset 0 0 0 1px #222a35; color: #9aa5b3; font-weight: 700; }
.ac-x input { width: 52px; border: 0; background: transparent; color: #fff; font: inherit; font-size: 14px; text-align: right; outline: none; }
/* botão vira "Retirar" durante o voo */
.g-ac .side.obtn.up:not(.armed):not(:disabled) { background: linear-gradient(180deg, #e2c37a, #b8923f) !important; color: #1b1405 !important; }
.g-ac .side.obtn.cashout { background: linear-gradient(180deg, #3ddc97, #1f9d68) !important; color: #04130c !important; box-shadow: 0 0 0 0 rgba(61,220,151,.5), inset 0 1px 0 rgba(255,255,255,.25) !important; animation: cashPulse 1.2s ease-out infinite; }
.g-ac .side.obtn.cashout .ob-lbl::before { content: none !important; }
.g-ac .side.obtn.cashout .ob-amt { color: #04130c !important; font-weight: 800; font-size: 18px; }
@keyframes cashPulse { 0% { box-shadow: 0 0 0 0 rgba(61,220,151,.45); } 100% { box-shadow: 0 0 0 12px rgba(61,220,151,0); } }
@media (prefers-reduced-motion: reduce) { .g-ac .side.obtn.cashout { animation: none; } }
@media (max-width: 760px) { .app.g-ac .sides { grid-template-columns: 1fr !important; } }
.g-ac #mDiv, .g-ac #mDouble, .g-ac .q-sep, .g-ac #galeBox, .g-ac #galeStrip, .g-ac .oc-profit { display: none !important; }
.g-ac .quick2 { grid-template-columns: 1fr 1fr 1fr !important; }
.g-ac .pos-verb { font-size: 0 !important; }
.g-ac .pos-verb::before { content: "→ vale agora"; font-size: 11px; }
.rc-style { display: block; margin: 10px auto 0; border: 0; background: none; color: #7f8a97; font-size: 12.5px; }
.rc-style b { color: #c9d1dc; }
.rc-style:hover { color: #fff; }

/* selo de lucro na mesa (v0.26) */
.win-tag { position: absolute; left: 50%; top: 16px; transform: translateX(-50%); z-index: 5; display: flex; flex-direction: column; align-items: center; gap: 1px;
  padding: 8px 18px 9px; border-radius: 10px; background: rgba(8,12,16,.86); border: 1px solid rgba(61,220,151,.45);
  box-shadow: 0 12px 28px rgba(0,0,0,.45); pointer-events: none; backdrop-filter: blur(6px); }
.win-tag[hidden] { display: none; }
.win-tag span { font-size: 11px; color: #8fa39a; }
.win-tag b { font-size: 22px; font-weight: 800; color: #3ddc97; font-feature-settings: "tnum" 1; line-height: 1.1; }
.win-tag.show { animation: winTagIn .45s cubic-bezier(.2,.9,.3,1.25), winTagOut .5s ease-in 4.7s forwards; }
@keyframes winTagIn { from { opacity: 0; transform: translate(-50%, -8px) scale(.92); } to { opacity: 1; transform: translate(-50%, 0) scale(1); } }
@keyframes winTagOut { to { opacity: 0; transform: translate(-50%, -6px); } }
@media (prefers-reduced-motion: reduce) { .win-tag.show { animation: none; } }
@media (max-width: 760px) { .win-tag { top: 10px; padding: 6px 12px; } .win-tag b { font-size: 18px; } }

/* =========== v0.27 — Acumulador: painel de estatísticas =========== */
.acp, .acp-tape { display: none; }
.g-ac .opanel.up { display: flex !important; flex-direction: column; gap: 10px; }
.g-ac .opanel.up > .op-arrow, .g-ac .opanel.up > .op-quote, .g-ac .opanel.up > .op-last, .g-ac .opanel.up .op-digits { display: none !important; }
.g-ac .opanel.up .op-name { font-size: 16px; }
.g-ac .acp { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 18px; align-items: stretch; flex: 1 1 auto; min-height: 0; }
.acp-chart { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.acp-cap { display: flex; justify-content: space-between; align-items: baseline; font-size: 11.5px; color: #7f8a97; }
.acp-cap em { font-style: normal; color: #c9d1dc; font-weight: 600; font-feature-settings: "tnum" 1; }
#acpBars { width: 100%; height: 84px; display: block; }
.acp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; margin: 0; align-content: start; padding-left: 16px; border-left: 1px solid #161c26; }
.acp-grid dt { font-size: 11px; color: #6b7585; }
.acp-grid dd { margin: 2px 0 0; font-size: 16px; font-weight: 700; color: #e6ebf1; font-feature-settings: "tnum" 1; white-space: nowrap; }
.acp-grid dd small { font-size: 11px; font-weight: 500; color: #7f8a97; }
.g-ac .acp-tape { display: flex; align-items: center; gap: 12px; min-height: 30px; border-top: 1px solid #161c26; padding-top: 8px; overflow: hidden; }
.acp-tcap { font-size: 11px; color: #5d6676; white-space: nowrap; }
#acpTape { display: flex; gap: 0; overflow: hidden; white-space: nowrap; mask-image: linear-gradient(90deg, #000 85%, transparent); }
#acpTape span { display: inline-flex; align-items: baseline; gap: 4px; padding: 0 10px; border-left: 1px solid #1a212c; font-feature-settings: "tnum" 1; }
#acpTape span:first-child { border-left: 0; padding-left: 0; }
#acpTape b { font-size: 13px; font-weight: 700; color: #c9d1dc; }
#acpTape i { font-style: normal; font-size: 10.5px; color: #4d5767; }
#acpTape span.hi b { color: #e9cf8f; }
#acpTape span.max b { color: #3ddc97; }
#acpTape span:first-child b { color: #fff; }
#acpTape span.hi:first-child b { color: #e9cf8f; }
#acpTape span.max:first-child b { color: #3ddc97; }
#acpTape .none { font-size: 12px; color: #5d6676; border: 0; padding: 0; }
.g-ac .opanel.up.in-pos .acp-tape { display: none; }
.g-ac .opanel.up .op-pos.has { height: auto !important; }
.g-ac .opanel.up .obtn { margin-top: auto; }
@media (max-width: 1500px) { .g-ac .acp { grid-template-columns: 1fr; } .acp-grid { padding-left: 0; border-left: 0; grid-template-columns: repeat(4, auto); } }
@media (max-width: 760px) { .acp-grid { grid-template-columns: 1fr 1fr; } }

/* =========== v0.28 — Acumulador: pilha de moedas 3D =========== */
.g-ac .acp { display: grid !important; grid-template-columns: 240px minmax(0, 1fr) !important; gap: 20px !important; align-items: stretch; }
.acp-stack { position: relative; min-height: 150px; margin: -10px 0 -6px -10px; border-radius: 10px; cursor: default;
  background: radial-gradient(70% 70% at 50% 60%, rgba(210,170,80,.10), transparent 70%); }
.acp-stack canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.acp-info { display: flex; flex-direction: column; min-width: 0; padding-top: 2px; }
.acp-k { font-size: 12px; color: #8a95a3; }
.acp-big { font-size: 46px; font-weight: 800; line-height: 1.02; letter-spacing: -1px; color: #fff; font-feature-settings: "tnum" 1; margin-top: 2px; }
.acp-big.down { color: #ff6b70; } .acp-big.up { color: #3ddc97; }
.acp-sub { font-size: 12.5px; color: #8a95a3; margin-top: 2px; }
.acp-sub b { color: #e9cf8f; font-weight: 800; }
.g-ac .acp-grid { grid-template-columns: repeat(4, minmax(0, auto)) !important; justify-content: start; gap: 6px 22px !important; padding: 10px 0 0 !important; border-left: 0 !important; margin-top: auto !important; border-top: 1px solid #161c26; }
.g-ac .acp-grid dd { font-size: 14px; }
.g-ac .acp-chart { display: none !important; }
@media (max-width: 1500px) { .g-ac .acp { grid-template-columns: 200px minmax(0, 1fr) !important; } .acp-big { font-size: 38px; } .g-ac .acp-grid { grid-template-columns: repeat(2, minmax(0, auto)) !important; } }
@media (max-width: 760px) { .g-ac .acp { grid-template-columns: 130px 1fr !important; } .acp-stack { min-height: 120px; } .acp-big { font-size: 30px; } }
.g-ac .acp { flex: 1 1 auto; min-height: 0; }
.g-ac .acp-stack { min-height: 140px; height: auto; align-self: stretch; margin: -8px 0 0 -8px; background: radial-gradient(60% 55% at 50% 70%, rgba(210,170,80,.12), transparent 72%); }
.g-ac .acp-stack { background: none !important; }
.g-ac .acp { grid-template-rows: minmax(0, 1fr); }
.g-ac .acp-info { justify-content: flex-start; }
.g-ac .acp { display: flex !important; align-items: stretch !important; gap: 20px !important; }
.g-ac .acp-stack { flex: 0 0 240px; height: auto !important; min-height: 160px; }
.g-ac .acp-info { flex: 1 1 auto; }
@media (max-width: 1500px) { .g-ac .acp-stack { flex-basis: 210px; } }
@media (max-width: 760px) { .g-ac .acp-stack { flex-basis: 130px; } }
.g-ac .opanel.up > .acp, .g-ac .opanel.up > .acp-tape, .g-ac .opanel.up > .op-pos, .g-ac .opanel.up > .obtn, .g-ac .opanel.up > .op-head { width: 100%; align-self: stretch; }
.g-ac .acp-info { min-width: 0; }
#acpBars[hidden] { display: none !important; }
.g-ac .acp-stack canvas { -webkit-mask-image: radial-gradient(75% 80% at 50% 55%, #000 62%, transparent 100%); mask-image: radial-gradient(75% 80% at 50% 55%, #000 62%, transparent 100%); }
.g-ac .acp-stack canvas { -webkit-mask-image: none !important; mask-image: none !important; }
.g-ac .acp-stack { margin: -6px 0 -4px -6px; }
.g-ac .acp-stack { flex-basis: 260px !important; }
@media (max-width: 1500px) { .g-ac .acp-stack { flex-basis: 230px !important; } }
.op-pos .pos-line b.pos-ret.lost { color: #ff7a80 !important; }

/* =========== v0.30 — Acumulador: torre de capital 3D + HUD =========== */
.ac-stage { display: none; }
.g-ac .sd-stage { display: none !important; }
.g-ac .ac-stage { display: block; position: relative; flex: 1 1 auto; min-height: 0; border-radius: 10px; overflow: hidden;
  background: radial-gradient(90% 120% at 72% 10%, #0d1420 0%, #080b10 48%, #05070a 100%); }
#acTower { position: absolute; inset: 0; }
#acTower canvas { width: 100% !important; height: 100% !important; display: block; }

.ac-hud { position: absolute; inset: 0; pointer-events: none; display: flex; }
.ach-live, .ach-idle { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 0 0 0 34px; max-width: 46%; }
.ach-live[hidden], .ach-idle[hidden] { display: none; }
.ach-lbl { font-size: 13px; font-weight: 600; color: #8a95a3; text-shadow: 0 2px 10px rgba(0,0,0,.8); }
.ach-big { font-size: clamp(44px, 6vw, 84px); font-weight: 800; line-height: 1; letter-spacing: -2px; color: #f2f5f9;
  font-feature-settings: "tnum" 1; text-shadow: 0 4px 26px rgba(0,0,0,.85); }
.ach-big.down { color: #ff5a5f; }
.ach-big.up { color: #3ddc97; }
.ach-sub { font-size: 14px; color: #9aa5b3; margin-top: 6px; text-shadow: 0 2px 10px rgba(0,0,0,.8); }
.ach-sub b { font-weight: 800; }
.ach-sub b.ok { color: #3ddc97; }
.ach-sub b.bad { color: #ff7a80; font-weight: 700; }
.ach-clock { font-size: clamp(40px, 5vw, 64px); font-weight: 700; line-height: 1.05; color: #f2f5f9; font-feature-settings: "tnum" 1; text-shadow: 0 4px 26px rgba(0,0,0,.85); }
.ach-bar { display: block; width: min(230px, 80%); height: 2px; margin-top: 10px; background: rgba(255,255,255,.08); }
.ach-bar i { display: block; height: 100%; background: #d2b26a; transition: width .25s linear; }
.ach-bar i.hot { background: #ffd166; }
.ach-tape { margin-top: 22px; }
.ach-tcap { display: block; font-size: 11px; color: #5d6676; margin-bottom: 6px; }
#achTape { display: flex; overflow: hidden; white-space: nowrap; mask-image: linear-gradient(90deg, #000 82%, transparent); }
#achTape span { display: inline-flex; align-items: baseline; gap: 4px; padding: 0 12px; border-left: 1px solid rgba(255,255,255,.08); font-feature-settings: "tnum" 1; }
#achTape span:first-child { border-left: 0; padding-left: 0; }
#achTape b { font-size: 13.5px; font-weight: 700; color: #c9d1dc; text-shadow: 0 2px 8px rgba(0,0,0,.7); }
#achTape i { font-style: normal; font-size: 10.5px; color: #5d6676; }
#achTape span.hi b { color: #e9cf8f; }
#achTape span.max b { color: #3ddc97; }
#achTape .none { font-size: 12px; color: #5d6676; border: 0; padding: 0; }

/* painel embaixo: só a ficha do contrato + fita */
.g-ac .acp { display: flex !important; }
.g-ac .acp-info { flex: 1 1 auto; }
.g-ac .acp-grid { border-top: 0 !important; padding-top: 2px !important; }
@media (max-width: 760px) {
  .ach-live, .ach-idle { max-width: 60%; padding-left: 16px; }
  .ach-tape { margin-top: 12px; }
  .g-ac .felt3 { height: 64vw; max-height: 380px; }
}
.g-ac #banner { display: none !important; }

/* =========== v0.30.1 — volta o gráfico do Acumulador; boleta de entrada limpa =========== */
.g-ac .sd-stage { display: block !important; }
.ac-stage { display: none !important; }
.g-ac #banner:not([hidden]) { display: flex !important; }

/* faixa de condições do contrato: uma linha só, estilo ficha de corretora */
.g-ac .acp, .g-ac .acp-tape { display: none !important; }
.acc { display: none; }
.g-ac .acc { display: flex; align-items: stretch; gap: 20px; margin-top: auto; padding: 12px 2px; }
.acc-i { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.acc-i em { font-style: normal; font-size: 11px; color: #6b7585; white-space: nowrap; }
.acc-i b { font-size: 15px; font-weight: 700; color: #e6ebf1; font-feature-settings: "tnum" 1; white-space: nowrap; }
.acc-i b i { font-style: normal; font-size: 11px; color: #7f8a97; font-weight: 500; }
.acc-i b small { font-size: 11px; color: #7f8a97; font-weight: 500; }
.acc-sep { width: 1px; background: #1a212c; }
.g-ac .opanel.up.in-pos .acc { display: none; }

/* botão de entrada: ouro com acabamento (sem chapado) */
.g-ac .side.obtn.up:not(.armed):not(:disabled):not(.cashout) {
  background: linear-gradient(180deg, #edcb82 0%, #d7ae58 46%, #b68c3c 100%) !important;
  color: #221808 !important; font-weight: 800; letter-spacing: .01em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -2px 0 rgba(60,40,8,.25), 0 10px 24px rgba(182,140,60,.22) !important;
}
.g-ac .side.obtn.up:not(.armed):not(:disabled):not(.cashout):hover { filter: brightness(1.06); }
.g-ac .side.obtn.up:not(:disabled) .ob-amt { color: inherit !important; opacity: .9; font-weight: 800; }
.g-ac .side.obtn.up .ob-time { background: rgba(34,24,8,.4) !important; }
.g-ac .side.obtn.up:disabled:not(.armed) { background: #141920 !important; color: #6b7585 !important; box-shadow: inset 0 0 0 1px #1d2430 !important; }
@media (max-width: 760px) { .g-ac .acc { flex-wrap: wrap; gap: 10px 16px; } .acc-sep { display: none; } }

/* v0.30.3 — botão do Acumulador em azul */
.g-ac .side.obtn.up:not(.armed):not(:disabled):not(.cashout) {
  background: linear-gradient(180deg, #58a0ff 0%, #2f7de8 46%, #1d55c4 100%) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -2px 0 rgba(8,24,64,.35), 0 10px 26px rgba(47,125,232,.3) !important;
}
.g-ac .side.obtn.up:not(.armed):not(:disabled):not(.cashout):hover { filter: brightness(1.07); }
.g-ac .side.obtn.up .ob-time { background: rgba(255,255,255,.45) !important; }

/* =========== v0.31 — Dígitos: cronômetro estilo iOS =========== */
.dg-stage { display: none; }
.g-dg #felt3d, .g-dg .stage-sum { display: none !important; }
.g-dg .dg-stage { --ios-blue: #0a84ff; --ios-red: #ff453a; --ios-gray: #8e8e93; --ios-orange: #ff9f0a;
  position: relative; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  border-radius: 10px; overflow: hidden; padding: 14px 18px 12px;
  background: radial-gradient(70% 90% at 50% 40%, #0e1116 0%, #050608 70%);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

.dg-watch { --size: min(100%, 330px); position: relative; width: auto; height: calc(100% - 64px); max-height: 340px; min-height: 200px; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 50% 38%, #17191d 0%, #0b0c0e 62%, #050506 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.06), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -10px 30px rgba(0,0,0,.6), 0 30px 70px rgba(0,0,0,.6);
  transition: box-shadow .4s ease; }
.dg-watch::after { content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  background: linear-gradient(160deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 38%); }
.dg-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(0deg); }
.dg-ring line { stroke: rgba(255,255,255,.18); stroke-width: .9; stroke-linecap: round; }
.dg-ring line.big { stroke: rgba(255,255,255,.42); stroke-width: 1.4; }
.dg-track { fill: none; stroke: rgba(255,255,255,.07); stroke-width: 6; }
.dg-count { fill: none; stroke: var(--ios-orange); stroke-width: 6; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 100px 100px; transition: stroke-dashoffset .25s linear, stroke .3s; }
.dg-count.hot { stroke: var(--ios-red); }
#dgSegs path { fill: none; stroke: rgba(255,255,255,.1); stroke-width: 6; stroke-linecap: round; transition: stroke .25s ease; }
#dgSegs path.on { stroke: #f2f2f7; }
#dgSegs path.on.up { stroke: var(--ios-blue); }
#dgSegs path.on.down { stroke: var(--ios-red); }
.dg-watch.running .dg-count { opacity: 0; }
.dg-watch:not(.running) #dgSegs { opacity: 0; }

.dg-face { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.dg-top { font-size: clamp(12px, 1.3vw, 15px); font-weight: 600; color: var(--ios-gray); letter-spacing: .01em; height: 1.3em; }
.dg-bot { font-size: clamp(14px, 1.5vw, 18px); font-weight: 500; color: #c7c7cc; font-variant-numeric: tabular-nums; height: 1.4em; }
.dg-bot b { font-weight: 800; }
.dg-watch.up .dg-bot b, .dg-watch.up .dg-top { color: var(--ios-blue); }
.dg-watch.down .dg-bot b, .dg-watch.down .dg-top { color: var(--ios-red); }

/* tambor (seletor estilo iOS) */
.dg-wheel { --dg-h: clamp(70px, 9vw, 112px); --dg-r: calc(var(--dg-h) * 1.539); position: relative; height: calc(var(--dg-h) * 1.9); width: calc(var(--dg-h) * 1.3);
  perspective: calc(var(--dg-h) * 9); margin: 2px 0;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%); }
.dg-drum { position: absolute; left: 0; right: 0; top: 50%; height: var(--dg-h); margin-top: calc(var(--dg-h) / -2); transform-style: preserve-3d;
  transition-property: transform; transition-timing-function: cubic-bezier(.16,.84,.24,1); }
.dg-n { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; backface-visibility: hidden;
  font-size: var(--dg-h); font-weight: 300; line-height: 1; color: #6e6e73; font-variant-numeric: tabular-nums; transition: color .3s, font-weight .3s; }
.dg-n.on { color: #ffffff; font-weight: 500; }
.dg-watch.up .dg-n.on { color: var(--ios-blue); font-weight: 700; }
.dg-watch.down .dg-n.on { color: var(--ios-red); font-weight: 700; }
.dg-watch.pulse { animation: dgPulse .7s cubic-bezier(.2,.9,.3,1.3); }
.dg-watch.up.pulse { box-shadow: 0 0 0 1px rgba(10,132,255,.5), inset 0 1px 0 rgba(255,255,255,.08), 0 0 60px rgba(10,132,255,.25), 0 30px 70px rgba(0,0,0,.6); }
.dg-watch.down.pulse { box-shadow: 0 0 0 1px rgba(255,69,58,.5), inset 0 1px 0 rgba(255,255,255,.08), 0 0 60px rgba(255,69,58,.22), 0 30px 70px rgba(0,0,0,.6); }
@keyframes dgPulse { 0% { transform: scale(1); } 30% { transform: scale(1.035); } 100% { transform: scale(1); } }

/* fita dos últimos dígitos */
.dg-tape { width: min(100%, 760px); }
.dg-tcap { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--ios-gray); margin-bottom: 6px; }
.dg-tcap em { font-style: normal; color: #c7c7cc; }
#dgTape { display: flex; gap: 6px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
#dgTape span { flex: 0 0 auto; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }
#dgTape span.up { color: #64aaff; background: rgba(10,132,255,.14); }
#dgTape span.down { color: #ff7b72; background: rgba(255,69,58,.14); }
#dgTape span.now { box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); color: #fff; }
#dgTape .none { font-style: normal; font-size: 12px; color: var(--ios-gray); }

/* painéis Par/Ímpar sem o dado 3D */
.app.g-dg .sides .opanel { grid-template-columns: 1fr !important; grid-template-areas: "head" "quote" "last" "btn" !important; grid-template-rows: auto auto 54px minmax(0, 1fr) !important; }
.g-dg .op-die, .g-dg .op-arrow { display: none !important; }
.g-dg .opanel.up .op-mark { background: #0a84ff; } .g-dg .opanel.down .op-mark { background: #ff453a; }
.f-dg { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; font-weight: 800; }
.f-dg.up { color: #64aaff; background: rgba(10,132,255,.14); } .f-dg.down { color: #ff7b72; background: rgba(255,69,58,.14); }
@media (prefers-reduced-motion: reduce) { .dg-drum { transition-duration: .01s !important; } .dg-watch.pulse { animation: none; } }
@media (max-width: 760px) { .dg-watch { height: 62vw; max-height: 300px; } }
.g-dg .dg-wheel { --dg-h: clamp(58px, 6.4vw, 88px); height: calc(var(--dg-h) * 1.55); width: calc(var(--dg-h) * 1.2); margin: 4px 0; }
.g-dg .dg-top { margin-bottom: 2px; }
.g-dg .dg-bot { margin-top: 2px; }
.g-dg .dg-face { padding: 18% 0; }
.g-dg #banner { display: none !important; }
.g-dg .dg-tape { flex: 0 0 auto; }

/* v0.31.1 — roleta com física (sem CSS 3D): itens projetados num cilindro via JS */
.g-dg .dg-wheel { perspective: none; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 26%, #000 74%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 26%, #000 74%, transparent 100%);
  width: calc(var(--dg-h) * 1.5); height: calc(var(--dg-h) * 1.9); }
.g-dg .dg-wheel::before { content: ""; position: absolute; left: 4%; right: 4%; top: 50%; height: calc(var(--dg-h) * 1.02); transform: translateY(-50%);
  border-radius: 14px; background: rgba(255,255,255,.055); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.08); }
.g-dg .dg-drum { position: absolute; inset: 0; transform: none !important; transition: none !important; transform-style: flat; margin: 0; height: auto; top: 0; }
.g-dg .dg-n { position: absolute; left: 0; right: 0; top: 50%; height: var(--dg-h); margin-top: calc(var(--dg-h) / -2); backface-visibility: visible;
  display: flex; align-items: center; justify-content: center; font-size: calc(var(--dg-h) * .92); font-weight: 400; color: #8e8e93;
  will-change: transform, opacity; transition: color .25s, font-weight .25s; }
.g-dg .dg-n.on { color: #ffffff; font-weight: 500; }
.g-dg .dg-n.on.up { color: #0a84ff; font-weight: 700; }
.g-dg .dg-n.on.down { color: #ff453a; font-weight: 700; }
.g-dg .dg-wheel { --dg-h: clamp(48px, 5.2vw, 72px); height: calc(var(--dg-h) * 2.9); width: calc(var(--dg-h) * 1.7);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 34%, #000 66%, rgba(0,0,0,.5) 86%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 34%, #000 66%, rgba(0,0,0,.5) 86%, transparent 100%); margin: -6px 0; }
.g-dg .dg-n { font-size: calc(var(--dg-h) * 1.0); }
.g-dg .dg-face { padding: 12% 0; }
.g-dg .dg-wheel { --dg-h: clamp(44px, 4.6vw, 64px); }
#galeStrip, .gale-strip { display: none !important; }

/* =========== v0.32 — ZUPX Auto (piloto automático) =========== */
.rail-live { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 700; color: #3ddc97; }
.rail-live::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #3ddc97; margin-right: 5px; vertical-align: 1px; animation: posPulse 1.6s ease-out infinite; --sc: #3ddc97; }
.auto { position: fixed; top: var(--top-h); right: 0; bottom: 0; width: 380px; z-index: 40; display: flex; flex-direction: column;
  background: #0b0e13; border-left: 1px solid #1a212c; box-shadow: -24px 0 60px rgba(0,0,0,.45); animation: auIn .28s cubic-bezier(.2,.9,.3,1); }
.auto[hidden] { display: none; }
@keyframes auIn { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
body.auto-open .shell { margin-right: 380px; }
.au-head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid #161c26; }
.au-head h2 { margin: 0; font-size: 16px; color: #fff; }
.au-game { font-size: 12px; color: #7f8a97; }
.au-state { margin-left: auto; font-size: 12px; font-weight: 700; color: #7f8a97; }
.au-state.on { color: #3ddc97; }
.au-x { width: 30px; height: 30px; border-radius: 8px; border: 1px solid #222a35; background: #11161d; color: #c9d1dc; }
.au-body { flex: 1 1 auto; overflow-y: auto; padding: 4px 18px 20px; scrollbar-width: thin; }
.au-na { margin: 14px 0; font-size: 13px; color: #9aa5b3; line-height: 1.5; }
.au-sec { margin: 18px 0 6px; font-size: 11.5px; font-weight: 700; color: #6b7585; }
.au-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #12171f; }
.au-row b { display: block; font-size: 13.5px; color: #e6ebf1; font-weight: 600; }
.au-row small { display: block; font-size: 11px; color: #6b7585; margin-top: 1px; }
.au-step { display: grid; grid-template-columns: 30px minmax(84px, auto) 30px; align-items: center; height: 32px; border-radius: 8px; box-shadow: inset 0 0 0 1px #1f2632; background: #0e1218; overflow: hidden; }
.au-step button { height: 100%; border: 0; background: transparent; color: #9aa5b3; font-size: 16px; }
.au-step button:hover { background: #161c25; color: #fff; }
.au-step span { text-align: center; font-size: 13.5px; font-weight: 700; color: #fff; font-feature-settings: "tnum" 1; padding: 0 4px; }
.au-step span.g { color: #3ddc97; } .au-step span.r { color: #ff8a8e; }
#auCrit { height: 32px; max-width: 190px; border-radius: 8px; border: 1px solid #1f2632; background: #0e1218; color: #e6ebf1; font-size: 12.5px; padding: 0 8px; }
.au-seg { display: flex; height: 32px; border-radius: 8px; box-shadow: inset 0 0 0 1px #1f2632; overflow: hidden; }
.au-seg button { border: 0; background: transparent; color: #9aa5b3; font-weight: 700; font-size: 12.5px; padding: 0 16px; }
.au-seg button + button { border-left: 1px solid #1f2632; }
.au-seg button.on[data-v="up"] { background: rgba(59,124,240,.18); color: #8fb4ff; }
.au-seg button.on[data-v="down"] { background: rgba(229,72,79,.18); color: #ff8a8e; }
.au-plan { display: flex; flex-wrap: wrap; gap: 8px 16px; padding: 10px 12px; margin-top: 8px; border-radius: 8px; background: #0e1218; box-shadow: inset 0 0 0 1px #171d27; }
.au-plan span { display: flex; flex-direction: column; }
.au-plan em { font-style: normal; font-size: 10.5px; color: #6b7585; }
.au-plan span b { font-size: 13px; color: #e6ebf1; font-feature-settings: "tnum" 1; }
.au-plan p { flex: 1 1 100%; margin: 4px 0 0; font-size: 12px; color: #9aa5b3; }
.au-plan p b { color: #ffd38a; }
.au-live { margin-top: 14px; }
.au-kpi { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 10px; }
.au-kpi small { display: block; font-size: 11px; color: #6b7585; }
.au-kpi b { font-size: 20px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; }
.au-kpi b.g { color: #3ddc97; } .au-kpi b.r { color: #ff7a80; }
.au-bars { display: grid; gap: 8px; margin: 14px 0 10px; }
.au-bars div { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 10px; font-size: 11.5px; color: #7f8a97; }
.au-bars i { height: 4px; border-radius: 2px; background: #161c25; overflow: hidden; }
.au-bars em { display: block; height: 100%; transition: width .4s ease; }
.au-bars div:first-child em { background: #3ddc97; } .au-bars div:last-child em { background: #ff5a5f; }
.au-bars b { color: #c9d1dc; font-feature-settings: "tnum" 1; }
.au-now { padding: 10px 12px; border-radius: 8px; background: #0e1218; box-shadow: inset 0 0 0 1px #171d27; font-size: 13px; color: #e6ebf1; }
.au-end { margin-top: 14px; padding: 12px; border-radius: 8px; background: #0e1218; box-shadow: inset 0 0 0 1px #222a35; display: grid; gap: 4px; }
.au-end b { color: #fff; font-size: 14px; } .au-end span { font-size: 12.5px; color: #9aa5b3; }
.au-end em { font-style: normal; font-weight: 800; } .au-end em.g { color: #3ddc97; } .au-end em.r { color: #ff7a80; }
.au-go { width: 100%; height: 48px; margin-top: 16px; border: 0; border-radius: 10px; font-size: 15px; font-weight: 800; color: #fff;
  background: linear-gradient(180deg, #58a0ff 0%, #2f7de8 46%, #1d55c4 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 10px 26px rgba(47,125,232,.28); }
.au-go:hover { filter: brightness(1.07); }
.au-go.stop { background: #1a1f27; box-shadow: inset 0 0 0 1px #ff5a5f; color: #ff8a8e; }
.au-note { margin: 10px 0 0; font-size: 11.5px; line-height: 1.5; color: #6b7585; }
.au-log-h { display: flex; justify-content: space-between; align-items: baseline; margin: 20px 0 6px; font-size: 11.5px; font-weight: 700; color: #6b7585; }
.au-log-h em { font-style: normal; font-weight: 600; color: #9aa5b3; }
.au-log { list-style: none; margin: 0; padding: 0; }
.au-log li { display: grid; grid-template-columns: 58px 54px 1fr auto; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #12171f; font-size: 12px; color: #c9d1dc; font-feature-settings: "tnum" 1; }
.au-log li time { color: #5d6676; }
.au-log li .sd { font-weight: 800; } .au-log li .sd.up { color: #8fb4ff; } .au-log li .sd.down { color: #ff8a8e; }
.au-log li .st i { font-style: normal; font-size: 10.5px; color: #e9cf8f; }
.au-log li .why { grid-column: 2 / 4; grid-row: 2; font-size: 11px; color: #6b7585; }
.au-log li .st { white-space: nowrap; }
.au-log li b { font-weight: 800; color: #9aa5b3; } .au-log li b.g { color: #3ddc97; } .au-log li b.r { color: #ff7a80; }
.au-log li.nt { grid-template-columns: 58px 1fr; color: #9aa5b3; }
.au-log li.none { display: block; color: #5d6676; }
/* boleta travada enquanto o piloto opera */
body.auto-on .oc { opacity: .5; pointer-events: none; }
body.auto-on .sides .obtn { pointer-events: none; }
@media (max-width: 1100px) { body.auto-open .shell { margin-right: 0; } .auto { width: min(380px, 100vw); } }
.auto [hidden] { display: none !important; }
.auto .au-head { width: 100%; box-sizing: border-box; justify-content: flex-start; text-align: left; }
.auto .au-head > div:first-child { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; border: 0; padding: 0; }
.auto .au-head .au-state { margin-left: 0; }
body.auto-on .sides .obtn .ob-lbl { font-size: 0 !important; }
body.auto-on .sides .obtn .ob-lbl::before { content: "ZUPX Auto operando" !important; font-size: 15px; margin: 0 !important; }
.au-log li .st i { display: inline !important; background: none !important; height: auto !important; width: auto !important; margin-left: 4px; }
.au-plan p.au-odds { font-size: 11.5px; color: #8a95a3; line-height: 1.5; } .au-plan p.au-odds b { color: #ff9a9e; }

/* v0.34 — ZUPX Auto no formato Atmoz */
.au-step { grid-template-columns: 32px 92px 32px !important; width: 156px; flex: 0 0 156px; }
.au-step span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.au-sec { margin-top: 14px; font-size: 12.5px; color: #c9d1dc; }
.au-sum { margin: 12px 0 0; font-size: 12.5px; color: #9aa5b3; line-height: 1.5; }
.au-sum b { color: #fff; }
.au-freeze { margin: 8px 0 0; text-align: center; font-size: 11.5px; color: #6b7585; }
.au-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.au-links button { display: flex; justify-content: space-between; align-items: center; height: 40px; padding: 0 12px; border-radius: 9px; border: 1px solid #1f2632; background: #0e1218; color: #c9d1dc; font-size: 13px; font-weight: 600; }
.au-links button:hover { background: #141a22; color: #fff; }
.au-links i { font-style: normal; color: #6b7585; font-size: 16px; }
.au-risk { margin-top: 10px; padding: 12px; border-radius: 9px; background: #0e1218; box-shadow: inset 0 0 0 1px #1f2632; font-size: 12px; color: #9aa5b3; line-height: 1.5; }
.au-risk > b { color: #fff; font-size: 13px; }
.au-risk p { margin: 6px 0 0; } .au-risk p b { color: #ffd38a; }
.au-day { display: flex; align-items: baseline; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #161c26; font-size: 11.5px; color: #6b7585; }
.au-day span { font-weight: 700; }
.au-day b { font-size: 15px; color: #c9d1dc; font-feature-settings: "tnum" 1; }
.au-day b.g { color: #3ddc97; } .au-day b.r { color: #ff7a80; }
.au-day em { font-style: normal; margin-left: auto; }
.au-note { display: none; }
.au-expo { margin: 6px 0 0; font-size: 11.5px; color: #8a95a3; line-height: 1.5; } .au-expo b { color: #ffd38a; }

/* ---------- v0.36 Laboratório de padrões ---------- */
.lab { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(3,5,8,.72); backdrop-filter: blur(3px); }
.lab[hidden] { display: none; }
.lab [hidden] { display: none !important; }
.lab-win { width: min(1180px, 100%); height: min(860px, 100%); display: flex; flex-direction: column; background: #0b0e13; border: 1px solid #1a212c; border-radius: 12px; box-shadow: 0 30px 90px rgba(0,0,0,.6); overflow: hidden; animation: auIn .25s cubic-bezier(.2,.9,.3,1); }
.lab-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #161c26; }
.lab-head h2 { margin: 0; font-size: 16px; color: #fff; display: inline; }
.lab-head span { margin-left: 10px; font-size: 12px; color: #7f8a97; }
.lab-head .au-x { margin-left: auto; }
.lab-grid { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 330px 1fr; }
.lab-cfg { overflow-y: auto; padding: 2px 18px 20px; border-right: 1px solid #161c26; scrollbar-width: thin; }
.lab-out { overflow-y: auto; padding: 16px 22px 24px; scrollbar-width: thin; }
.lab-seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; height: 32px; border-radius: 8px; box-shadow: inset 0 0 0 1px #1f2632; background: #0e1218; overflow: hidden; }
.lab-seg button { border: 0; background: transparent; color: #9aa5b3; font-weight: 600; font-size: 12.5px; }
.lab-seg button + button { border-left: 1px solid #1f2632; }
.lab-seg button.on { background: #18202b; color: #fff; }
.lab-seg.sm { width: 180px; }
.lab-strats { display: grid; border-radius: 8px; box-shadow: inset 0 0 0 1px #1a212c; overflow: hidden; }
.lab-st { display: grid; grid-template-columns: 14px 1fr; column-gap: 10px; text-align: left; padding: 9px 12px; border: 0; background: transparent; }
.lab-st + .lab-st { border-top: 1px solid #141a22; }
.lab-st::before { content: ""; grid-row: 1 / 3; align-self: center; width: 12px; height: 12px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px #3a4452; }
.lab-st b { font-size: 13px; font-weight: 600; color: #d8dee6; }
.lab-st small { font-size: 11px; color: #626c7b; }
.lab-st:hover { background: #0f141b; }
.lab-st.on { background: #111823; }
.lab-st.on::before { box-shadow: inset 0 0 0 4px #3b7cf0; }
.lab-st.on b { color: #fff; }
.lab-extra { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; font-size: 12.5px; color: #9aa5b3; }
.lab-extra.col { flex-direction: column; align-items: stretch; padding: 12px; border-radius: 8px; background: #0e1218; box-shadow: inset 0 0 0 1px #171d27; }
.lab-extra small { color: #5d6676; }
.lab-seq { display: flex; flex-wrap: wrap; gap: 5px; min-height: 30px; align-items: center; }
.lab-seq i, .lab-seq em { font-style: normal; }
.lab-seq em { font-size: 12px; color: #5d6676; }
.lab-seq i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; font-weight: 800; font-size: 12.5px; }
.lab-seq i.up { background: rgba(59,124,240,.16); color: #8fb4ff; box-shadow: inset 0 0 0 1px rgba(59,124,240,.35); }
.lab-seq i.down { background: rgba(229,72,79,.14); color: #ff8a8e; box-shadow: inset 0 0 0 1px rgba(229,72,79,.35); }
.lab-seqbtn { display: grid; grid-template-columns: 1fr 1fr 44px; gap: 6px; }
.lab-seqbtn button { height: 30px; border-radius: 7px; border: 1px solid #222a35; background: #11161d; color: #c9d1dc; font-size: 12.5px; font-weight: 600; }
.lab-seqbtn button.up { color: #8fb4ff; } .lab-seqbtn button.down { color: #ff8a8e; }
.lab-seqbtn button:hover { background: #161c25; }
.lab-cfg .au-row > b { font-size: 13.5px; color: #fff; font-feature-settings: "tnum" 1; }
#labRun { background: linear-gradient(180deg, #3b82f6, #2563eb); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 1px 0 rgba(0,0,0,.4); }
#labRun:disabled { opacity: .6; }
.lab-prog { min-height: 18px; margin: 10px 0 0; font-size: 12px; color: #8a95a5; }
.lab-empty { height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 10px; max-width: 520px; margin: 0 auto; text-align: left; }
.lab-empty b { font-size: 17px; color: #fff; font-weight: 700; }
.lab-empty span { font-size: 13.5px; line-height: 1.6; color: #8a95a5; }
.lab-src { font-size: 12px; color: #7f8a97; padding-bottom: 12px; border-bottom: 1px solid #141a22; }
.lab-src b { color: #c9d1dc; font-weight: 600; }
.lab-top { display: grid; grid-template-columns: 240px 1fr; gap: 26px; align-items: center; padding: 16px 0 6px; }
.lab-net small { display: block; font-size: 11.5px; color: #6b7585; }
.lab-net b { display: block; margin: 4px 0; font-size: 32px; font-weight: 800; letter-spacing: -.5px; font-feature-settings: "tnum" 1; }
.lab-net b.g { color: #3ddc97; } .lab-net b.r { color: #ff7a80; }
.lab-net span { font-size: 11.5px; line-height: 1.5; color: #7f8a97; }
.lab-sheet { width: 100%; border-collapse: collapse; font-size: 12.5px; font-feature-settings: "tnum" 1; }
.lab-sheet th { text-align: left; font-weight: 500; color: #7f8a97; padding: 5px 0; border-bottom: 1px solid #12171f; white-space: nowrap; }
.lab-sheet td { padding: 5px 0 5px 14px; border-bottom: 1px solid #12171f; color: #e6ebf1; font-weight: 700; white-space: nowrap; }
.lab-sheet td + td { font-weight: 400; color: #6b7585; font-size: 11.5px; width: 100%; }
.lab-h { display: flex; justify-content: space-between; align-items: baseline; margin: 20px 0 8px; font-size: 11.5px; font-weight: 700; color: #6b7585; }
.lab-h em { font-style: normal; font-weight: 500; color: #8a95a5; }
.lab-chart .lab-h { margin-top: 12px; }
#labCv { display: block; width: 100%; height: 210px; border-radius: 8px; background: #090c10; box-shadow: inset 0 0 0 1px #141a22; }
.lab-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; font-feature-settings: "tnum" 1; }
.lab-tbl th { text-align: right; font-size: 11px; font-weight: 500; color: #5d6676; padding: 0 0 6px 12px; border-bottom: 1px solid #161c26; white-space: nowrap; }
.lab-tbl th:first-child { text-align: left; padding-left: 0; }
.lab-tbl td { text-align: right; padding: 7px 0 7px 12px; border-bottom: 1px solid #11161d; color: #c9d1dc; white-space: nowrap; }
.lab-tbl td:first-child { text-align: left; padding-left: 0; color: #e6ebf1; }
.lab-tbl .bar { width: 38%; }
.lab-tbl td.bar i { display: block; height: 6px; border-radius: 1px; background: #2c4f86; }
.lab-tbl tr.lost td:first-child { color: #ff8a8e; }
.lab-tbl tr.lost td.bar i { background: #8a3438; }
.lab-tbl td.g { color: #3ddc97; } .lab-tbl td.r { color: #ff7a80; }
.lab-tbl.cmp tr.me td { background: #0f151e; }
.lab-tbl.cmp tr.me td:first-child { box-shadow: inset 2px 0 0 #3b7cf0; padding-left: 10px; color: #fff; font-weight: 600; }
.lab-note { margin: 16px 0 0; font-size: 11.5px; line-height: 1.5; color: #5d6676; }
@media (max-width: 900px) {
  .lab { padding: 0; }
  .lab-win { height: 100%; border-radius: 0; }
  .lab-grid { grid-template-columns: 1fr; overflow-y: auto; }
  .lab-cfg, .lab-out { overflow: visible; }
  .lab-cfg { border-right: 0; border-bottom: 1px solid #161c26; }
  .lab-top { grid-template-columns: 1fr; gap: 10px; }
}

/* ---------- v0.37 Dígitos: cronômetro 3D ---------- */
.dg-watch.gl { background: none; box-shadow: none; border-radius: 0; max-height: 420px; height: calc(100% - 56px); }
.dg-watch.gl::after { display: none; }
.dg-watch.gl::before { content: ""; position: absolute; left: 12%; right: 12%; bottom: 2%; height: 16%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(0,0,0,.75), rgba(0,0,0,0)); filter: blur(6px); pointer-events: none; }
.dg-watch.gl .dg-ring, .dg-watch.gl .dg-face { display: none; }
.dg-watch.gl.pulse { animation: none; box-shadow: none; }
.dg-gl { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* ======================= v0.38 Tema "Colisão" (espaço profundo) ======================= */
html:has(body.space) { background: #020306; }
#spaceBg { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: -1; display: block; pointer-events: none; }
body.space { background: transparent !important; }
body.space .shell, body.space .play { background: transparent !important; }
/* vidro fumê com borda usinada: camada escura + filete de luz em cima + contorno fino */
body.space .top, body.space .rail {
  background: linear-gradient(180deg, rgba(10,12,19,.5), rgba(5,6,10,.58)) !important;
  backdrop-filter: blur(22px) saturate(150%); -webkit-backdrop-filter: blur(22px) saturate(150%);
  border-color: rgba(255,255,255,.06) !important; }
body.space .top { box-shadow: inset 0 -1px 0 rgba(255,255,255,.05), 0 10px 30px rgba(0,0,0,.35); }
body.space .rail { box-shadow: inset -1px 0 0 rgba(255,255,255,.05); }
body.space .stage-wrap, body.space .opanel, body.space .oc, body.space .panel {
  background: linear-gradient(180deg, rgba(14,17,26,.52) 0%, rgba(5,7,11,.66) 100%) !important;
  backdrop-filter: blur(26px) saturate(160%); -webkit-backdrop-filter: blur(26px) saturate(160%);
  border: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 0 0 0 1px rgba(0,0,0,.35), 0 24px 60px rgba(0,0,0,.5) !important; }
/* o gráfico precisa de fundo firme para leitura */
body.space .stage-wrap { background: linear-gradient(180deg, rgba(8,10,16,.6), rgba(3,4,7,.72)) !important; }
body.space .stage-wrap .felt3, body.space .sd-stage, body.space .ac-stage, body.space .lc-wrap { background: transparent !important; }
/* menu lateral: item ativo com filete de luz (sem pílula) */
body.space .rail-item { border-radius: 8px; }
body.space .rail-item.on, body.space .rail-item[aria-current] { background: linear-gradient(90deg, rgba(255,255,255,.07), rgba(255,255,255,0)) !important;
  box-shadow: inset 2px 0 0 #e8edf5 !important; border-color: transparent !important; }

/* ---------- botões de ação: tecla de metal usinado iluminada por baixo ---------- */
body.space .side.obtn { position: relative; overflow: hidden; border: 0 !important; border-radius: 12px !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.65),
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -2px 0 rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 10px 24px -6px var(--ob-glow),
    0 2px 0 rgba(0,0,0,.6) !important;
  transition: transform .08s ease, box-shadow .2s ease, filter .2s ease; }
body.space .side.obtn.down { --ob-glow: rgba(229,52,64,.55);
  background:
    linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.05) 46%, rgba(0,0,0,0) 50%, rgba(0,0,0,.18) 100%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(180deg, #e2414b 0%, #b81d2a 100%) !important; }
body.space .side.obtn.up { --ob-glow: rgba(47,110,255,.6);
  background:
    linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.05) 46%, rgba(0,0,0,0) 50%, rgba(0,0,0,.18) 100%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(180deg, #3f86ff 0%, #1d4fd6 100%) !important; }
body.space .side.obtn::after { content: ""; position: absolute; left: 10%; right: 10%; bottom: -1px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); opacity: .55; pointer-events: none; }
body.space .side.obtn:hover:not(:disabled) { filter: brightness(1.08); }
body.space .side.obtn:active:not(:disabled) { transform: translateY(1px);
  box-shadow: 0 0 0 1px rgba(0,0,0,.65), inset 0 2px 6px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.06), 0 4px 12px -4px var(--ob-glow) !important; }
body.space .side.obtn .ob-lbl, body.space .side.obtn .ob-amt { text-shadow: 0 1px 0 rgba(0,0,0,.35); }

/* teclas pequenas da boleta: metal escuro */
body.space .oc .big-amt { background: linear-gradient(180deg, #07090d, #0c1017) !important; box-shadow: inset 0 2px 6px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,255,255,.07), 0 1px 0 rgba(255,255,255,.05) !important; }
body.space .oc .quick2 button, body.space .oc .qk, body.space .icon-btn {
  background: linear-gradient(180deg, #1c222c 0%, #11151c 100%) !important; border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 0 0 1px rgba(255,255,255,.06), 0 1px 0 rgba(0,0,0,.7), 0 4px 10px rgba(0,0,0,.35) !important; }
body.space .oc .quick2 button:active, body.space .icon-btn:active { transform: translateY(1px); box-shadow: inset 0 2px 5px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.05) !important; }

/* botão Entrar com Deriv e outros botões primários */
body.space .account .btn, body.space .account button:not(.link) {
  background: linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,0) 50%), linear-gradient(180deg, #3f86ff, #1d4fd6) !important;
  border: 0 !important; box-shadow: 0 0 0 1px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.35), 0 8px 20px -6px rgba(47,110,255,.6) !important; }
/* borda do vidro pegando a luz da nebulosa: vermelho à esquerda, azul à direita */
body.space .stage-wrap, body.space .opanel, body.space .oc, body.space .panel { position: relative; }
body.space .stage-wrap::before, body.space .opanel::before, body.space .oc::before, body.space .panel::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; pointer-events: none; z-index: 0;
  background: linear-gradient(115deg, rgba(190,225,255,.38) 0%, rgba(255,255,255,.06) 32%, rgba(255,255,255,.03) 60%, rgba(110,170,255,.42) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }

/* ======================= v0.39 Topo e menu: acabamento premium ======================= */
:root { --top-h: 60px; }
@media (min-width: 1181px) { :root { --rail-w: 232px; } }
.app .top { background: linear-gradient(180deg, #0d1118 0%, #0a0d12 100%); border-bottom: 1px solid #161c26;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.025), 0 8px 24px rgba(0,0,0,.35); }
/* marca */
.app .brand { gap: 11px; padding-left: 18px; border-right: 1px solid #161c26; }
.app .brand strong { font-size: 18px; font-weight: 800; letter-spacing: .07em; }
.logo { width: 28px; height: 28px; position: relative; flex: 0 0 auto; }
.logo i { display: none; }
.logo::before, .logo::after { content: ""; position: absolute; width: 18px; height: 18px; border-radius: 5px; }
.logo::before { left: 0; top: 0; background: linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,0) 55%), linear-gradient(180deg, #f2545c, #cf2a37);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 0 0 1px rgba(0,0,0,.55); }
.logo::after { right: 0; bottom: 0; background: linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,0) 55%), linear-gradient(180deg, #4a8cff, #1d4fd6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 0 0 2.5px #0b0f15, 0 4px 10px rgba(0,0,0,.5); }
/* ticker */
.ticker { gap: 0; height: 100%; }
.ticker > * { padding: 0 16px; height: 100%; display: flex; align-items: center; }
.ticker > * + * { border-left: 1px solid #141a23; }
.tk-asset { font-size: 13.5px; color: #dfe5ec; gap: 6px; }
.tk-asset em { border: 0; background: #1a212c; color: #9aa5b3; font-weight: 600; box-shadow: inset 0 0 0 1px #252e3b; }
.tk-price { font-size: 20px; font-weight: 800; letter-spacing: -.01em; min-width: 118px; }
.tk-chg { font-size: 12.5px; font-weight: 600; min-width: 74px; }
.app .conn { font-size: 12.5px; }
/* teclas do topo */
.app .top .icon-btn, .app .top .account select, .app .top .account .btn {
  height: 38px; border-radius: 9px; border: 0; color: #dfe5ec; font: 600 13px/1 inherit;
  background: linear-gradient(180deg, #1c232e 0%, #131820 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 0 0 1px #070a0e, 0 0 0 2px #1a212b, 0 4px 10px rgba(0,0,0,.35); }
.app .top .icon-btn { width: 38px; }
.app .top .icon-btn:hover, .app .top .account select:hover, .app .top .account .btn:hover { background: linear-gradient(180deg, #232b37 0%, #171d26 100%); color: #fff; }
.app .top .icon-btn:active, .app .top .account .btn:active { transform: translateY(1px); box-shadow: inset 0 2px 4px rgba(0,0,0,.5), 0 0 0 1px #070a0e, 0 0 0 2px #1a212b; }
.app .top .account { gap: 10px; }
.app .top .account select { appearance: none; -webkit-appearance: none; padding: 0 34px 0 14px; cursor: pointer; max-width: 260px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%239aa5b3' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"), linear-gradient(180deg, #1c232e 0%, #131820 100%);
  background-repeat: no-repeat; background-position: right 12px center, 0 0; background-size: 12px, auto; }
.app .top .account .btn { padding: 0 16px; }
/* Entrar com Deriv: o botão que chama */
.app .top .account .btn.primary { color: #fff; font-weight: 700; padding: 0 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 50%), linear-gradient(180deg, #3f86ff 0%, #1d4fd6 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 0 0 1px #0a1f55, 0 6px 18px -4px rgba(47,110,255,.65); }
.app .top .account .btn.primary:hover { filter: brightness(1.08); background: linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 50%), linear-gradient(180deg, #3f86ff 0%, #1d4fd6 100%); }
.app .balance { padding: 0 6px; }
.app .balance span { font-size: 11px; color: #7f8a97; }
.app .balance strong { font-size: 17px; letter-spacing: -.01em; }

/* menu lateral */
.rail { padding: 16px 12px; gap: 3px; background: linear-gradient(180deg, #0c1016 0%, #090c11 100%); border-right: 1px solid #161c26; }
.rail-cap { font-size: 11.5px; font-weight: 600; color: #4f5a6a; padding: 14px 10px 6px; }
.rail-cap:first-child { padding-top: 0; }
.rail-item { height: 54px; padding: 0 10px 0 8px; gap: 12px; border-radius: 11px; position: relative; transition: background .15s ease; }
.rail-item .ri-ic { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: #9aa5b3;
  background: linear-gradient(180deg, #1a212c 0%, #11161e 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px #06080c, 0 3px 8px rgba(0,0,0,.35); transition: color .15s ease; }
.rail-item .ri-ic svg { width: 19px; height: 19px; }
.rail-item .ri-tx { display: flex; flex-direction: column; gap: 1px; min-width: 0; line-height: 1.2; }
.rail-item .ri-tx b { font-size: 14px; font-weight: 650; color: #d3dae3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rail-item .ri-tx small { font-size: 11.5px; font-weight: 500; color: #5f6a7a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rail-item:hover { background: #10151d; }
.rail-item:hover .ri-ic { color: #fff; }
.rail-item:hover .ri-tx b { color: #fff; }
.rail-item.active { background: linear-gradient(180deg, #161d28 0%, #10151d 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px #1d2532, 0 10px 22px rgba(0,0,0,.35); }
.rail-item.active::before { content: ""; position: absolute; left: -12px; top: 14px; bottom: 14px; width: 3px; border-radius: 0 3px 3px 0; background: #fff; }
.rail-item.active .ri-ic { color: #fff;
  background: linear-gradient(180deg, rgba(255,255,255,.25) 0%, rgba(255,255,255,0) 52%), linear-gradient(180deg, #3f86ff 0%, #1d4fd6 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 0 0 1px #0a1f55, 0 6px 16px -4px rgba(47,110,255,.75); }
.rail-item.active .ri-tx b { color: #fff; }
.rail-item.active .ri-tx small { color: #8c97a6; }
.rail-item .rail-live { position: absolute; right: 10px; top: 9px; font-size: 10px; }
.rail-item:has(.rail-live:not([hidden])) .ri-ic { color: #3ddc97; }
.rail-item:focus-visible { outline: 2px solid #3f86ff; outline-offset: 2px; }
.rail-foot { border-top-color: #141a23; color: #485262; }
@media (max-width: 1180px) { .rail-item .ri-tx, .rail-cap, .rail-foot { display: none; } .rail-item { height: 48px; justify-content: center; padding: 0; } .rail { padding: 14px 8px; } .rail-item.active::before { left: -8px; } .rail-item .rail-live { right: 2px; top: 2px; font-size: 0; } }

/* ======================= v0.40 Topo e menu: hardware real (metal escovado + teclas físicas) ======================= */
:root {
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --brushed: repeating-linear-gradient(90deg, rgba(255,255,255,.018) 0 1px, rgba(0,0,0,0) 1px 2px, rgba(0,0,0,.025) 2px 3px, rgba(0,0,0,0) 3px 5px);
  --cap: linear-gradient(180deg, #343841 0%, #2a2e35 38%, #22252b 72%, #1d2025 100%);
}
/* chapas de alumínio anodizado escuro */
.app .top { background: var(--grain), var(--brushed), linear-gradient(180deg, #23262c 0%, #1a1c21 55%, #15171b 100%);
  border-bottom: 1px solid #07080a; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 1px 0 rgba(255,255,255,.03), 0 10px 26px rgba(0,0,0,.55); }
.rail { background: var(--grain), repeating-linear-gradient(0deg, rgba(255,255,255,.016) 0 1px, rgba(0,0,0,0) 1px 2px, rgba(0,0,0,.022) 2px 3px, rgba(0,0,0,0) 3px 5px), linear-gradient(90deg, #191b20 0%, #1d2025 60%, #191b1f 100%);
  border-right: 1px solid #07080a; box-shadow: inset -1px 0 0 rgba(255,255,255,.05); gap: 8px; padding: 18px 14px; }
.app .brand { border-right: 1px solid #07080a; box-shadow: 1px 0 0 rgba(255,255,255,.04); }
.ticker > * + * { border-left: 1px solid #0b0c0e; box-shadow: -1px 0 0 rgba(255,255,255,.035); }
.rail-cap { color: #6c7380; text-shadow: 0 1px 0 rgba(0,0,0,.8); padding: 12px 6px 2px; }
.rail-foot { border-top: 1px solid #0b0c0e; box-shadow: inset 0 1px 0 rgba(255,255,255,.035); color: #5a616d; }

/* tecla física: tampa com bisel, luz de cima, sombra de contato */
.rail-item, .app .top .icon-btn, .app .top .account select, .app .top .account .btn:not(.primary) {
  position: relative; border: 0; color: #c9ced6; background: var(--cap);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -2px 1px rgba(0,0,0,.35),
    inset 1px 0 0 rgba(255,255,255,.04), inset -1px 0 0 rgba(0,0,0,.25),
    0 0 0 1px #07080a,
    0 2px 0 #0b0c0f,
    0 5px 10px rgba(0,0,0,.55);
  transition: transform .08s ease, box-shadow .15s ease, background .15s ease; }
.rail-item { height: 58px; border-radius: 12px; padding: 0 12px 0 9px; }
.rail-item::after { content: ""; position: absolute; inset: 1px 1px auto 1px; height: 46%; border-radius: 11px 11px 40% 40% / 11px 11px 14px 14px; pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,0)); }
.rail-item:hover { background: linear-gradient(180deg, #3a3e47 0%, #2f333a 38%, #262930 72%, #202328 100%); }
.rail-item:active { transform: translateY(2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 1px rgba(0,0,0,.35), 0 0 0 1px #07080a, 0 0 0 #0b0c0f, 0 2px 4px rgba(0,0,0,.55); }
/* janela do ícone: vidro escuro embutido; ícone gravado */
.rail-item .ri-ic { width: 38px; height: 38px; border-radius: 9px; color: #7d8592;
  background: radial-gradient(120% 90% at 50% 0%, #1b1e24 0%, #0d0f12 70%);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.85), inset 0 -1px 0 rgba(255,255,255,.06), 0 1px 0 rgba(255,255,255,.08); }
.rail-item .ri-ic svg { filter: drop-shadow(0 1px 0 rgba(0,0,0,.9)); }
.rail-item .ri-tx b { color: #e3e6ea; text-shadow: 0 1px 0 rgba(0,0,0,.85); font-weight: 650; }
.rail-item .ri-tx small { color: #7a828e; text-shadow: 0 1px 0 rgba(0,0,0,.8); }
.rail-item:hover .ri-ic { color: #aeb5c0; }
/* tecla ativa: afundada, com luz azul vazando pelas bordas e ícone aceso */
.rail-item.active { transform: translateY(1px);
  background: linear-gradient(180deg, #23262c 0%, #1e2126 50%, #1a1d21 100%);
  box-shadow:
    inset 0 2px 5px rgba(0,0,0,.6), inset 0 -1px 0 rgba(255,255,255,.05),
    0 0 0 1px #07080a, 0 0 0 2px rgba(64,128,255,.35),
    0 0 18px rgba(47,110,255,.28), 0 1px 0 rgba(255,255,255,.05); }
.rail-item.active::after { background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)); }
.rail-item.active::before { display: none; }
.rail-item.active .ri-ic { color: #fff;
  background: radial-gradient(70% 70% at 50% 45%, rgba(90,150,255,.55) 0%, rgba(30,80,220,.35) 45%, #0a1430 100%);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.6), inset 0 0 0 1px rgba(110,165,255,.35), 0 0 14px rgba(47,110,255,.55), 0 1px 0 rgba(255,255,255,.08); }
.rail-item.active .ri-ic svg { filter: drop-shadow(0 0 4px rgba(150,190,255,.9)); }
.rail-item.active .ri-tx b { color: #fff; }
.rail-item.active .ri-tx small { color: #8fa9d8; }
/* LED de status à direita da tecla */
.rail-item[data-g]::before, .rail-item#openAuto::before { display: block; content: ""; position: absolute; left: auto; right: 12px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%;
  background: #2a2d33; box-shadow: inset 0 1px 1px rgba(0,0,0,.8), 0 1px 0 rgba(255,255,255,.08); bottom: auto; }
.rail-item[data-g].active::before { display: block; background: #4d8dff; box-shadow: 0 0 6px #4d8dff, 0 0 12px rgba(77,141,255,.6); }
.rail-item#openAuto:has(.rail-live:not([hidden]))::before { background: #3ddc97; box-shadow: 0 0 6px #3ddc97, 0 0 12px rgba(61,220,151,.6); }
.rail-item .rail-live { display: none; }

/* teclas do topo */
.app .top .icon-btn { width: 40px; height: 40px; border-radius: 10px; }
.app .top .account select, .app .top .account .btn:not(.primary) { height: 40px; border-radius: 10px; text-shadow: 0 1px 0 rgba(0,0,0,.8);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%23aab1bc' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"), var(--cap); }
.app .top .account .btn:not(.primary) { background-image: var(--cap); }
.app .top .icon-btn:hover, .app .top .account select:hover, .app .top .account .btn:not(.primary):hover { filter: brightness(1.12); }
.app .top .icon-btn:active, .app .top .account .btn:active { transform: translateY(2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 1px #07080a, 0 2px 4px rgba(0,0,0,.55); }
/* visor do saldo: janela de LCD embutida */
.app .balance { padding: 5px 14px; border-radius: 10px; background: linear-gradient(180deg, #0b0d10, #121418);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.85), inset 0 0 0 1px #050607, 0 1px 0 rgba(255,255,255,.06); }
.app .balance strong { text-shadow: 0 0 10px rgba(255,255,255,.12); }
/* Entrar com Deriv: tecla de vidro azul iluminada */
.app .top .account .btn.primary { height: 42px; border-radius: 11px; padding: 0 22px; font-size: 14px; letter-spacing: .01em; text-shadow: 0 1px 1px rgba(0,20,80,.6);
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, #5b9bff 0%, #2f6ff0 45%, #1c4fd2 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55), inset 0 -3px 6px rgba(0,25,90,.45), inset 0 0 0 1px rgba(255,255,255,.08),
    0 0 0 1px #0a1a45, 0 3px 0 #0d2a7a, 0 8px 20px -4px rgba(47,110,255,.7); }
.app .top .account .btn.primary:hover { filter: brightness(1.08); }
.app .top .account .btn.primary:active { transform: translateY(2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -2px 4px rgba(0,25,90,.45), 0 0 0 1px #0a1a45, 0 1px 0 #0d2a7a, 0 4px 10px -4px rgba(47,110,255,.7); }
/* marca gravada */
.app .brand strong { color: #eef1f4; text-shadow: 0 1px 0 rgba(0,0,0,.9), 0 -1px 0 rgba(255,255,255,.06); }
@media (max-width: 1180px) { .rail-item[data-g]::before, .rail-item#openAuto::before { right: 4px; top: 8px; margin-top: 0; } .rail { padding: 14px 8px; } }
.app .top .account select { background-repeat: no-repeat, no-repeat; background-position: right 12px center, 0 0; background-size: 12px, 100% 100%; padding: 0 34px 0 14px; }

/* ======================= v0.41 Opções de acabamento (prévia: ?sk=vidro|carbono|couro|piano) ======================= */
/* ---- 1. Vidro fosco grosso ---- */
body.sk-vidro .rail, body.sk-vidro .app .top, body.sk-vidro.app .top {
  background: radial-gradient(260px 220px at 20% 18%, rgba(47,110,255,.22), transparent 70%), radial-gradient(260px 240px at 70% 78%, rgba(229,72,79,.16), transparent 70%), linear-gradient(180deg, #0c0f15, #080a0e) !important; }
body.sk-vidro .rail-item, body.sk-vidro .app .top .icon-btn, body.sk-vidro .app .top .account select, body.sk-vidro .app .top .account .btn:not(.primary) {
  background: linear-gradient(180deg, rgba(255,255,255,.13) 0%, rgba(255,255,255,.05) 48%, rgba(255,255,255,.02) 52%, rgba(255,255,255,.06) 100%) !important;
  backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(255,255,255,.12), 0 1px 0 rgba(0,0,0,.4), 0 10px 24px rgba(0,0,0,.45) !important; }
body.sk-vidro .rail-item::after { background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0)); height: 40%; }
body.sk-vidro .rail-item .ri-ic { background: rgba(0,0,0,.35); box-shadow: inset 0 1px 3px rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.12); color: #c9d4e3; }
body.sk-vidro .rail-item.active { background: linear-gradient(180deg, rgba(90,150,255,.35) 0%, rgba(47,110,255,.18) 50%, rgba(47,110,255,.26) 100%) !important;
  box-shadow: inset 0 1px 0 rgba(200,220,255,.6), inset 0 0 0 1px rgba(120,170,255,.45), 0 0 22px rgba(47,110,255,.35), 0 10px 24px rgba(0,0,0,.45) !important; }
body.sk-vidro .rail-item.active .ri-ic { background: rgba(10,30,90,.55); }

/* ---- 2. Fibra de carbono + teclas de alumínio ---- */
body.sk-carbono .rail, body.sk-carbono.app .top {
  background:
    linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px, linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0,
    linear-gradient(27deg, #222 5px, transparent 5px) 0 10px, linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
    linear-gradient(90deg, #1b1b1b 10px, transparent 10px), linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424) !important;
  background-color: #131313 !important; background-size: 20px 20px !important; }
body.sk-carbono .rail::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,0) 35%, rgba(0,0,0,.35) 100%); }
body.sk-carbono .rail-item, body.sk-carbono .app .top .icon-btn, body.sk-carbono .app .top .account select, body.sk-carbono .app .top .account .btn:not(.primary) {
  color: #1d2026 !important;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, rgba(0,0,0,.035) 1px 2px), linear-gradient(180deg, #e9ecf0 0%, #c9ced5 45%, #b3b9c2 55%, #d2d7dd 100%) !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 2px rgba(0,0,0,.25), 0 0 0 1px #0a0a0a, 0 2px 0 #050505, 0 6px 12px rgba(0,0,0,.6) !important; }
body.sk-carbono .rail-item::after { background: linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,0)); }
body.sk-carbono .rail-item .ri-tx b { color: #15181d; text-shadow: 0 1px 0 rgba(255,255,255,.7); }
body.sk-carbono .rail-item .ri-tx small { color: #4a515c; text-shadow: 0 1px 0 rgba(255,255,255,.5); }
body.sk-carbono .rail-item .ri-ic { background: linear-gradient(180deg, #a9b0ba, #c6ccd3); color: #2a2f37; box-shadow: inset 0 2px 3px rgba(0,0,0,.35), 0 1px 0 rgba(255,255,255,.8); }
body.sk-carbono .rail-item .ri-ic svg { filter: drop-shadow(0 1px 0 rgba(255,255,255,.6)); }
body.sk-carbono .rail-item.active { background: repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, rgba(0,0,0,.035) 1px 2px), linear-gradient(180deg, #c8ced6 0%, #b2b8c1 50%, #c2c8cf 100%) !important;
  box-shadow: inset 0 2px 5px rgba(0,0,0,.45), 0 0 0 1px #0a0a0a, 0 0 0 2px #2f6ff0, 0 0 16px rgba(47,110,255,.45) !important; }
body.sk-carbono .rail-item.active .ri-ic { background: radial-gradient(circle at 50% 40%, #6aa2ff, #1d4fd6); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 10px rgba(47,110,255,.7); }
body.sk-carbono .rail-cap { color: #9aa0a8; }
body.sk-carbono .app .balance { background: #050505; }

/* ---- 3. Couro preto costurado + aro cromado ---- */
body.sk-couro .rail, body.sk-couro.app .top {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.35' numOctaves='4' seed='3'/%3E%3CfeDiffuseLighting lighting-color='%23ffffff' surfaceScale='1.6'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -.9 .62'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E"), linear-gradient(180deg, #1c1c1e, #141416) !important; }
body.sk-couro .rail { box-shadow: inset -7px 0 0 -6px rgba(255,255,255,.0), inset -10px 0 0 -9px #0a0a0b !important; }
body.sk-couro .rail::after { content: ""; position: absolute; top: 8px; bottom: 8px; right: 6px; border-right: 1.5px dashed rgba(190,190,195,.35); pointer-events: none; }
body.sk-couro.app .top::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: 5px; border-bottom: 1.5px dashed rgba(190,190,195,.35); pointer-events: none; }
body.sk-couro .rail-item, body.sk-couro .app .top .icon-btn, body.sk-couro .app .top .account select, body.sk-couro .app .top .account .btn:not(.primary) {
  background: radial-gradient(120% 80% at 50% 0%, #2a2b2f 0%, #17181b 70%) !important; color: #e8e8ea !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 1px #000, 0 0 0 2px #8d939c, 0 0 0 3px #3a3d42, 0 0 0 4px #000, 0 6px 14px rgba(0,0,0,.6) !important; }
body.sk-couro .rail { gap: 12px; }
body.sk-couro .rail-item .ri-ic { background: #0c0c0d; color: #b9bdc4; box-shadow: inset 0 2px 4px rgba(0,0,0,.9), 0 0 0 1px #5d626a; }
body.sk-couro .rail-item.active { box-shadow: inset 0 2px 5px rgba(0,0,0,.6), 0 0 0 1px #000, 0 0 0 2px #cfd3d9, 0 0 0 3px #6c7178, 0 0 0 4px #000, 0 0 18px rgba(47,110,255,.45) !important; }
body.sk-couro .rail-item.active .ri-ic { background: radial-gradient(circle at 50% 40%, #5a95ff, #183f9e); color: #fff; box-shadow: 0 0 0 1px #9fc0ff, 0 0 12px rgba(47,110,255,.6); }

/* ---- 4. Vidro preto piano com teclas iluminadas ---- */
body.sk-piano .rail, body.sk-piano.app .top { background: linear-gradient(160deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,0) 28%, rgba(255,255,255,0) 70%, rgba(255,255,255,.03) 100%), #050608 !important; }
body.sk-piano .rail-item, body.sk-piano .app .top .icon-btn, body.sk-piano .app .top .account select, body.sk-piano .app .top .account .btn:not(.primary) {
  background: linear-gradient(180deg, #0d0f13, #07080a) !important; color: #cfd6e0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 0 0 1px rgba(255,255,255,.05), 0 0 0 1px #000, 0 8px 18px rgba(0,0,0,.7) !important; }
body.sk-piano .rail-item::after { height: 50%; border-radius: 11px 11px 0 0; background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.015)); }
body.sk-piano .rail-item .ri-ic { background: transparent; box-shadow: none; color: #6f7a8a; }
body.sk-piano .rail-item .ri-ic svg { filter: drop-shadow(0 0 3px rgba(160,190,230,.25)); }
body.sk-piano .rail-item.active { background: linear-gradient(180deg, #0b1220, #070a12) !important;
  box-shadow: inset 0 1px 0 rgba(140,180,255,.35), inset 0 0 0 1px rgba(90,150,255,.55), inset 0 -16px 24px -12px rgba(47,110,255,.35), 0 0 0 1px #000, 0 0 22px rgba(47,110,255,.35) !important; }
body.sk-piano .rail-item.active .ri-ic { background: transparent; box-shadow: none; color: #9fc2ff; }
body.sk-piano .rail-item.active .ri-ic svg { filter: drop-shadow(0 0 6px rgba(110,165,255,.95)); }
body.sk-piano .rail-item.active::before { background: #6aa2ff; }

/* ---- F. Titânio jateado + vidro de safira ---- */
body.sk-titanio .rail, body.sk-titanio.app .top { background: var(--grain), linear-gradient(180deg, #3a3d42 0%, #2f3237 100%) !important; }
body.sk-titanio .rail-item, body.sk-titanio .app .top .icon-btn, body.sk-titanio .app .top .account select, body.sk-titanio .app .top .account .btn:not(.primary) {
  background: var(--grain), linear-gradient(180deg, #4a4e55 0%, #3c4046 100%) !important; color: #eef0f3 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.35), 0 0 0 1px #1d1f23, 0 3px 0 #1b1d21, 0 8px 14px rgba(0,0,0,.45) !important; }
body.sk-titanio .rail-item::after { display: none; }
body.sk-titanio .rail-item .ri-ic { border-radius: 50%; color: #d8e6ff;
  background: radial-gradient(80% 60% at 35% 25%, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 40%), radial-gradient(circle at 50% 60%, #2a4a8a 0%, #0f1f45 70%, #0a1430 100%);
  box-shadow: 0 0 0 2px #8b9099, 0 0 0 3px #2a2c30, inset 0 2px 6px rgba(0,0,0,.6); }
body.sk-titanio .rail-item .ri-tx small { color: #b3b8c0; }
body.sk-titanio .rail-cap { color: #c3c7cd; text-shadow: 0 1px 0 rgba(0,0,0,.5); }
body.sk-titanio .rail-item.active { background: var(--grain), linear-gradient(180deg, #3a3e45 0%, #34373d 100%) !important;
  box-shadow: inset 0 2px 5px rgba(0,0,0,.45), 0 0 0 1px #1d1f23, 0 0 0 2px #6ea0ff, 0 0 16px rgba(80,140,255,.4) !important; }
body.sk-titanio .rail-item.active .ri-ic { background: radial-gradient(80% 60% at 35% 25%, rgba(255,255,255,.65) 0%, rgba(255,255,255,0) 40%), radial-gradient(circle at 50% 60%, #4f8cff 0%, #1d4fd6 70%, #12318a 100%); color: #fff; box-shadow: 0 0 0 2px #c9ccd2, 0 0 0 3px #2a2c30, 0 0 14px rgba(80,140,255,.7); }

/* ---- G. Preto fosco + aros champagne ---- */
body.sk-champagne .rail, body.sk-champagne.app .top { background: var(--grain), linear-gradient(180deg, #0e0e0f, #0a0a0b) !important; }
body.sk-champagne .rail-item, body.sk-champagne .app .top .icon-btn, body.sk-champagne .app .top .account select, body.sk-champagne .app .top .account .btn:not(.primary) {
  background: linear-gradient(180deg, #19191b, #121213) !important; color: #efe9dc !important;
  box-shadow: inset 0 1px 0 rgba(255,240,210,.08), 0 0 0 1px #000, 0 0 0 2px #6d6250, 0 0 0 2.5px #2b261e, 0 8px 18px rgba(0,0,0,.7) !important; }
body.sk-champagne .rail-item::after { background: linear-gradient(180deg, rgba(255,240,210,.05), transparent); }
body.sk-champagne .rail-item .ri-ic { background: linear-gradient(180deg, #2a261f, #141210); color: #d9c7a0; box-shadow: inset 0 1px 0 rgba(255,235,190,.25), 0 0 0 1px #8a7a5c; }
body.sk-champagne .rail-item .ri-tx small, body.sk-champagne .rail-cap { color: #8f8678; }
body.sk-champagne .rail-item.active { box-shadow: inset 0 0 0 1px rgba(232,212,170,.35), 0 0 0 1px #000, 0 0 0 2px #d8c08e, 0 0 0 2.5px #4a3f2c, 0 0 18px rgba(216,192,142,.18), 0 8px 18px rgba(0,0,0,.7) !important; }
body.sk-champagne .rail-item.active .ri-ic { background: linear-gradient(180deg, #f1dfb4 0%, #c9ad74 55%, #a88a52 100%); color: #1a1610; box-shadow: inset 0 1px 0 #fff4d6, 0 0 0 1px #6d5a35, 0 4px 10px rgba(216,192,142,.3); }
body.sk-champagne .rail-item.active .ri-ic svg { filter: none; }
body.sk-champagne .rail-item[data-g].active::before { background: #e8cf98; box-shadow: 0 0 6px #e8cf98; }

/* ---- H. Alumínio anodizado + botões giratórios usinados ---- */
body.sk-usinado .rail, body.sk-usinado.app .top { background: var(--grain), repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 3px), linear-gradient(180deg, #2b2e33, #222428) !important; }
body.sk-usinado .rail-item, body.sk-usinado .app .top .icon-btn, body.sk-usinado .app .top .account select, body.sk-usinado .app .top .account .btn:not(.primary) {
  background: linear-gradient(180deg, #24272c, #1d1f23) !important; color: #e6e8eb !important;
  box-shadow: inset 0 2px 5px rgba(0,0,0,.55), inset 0 -1px 0 rgba(255,255,255,.06), 0 1px 0 rgba(255,255,255,.07) !important; }
body.sk-usinado .rail-item::after { display: none; }
body.sk-usinado .rail-item .ri-ic { width: 40px; height: 40px; border-radius: 50%; color: #2b2e33;
  background: radial-gradient(circle at 50% 50%, transparent 0 58%, rgba(0,0,0,.25) 59% 61%, transparent 62%), repeating-radial-gradient(circle at 50% 50%, #d9dce0 0 1px, #c3c7cc 1px 2px, #e6e8eb 2px 3px), linear-gradient(160deg, #f4f5f7, #9ea3aa);
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 3px rgba(0,0,0,.25), 0 0 0 1px #0d0e10, 0 4px 8px rgba(0,0,0,.6); }
body.sk-usinado .rail-item .ri-ic svg { filter: drop-shadow(0 1px 0 rgba(255,255,255,.7)); }
body.sk-usinado .rail-item.active { background: linear-gradient(180deg, #1e2126, #191b1f) !important; box-shadow: inset 0 2px 6px rgba(0,0,0,.6), inset 0 0 0 1px rgba(90,150,255,.4), 0 1px 0 rgba(255,255,255,.07) !important; }
body.sk-usinado .rail-item.active .ri-ic { color: #fff; background: radial-gradient(circle at 50% 50%, transparent 0 58%, rgba(0,0,0,.25) 59% 61%, transparent 62%), repeating-radial-gradient(circle at 50% 50%, #5a92ff 0 1px, #3c78f0 1px 2px, #6aa0ff 2px 3px), linear-gradient(160deg, #8ab4ff, #1d4fd6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 0 0 1px #0d0e10, 0 0 14px rgba(70,130,255,.6); }
body.sk-usinado .rail-item.active .ri-ic svg { filter: drop-shadow(0 1px 0 rgba(0,30,100,.6)); }

/* ---- J. Painel de cockpit (aviação) ---- */
body.sk-cockpit .rail, body.sk-cockpit.app .top { background: var(--grain), linear-gradient(180deg, #2a2d30, #232528) !important; }
body.sk-cockpit .rail::before { content: ""; position: absolute; left: 6px; right: 6px; top: 6px; height: 6px; pointer-events: none;
  background: radial-gradient(circle at 3px 3px, #8e939a 0 2px, #3a3d41 2.5px, transparent 3px) left/6px 6px no-repeat, radial-gradient(circle at 3px 3px, #8e939a 0 2px, #3a3d41 2.5px, transparent 3px) right/6px 6px no-repeat; }
body.sk-cockpit .rail-item, body.sk-cockpit .app .top .icon-btn, body.sk-cockpit .app .top .account select, body.sk-cockpit .app .top .account .btn:not(.primary) {
  border-radius: 6px !important; background: linear-gradient(180deg, #3b3e43 0%, #2f3236 100%) !important; color: #f2f2ee !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 0 0 1px #111, 0 0 0 3px #1c1d20, 0 0 0 4px #3d4045, 0 4px 8px rgba(0,0,0,.5) !important; }
body.sk-cockpit .rail { gap: 12px; }
body.sk-cockpit .rail-item::after { display: none; }
body.sk-cockpit .rail-item .ri-ic { border-radius: 4px; background: #101112; color: #f2f2ee; box-shadow: inset 0 1px 3px rgba(0,0,0,.9); }
body.sk-cockpit .rail-item .ri-ic svg { filter: drop-shadow(0 0 2px rgba(255,255,240,.45)); }
body.sk-cockpit .rail-item .ri-tx b { font-weight: 700; letter-spacing: .01em; }
body.sk-cockpit .rail-item .ri-tx small { color: #a9aca6; }
body.sk-cockpit .rail-item[data-g]::before, body.sk-cockpit .rail-item#openAuto::before { width: 18px; height: 5px; border-radius: 1px; right: 10px; margin-top: -2.5px; background: #3a2e12; }
body.sk-cockpit .rail-item[data-g].active::before { background: #ffb020; box-shadow: 0 0 6px #ffb020, 0 0 12px rgba(255,176,32,.6); }
body.sk-cockpit .rail-item.active { background: linear-gradient(180deg, #2f3236, #292b2f) !important; box-shadow: inset 0 2px 4px rgba(0,0,0,.5), 0 0 0 1px #111, 0 0 0 3px #1c1d20, 0 0 0 4px #3d4045 !important; }
body.sk-cockpit .rail-item.active .ri-ic { color: #ffcf6e; box-shadow: inset 0 1px 3px rgba(0,0,0,.9), 0 0 10px rgba(255,176,32,.25); }
body.sk-cockpit .rail-item.active .ri-ic svg { filter: drop-shadow(0 0 3px rgba(255,190,80,.9)); }

/* ======================= v0.42 Lateral com acabamento de corretora (Binance/Bybit) ======================= */
:root { --bx-bg: #0b0e11; --bx-p: #181a20; --bx-p2: #1e2329; --bx-h: #2b3139; --bx-ln: #2b3139; --bx-tx: #eaecef; --bx-mu: #848e9c; --bx-ac: #3b7cf0; }
body.app { background: var(--bx-bg); }
body.app .top { background: var(--bx-p); border-bottom: 1px solid var(--bx-ln); box-shadow: none; }
body.app .brand { border-right: 1px solid var(--bx-ln); box-shadow: none; }
body.app .brand strong { text-shadow: none; color: #fff; }
body.app .ticker > * + * { border-left: 1px solid var(--bx-ln); box-shadow: none; }
body.app .tk-asset em { background: var(--bx-h); box-shadow: none; color: var(--bx-mu); }
body.app .rail { background: var(--bx-p); border-right: 1px solid var(--bx-ln); box-shadow: none; padding: 16px 12px; gap: 2px; }
body.app .rail-cap { color: var(--bx-mu); text-shadow: none; font-size: 12px; font-weight: 500; padding: 14px 12px 6px; }
body.app .rail-cap:first-child { padding-top: 0; }
body.app .rail-foot { border-top: 1px solid var(--bx-ln); box-shadow: none; color: #5e6673; }
/* itens: planos, precisos */
body.app .rail .rail-item { height: 44px; padding: 0 12px; gap: 12px; border-radius: 8px; transform: none; color: var(--bx-tx);
  background: transparent; box-shadow: none; transition: background .12s ease, color .12s ease; }
body.app .rail .rail-item::after { display: none; }
body.app .rail .rail-item::before { display: none !important; }
body.app .rail .rail-item .ri-ic { width: 20px; height: 20px; border-radius: 0; background: none; box-shadow: none; color: var(--bx-mu); }
body.app .rail .rail-item .ri-ic svg { width: 20px; height: 20px; filter: none; }
body.app .rail .rail-item .ri-tx b { color: var(--bx-tx); text-shadow: none; font-size: 14px; font-weight: 500; }
body.app .rail .rail-item .ri-tx small { display: none; }
body.app .rail .rail-item:hover { background: var(--bx-p2); }
body.app .rail .rail-item:hover .ri-ic { color: var(--bx-tx); }
body.app .rail .rail-item:active { transform: none; box-shadow: none; }
body.app .rail .rail-item.active { background: var(--bx-h); box-shadow: none; transform: none; }
body.app .rail .rail-item.active .ri-ic { background: none; box-shadow: none; color: var(--bx-ac); }
body.app .rail .rail-item.active .ri-ic svg { filter: none; }
body.app .rail .rail-item.active .ri-tx b { color: #fff; font-weight: 600; }
body.app .rail .rail-item .rail-live { display: inline; position: static; margin-left: auto; font-size: 11px; }
/* topo: botões sólidos */
body.app .top .icon-btn, body.app .top .account select, body.app .top .account .btn:not(.primary) {
  height: 36px; border-radius: 6px; border: 0; background: var(--bx-h); color: var(--bx-tx); box-shadow: none; text-shadow: none; filter: none; transform: none; }
body.app .top .icon-btn { width: 36px; }
body.app .top .account select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%23848e9c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-color: var(--bx-h); background-repeat: no-repeat; background-position: right 10px center; background-size: 12px; padding: 0 30px 0 12px; font-size: 13px; font-weight: 500; }
body.app .top .account .btn:not(.primary) { background-image: none; font-weight: 600; }
body.app .top .icon-btn:hover, body.app .top .account select:hover, body.app .top .account .btn:not(.primary):hover { background-color: #363c45; filter: none; }
body.app .top .account .btn.primary { height: 36px; border-radius: 6px; padding: 0 18px; background: var(--bx-ac); box-shadow: none; text-shadow: none; font-weight: 600; font-size: 14px; }
body.app .top .account .btn.primary:hover { background: #4f8bf5; filter: none; }
body.app .top .icon-btn:active, body.app .top .account .btn:active { transform: none; box-shadow: none; }
body.app .balance { background: none; box-shadow: none; padding: 0 8px; }
body.app .balance span { color: var(--bx-mu); }
body.app .balance strong { text-shadow: none; font-weight: 600; }
body.app .rail .rail-item .rail-live[hidden] { display: none !important; }

/* ======================= v0.43 Lateral com conta, jogos ilustrados e suporte ======================= */
@media (min-width: 1181px) { :root { --rail-w: 252px; } }
body.app .rail { padding: 14px 12px 12px; }
/* marca */
.zmark { width: 30px; height: 30px; flex: 0 0 auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.45)); }
body.app .brand strong { font-size: 19px; font-weight: 800; letter-spacing: .06em; }
/* cartão da conta */
.acct { margin: 0 0 6px; padding: 14px 14px 12px; border-radius: 12px; background: linear-gradient(160deg, #222833 0%, #1a1f27 60%, #181c23 100%);
  border: 1px solid #2f3641; box-shadow: 0 8px 22px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05); }
.acct-h { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--bx-mu); }
.acct-mode { font-style: normal; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; background: #2b3139; color: #c9ced6; }
.acct-mode.demo { background: rgba(255,176,32,.14); color: #ffbf47; }
.acct-mode.real { background: rgba(61,220,151,.14); color: #3ddc97; }
.acct-bal { display: block; margin: 6px 0 12px; font-size: 22px; font-weight: 700; color: #fff; letter-spacing: -.01em; font-feature-settings: "tnum" 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acct-act { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.acct-btn { height: 36px; display: grid; place-items: center; border-radius: 7px; border: 0; background: #2b3139; color: var(--bx-tx); font: 600 13px/1 inherit; text-decoration: none; cursor: pointer; white-space: nowrap; padding: 0 8px; }
.acct-btn:hover { background: #363c45; }
.acct-btn.pri { background: var(--bx-ac); color: #fff; }
.acct-btn.pri:hover { background: #4f8bf5; }
.acct-seal { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding-top: 10px; border-top: 1px solid #2b3139; font-size: 11.5px; line-height: 1.4; color: var(--bx-mu); }
.acct-seal svg { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 1px; fill: none; stroke: #3ddc97; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.acct-seal b { color: var(--bx-tx); font-weight: 600; }
/* jogos com miniatura */
body.app .rail .rail-item.gm { height: 52px; padding: 0 10px 0 8px; }
.gm-th { width: 46px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; background: #0f1216; border: 1px solid #262c35; }
.gm-th svg { width: 40px; height: 29px; }
body.app .rail .rail-item.gm .ri-tx small { display: block; font-size: 11.5px; color: var(--bx-mu); text-shadow: none; }
body.app .rail .rail-item.gm.active .gm-th { border-color: var(--bx-ac); box-shadow: 0 0 0 1px rgba(59,124,240,.35); }
/* suporte e rodapé */
.rail-help { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #1e2329; border: 1px solid #2b3139; color: var(--bx-tx); text-decoration: none; }
.rail-help:hover { background: #252b33; }
.rail-help svg { width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: #3ddc97; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.rail-help span { display: flex; flex-direction: column; line-height: 1.25; }
.rail-help b { font-size: 13px; font-weight: 600; } .rail-help small { font-size: 11.5px; color: var(--bx-mu); }
body.app .rail-foot { margin-top: 10px; display: flex; gap: 8px; align-items: flex-start; border-top: 0; padding: 0 2px; font-size: 10.5px; line-height: 1.45; }
.r18 { flex: 0 0 auto; font-size: 10px; font-weight: 800; color: var(--bx-tx); border: 1.5px solid #5e6673; border-radius: 50%; width: 24px; height: 24px; display: grid; place-items: center; }
/* topo: estatísticas do ativo */
.tk-st { flex-direction: column; justify-content: center; align-items: flex-start !important; line-height: 1.25; }
.tk-st small { font-size: 11px; color: var(--bx-mu); }
.tk-st b { font-size: 13px; font-weight: 600; color: var(--bx-tx); font-feature-settings: "tnum" 1; }
/* telas menores: lateral recolhida mostra só miniaturas */
@media (max-width: 1180px) { .acct, .rail-help, .tk-st { display: none !important; } .gm-th { width: 40px; } }
.acct-act { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } .acct-btn { font-size: 13px; overflow: hidden; text-overflow: ellipsis; }

/* ======================= v0.44 Topo no modelo Atmoz, adaptado à ZUPX ======================= */
:root { --top-h: 64px; --bx-bg: #0a0d14; --bx-p: #0d121b; --bx-p2: #131a26; --bx-h: #182131; --bx-ln: #1c2433; --bx-tx: #e8edf4; --bx-mu: #8b95a7; --bx-ac: #2f6fed; }
body.app { background: var(--bx-bg); }
body.app .top { height: var(--top-h); gap: 0; padding: 0 22px 0 0; background: #0b0f17; border-bottom: 1px solid var(--bx-ln); box-shadow: 0 1px 0 rgba(0,0,0,.4); }
/* marca */
body.app .brand { width: var(--rail-w); padding-left: 22px; gap: 10px; border-right: 0; box-shadow: none; }
.zmark { width: 34px; height: 34px; }
.wm { display: flex; flex-direction: column; line-height: 1; }
.wm strong { font-size: 24px !important; font-weight: 900 !important; letter-spacing: .02em !important; color: #fff; font-style: italic; }
.wm small { margin-top: 3px; font-size: 8.5px; font-weight: 700; letter-spacing: .62em; color: #7f8aa0; text-transform: lowercase; padding-left: 2px; }
/* navegação */
.topnav { display: flex; align-items: center; gap: 4px; padding-left: 8px; height: 100%; }
.tn-item { position: relative; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: 9px; border: 1px solid transparent; background: none;
  color: #c3cad5; font: 500 14.5px/1 inherit; text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .12s ease, color .12s ease; }
.tn-item svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
.tn-item:hover { color: #fff; background: #111724; }
.tn-item.on { color: #fff; font-weight: 600; background: #141b29; border-color: #222c3e; }
.tn-item.on svg { color: #4c8dff; opacity: 1; }
.tn-item .rail-live { margin-left: 2px; font-size: 10.5px; }
.tn-item .rail-live[hidden] { display: none; }
/* direita */
body.app .controls { gap: 12px; }
body.app .top .icon-btn { width: 36px; height: 36px; border-radius: 9px; background: transparent; border: 0; color: #c3cad5; box-shadow: none; }
body.app .top .icon-btn:hover { background: #111724; color: #fff; }
body.app .balance { align-items: flex-end; padding: 0 6px 0 0; }
body.app .balance span { font-size: 10.5px; font-weight: 600; color: #7f8aa0; letter-spacing: .02em; }
body.app .balance strong { font-size: 17px; font-weight: 700; color: #fff; letter-spacing: .01em; font-feature-settings: "tnum" 1; }
.cash { display: flex; gap: 8px; }
.cash-btn, body.app .top .account .btn, body.app .top .account select { height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 16px; border-radius: 9px;
  border: 1px solid #263044 !important; background: #0f1420 !important; color: #fff !important; font: 600 13.5px/1 inherit; text-decoration: none; cursor: pointer; box-shadow: none !important; white-space: nowrap; }
.cash-btn svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: .8; }
.cash-btn:hover, body.app .top .account .btn:hover, body.app .top .account select:hover { background: #141b29 !important; border-color: #334059 !important; }
.cash-btn.pri, body.app .top .account .btn.primary { background: var(--bx-ac) !important; border-color: var(--bx-ac) !important; }
.cash-btn.pri:hover, body.app .top .account .btn.primary:hover { background: #4280f5 !important; border-color: #4280f5 !important; }
body.app .top .account select { padding: 0 32px 0 12px; font-weight: 500; font-size: 13px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%238b95a7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 11px center !important; background-size: 12px !important; }
/* lateral: card do mercado no topo */
body.app .rail { background: #0b0f17; border-right: 1px solid var(--bx-ln); padding-top: 16px; }
.mkt { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px 12px; height: auto !important; padding: 14px; margin-bottom: 8px; border-radius: 12px;
  background: linear-gradient(160deg, #121927, #0e131d); border: 1px solid #1f2838; }
.mkt > * { padding: 0 !important; height: auto !important; border: 0 !important; box-shadow: none !important; }
.mkt .tk-asset { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; font-size: 13px; color: #c3cad5; }
.mkt .tk-price { grid-column: 1 / -1; font-size: 26px !important; font-weight: 700; color: #fff; min-width: 0 !important; letter-spacing: -.01em; }
.mkt .tk-chg { font-size: 13px !important; font-weight: 600; }
.mkt .conn { justify-self: end; font-size: 12px; }
.mkt .tk-st { display: flex !important; }
.mkt .tk-st:last-child { grid-column: 1 / -1; flex-direction: row !important; justify-content: space-between; align-items: center !important; padding-top: 10px !important; border-top: 1px solid #1f2838 !important; }
body.app .rail .rail-item.gm.active { background: #141b29; box-shadow: inset 0 0 0 1px #222c3e; }
.gm-th { background: #0a0e15; border-color: #1f2838; }
.rail-help { background: #111724; border-color: #1f2838; }
@media (max-width: 1400px) { .tn-item span { display: none; } .tn-item { padding: 0 11px; } .tn-item.on span { display: inline; } }
@media (max-width: 1180px) { .mkt { display: none !important; } .wm small { display: none; } body.app .brand { width: auto; padding-right: 10px; } }
.tn-item svg .f { fill: currentColor; stroke: none; }

/* ======================= v0.45 Histórico ======================= */
.hist .lab-head { gap: 14px; }
.hist .lab-head > div { margin-right: auto; }
.hs-sel { height: 34px; border-radius: 8px; border: 1px solid #222a35; background: #0e1218; color: #e6ebf1; font: 500 13px inherit; padding: 0 10px; }
.hs-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 18px; border-bottom: 1px solid #161c26; }
.hs-per { width: auto; }
.hs-per button { padding: 0 14px; white-space: nowrap; }
.hs-custom { display: flex; gap: 10px; font-size: 12.5px; color: #8a95a5; }
.hs-custom input { height: 32px; border-radius: 8px; border: 1px solid #222a35; background: #0e1218; color: #e6ebf1; padding: 0 8px; color-scheme: dark; font: inherit; margin-left: 4px; }
.hs-flt { display: flex; gap: 8px; margin-left: auto; flex-wrap: wrap; }
.hs-csv { height: 34px; border-radius: 8px; border: 1px solid #263044; background: #0f1420; color: #fff; font: 600 13px inherit; padding: 0 14px; cursor: pointer; }
.hs-csv:hover { background: #141b29; }
.hs-body { flex: 1 1 auto; overflow-y: auto; padding: 6px 22px 22px; scrollbar-width: thin; }
.hs-top { grid-template-columns: 260px 1fr; }
.lab-sheet td .g, .hs-tbl .g { color: #2ebd85; } .lab-sheet td .r, .hs-tbl .r { color: #f6465d; }
#hsCv { display: block; width: 100%; height: 130px; border-radius: 8px; background: #090c10; box-shadow: inset 0 0 0 1px #141a22; margin-bottom: 14px; }
.hs-tbl td small { display: block; font-size: 11px; color: #6b7585; }
.hs-tbl tr.day td { background: #0d1118; color: #c9d1dc; font-weight: 600; font-size: 12.5px; padding-top: 9px; padding-bottom: 9px; }
.hs-tbl tr.day td:last-child { text-align: right; }
.hs-tbl .sd.up { color: #6ea2ff; } .hs-tbl .sd.down { color: #ff7a80; }
.hs-tbl td.none { text-align: center !important; color: #6b7585 !important; padding: 28px 0 !important; }
.hs-more { display: block; margin: 12px auto 0; height: 36px; padding: 0 18px; border-radius: 8px; border: 1px solid #222a35; background: #0e1218; color: #e6ebf1; font: 600 13px inherit; cursor: pointer; }
.hs-more[hidden] { display: none; }
.lab-note a { color: #8fb4ff; }
.hs-tbl th:nth-child(2), .hs-tbl td:nth-child(2), .hs-tbl th:nth-child(4), .hs-tbl td:nth-child(4) { text-align: left; }

/* ======================= v0.46 Histórico: visual de relatório ======================= */
.hist .lab-win { width: min(1240px, 100%); height: min(920px, 100%); background: linear-gradient(180deg, #0d121b 0%, #0a0d14 100%); border-color: #1c2433; }
.hist .lab-head { border-bottom-color: #1c2433; }
.hs-bar { border-bottom-color: #1c2433; }
.hs-csv.pri { background: #2f6fed; border-color: #2f6fed; }
.hs-csv.pri:hover { background: #4280f5; }
.hs-body { padding: 18px 24px 24px; }
.hs-body .g { color: #2ebd85; } .hs-body .r { color: #f6465d; }
/* destaque */
.hs-hero { position: relative; display: grid; grid-template-columns: 360px 1fr; gap: 24px; align-items: stretch; padding: 24px 26px; border-radius: 16px; overflow: hidden;
  background: radial-gradient(600px 260px at 85% 0%, rgba(47,111,237,.10), transparent 70%), linear-gradient(160deg, #131a27 0%, #0e131d 100%); border: 1px solid #1f2838; }
.hs-hl { display: flex; flex-direction: column; justify-content: center; }
.hs-kick { font-size: 13px; color: #8b95a7; font-weight: 600; }
.hs-net { margin: 8px 0 6px; font-size: 52px; font-weight: 800; letter-spacing: -.03em; line-height: 1; color: #fff; font-feature-settings: "tnum" 1; white-space: nowrap; }
.hs-net.g { color: #2ebd85; text-shadow: 0 0 34px rgba(46,189,133,.25); } .hs-net.r { color: #f6465d; text-shadow: 0 0 34px rgba(246,70,93,.2); }
.hs-sub { font-size: 13.5px; color: #c3cad5; }
.hs-acc { margin-top: 20px; display: flex; align-items: center; gap: 12px; }
.hs-acc svg { width: 52px; height: 52px; transform: rotate(-90deg); }
.hs-acc circle { fill: none; stroke-width: 4; } .hs-acc .bg { stroke: #1f2838; } .hs-acc .fg { stroke: #2ebd85; stroke-linecap: round; transition: stroke-dashoffset .5s ease; }
.hs-acc span { display: flex; flex-direction: column; line-height: 1.15; } .hs-acc b { font-size: 22px; font-weight: 800; color: #fff; } .hs-acc small { font-size: 12px; color: #8b95a7; }
.hs-curve { min-height: 200px; } #hsCurve { display: block; width: 100%; height: 100%; }
/* números */
.hs-stats { display: grid; grid-template-columns: repeat(5, 1fr); margin: 14px 0; border: 1px solid #1c2433; border-radius: 14px; background: #0c1119; }
.hs-stats > div { padding: 16px 18px; display: flex; flex-direction: column; gap: 3px; }
.hs-stats > div + div { border-left: 1px solid #1c2433; }
.hs-stats small { font-size: 12px; color: #8b95a7; font-weight: 600; }
.hs-stats b { font-size: 20px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; white-space: nowrap; }
.hs-stats span { font-size: 11.5px; color: #6b7585; }
/* calendário + por jogo */
.hs-two { display: grid; grid-template-columns: 1.55fr 1fr; gap: 14px; margin-bottom: 18px; }
.hs-cal, .hs-games { border: 1px solid #1c2433; border-radius: 14px; background: #0c1119; padding: 16px; }
.hs-cal-h { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.hs-cal-h b { font-size: 15px; color: #fff; min-width: 150px; text-align: center; }
.hs-cal-h button { width: 30px; height: 30px; border-radius: 8px; border: 1px solid #222a35; background: #111724; color: #c3cad5; font-size: 18px; line-height: 1; cursor: pointer; }
.hs-cal-h button:hover { background: #182131; color: #fff; }
.hs-cal-h em { margin-left: auto; font-style: normal; font-size: 12px; color: #8b95a7; }
.hs-cal-w, .hs-cal-g { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.hs-cal-w span { font-size: 11px; color: #6b7585; text-align: center; padding-bottom: 2px; }
.hs-cal-g i.pad { display: block; }
.hs-cal-g button { position: relative; height: 62px; border-radius: 9px; border: 1px solid #1a2230; background: var(--cb, #0f141d); color: #c3cad5; text-align: left; padding: 6px 7px; cursor: pointer; display: flex; flex-direction: column; font: inherit; overflow: hidden; }
.hs-cal-g button span { font-size: 11px; color: #8b95a7; }
.hs-cal-g button b { margin-top: auto; font-size: 13px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; white-space: nowrap; }
.hs-cal-g button small { font-size: 10px; color: rgba(255,255,255,.7); }
.hs-cal-g button.g { border-color: rgba(46,189,133,.45); } .hs-cal-g button.r { border-color: rgba(246,70,93,.45); }
.hs-cal-g button.today { box-shadow: inset 0 0 0 1.5px #4c8dff; }
.hs-cal-g button.fut { opacity: .35; cursor: default; }
.hs-cal-g button.e:hover:not(.fut), .hs-cal-g button.g:hover, .hs-cal-g button.r:hover { filter: brightness(1.15); }
.hs-sec { font-size: 13px; font-weight: 700; color: #c3cad5; margin: 0 0 12px; }
.hs-g { padding: 10px 0; border-bottom: 1px solid #161d29; } .hs-g:last-child { border-bottom: 0; }
.hs-gh { display: flex; justify-content: space-between; font-size: 13.5px; } .hs-gh b { color: #fff; font-weight: 600; } .hs-gh span { font-weight: 700; font-feature-settings: "tnum" 1; }
.hs-g i { display: block; height: 6px; border-radius: 3px; background: #161d29; margin: 8px 0 5px; overflow: hidden; }
.hs-g em { display: block; height: 100%; border-radius: 3px; } .hs-g em.g { background: #2ebd85; } .hs-g em.r { background: #f6465d; }
.hs-g small { font-size: 11.5px; color: #6b7585; }
.hs-none { color: #6b7585; font-size: 13px; }
/* tabela */
.hs-tbl td b { font-weight: 700; }
.hs-gm { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 8px; vertical-align: 1px; background: #3b7cf0; }
.hs-gm.pi { background: linear-gradient(90deg, #e5484f 50%, #3b7cf0 50%); } .hs-gm.dg { background: #ff9f0a; } .hs-gm.ac { background: #2ebd85; }
.hs-tbl tr.day td { background: #0f1520; }
@media (max-width: 1100px) { .hs-hero, .hs-two { grid-template-columns: 1fr; } .hs-stats { grid-template-columns: repeat(2, 1fr); } .hs-stats > div + div { border-left: 0; } }
.hs-curve { position: relative; } #hsCurve { position: absolute; inset: 0; }

/* ======================= v0.47 Histórico: lista de operações estilo corretora ======================= */
.hs-ops { display: flex; flex-direction: column; gap: 6px; }
.op-day { display: flex; align-items: center; gap: 14px; margin: 14px 0 4px; padding: 0 4px; font-size: 13px; color: #8b95a7; }
.op-day:first-child { margin-top: 0; }
.op-day b { color: #fff; font-size: 14px; font-weight: 700; }
.op-day .op-wl { display: flex; gap: 8px; } .op-day .op-wl i { font-style: normal; font-weight: 700; font-size: 12px; }
.op-day em { margin-left: auto; font-style: normal; font-weight: 800; font-size: 15px; font-feature-settings: "tnum" 1; }
.op { position: relative; display: grid; grid-template-columns: 54px minmax(150px, 1.3fr) minmax(200px, 1.6fr) 1fr 1fr 1.1fr 110px 30px; align-items: center; gap: 14px;
  padding: 12px 16px 12px 18px; border-radius: 12px; background: linear-gradient(90deg, #111824 0%, #0e141d 100%); border: 1px solid #1c2433; overflow: hidden; transition: border-color .15s ease, transform .15s ease; }
.op::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; }
.op.win::before { background: #2ebd85; box-shadow: 0 0 14px rgba(46,189,133,.6); }
.op.loss::before { background: #f6465d; box-shadow: 0 0 14px rgba(246,70,93,.5); }
.op.win { background: linear-gradient(90deg, rgba(46,189,133,.07) 0%, #0e141d 38%); }
.op.loss { background: linear-gradient(90deg, rgba(246,70,93,.06) 0%, #0e141d 38%); }
.op:hover { border-color: #2a3548; }
.op-th { width: 54px; height: 40px; display: grid; place-items: center; border-radius: 9px; background: #0a0e15; border: 1px solid #1f2838; }
.op-th svg { width: 44px; height: 32px; }
.op-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.op-main b { color: #fff; font-size: 14.5px; font-weight: 700; }
.op-main span { font-size: 12px; color: #8b95a7; font-feature-settings: "tnum" 1; }
.op-dir { display: flex; align-items: center; gap: 10px; min-width: 0; }
.op-dir svg { width: 28px; height: 28px; flex: 0 0 auto; padding: 7px; border-radius: 8px; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.op-dir.up svg { stroke: #6ea2ff; background: rgba(59,124,240,.14); } .op-dir.down svg { stroke: #ff7a80; background: rgba(229,72,79,.14); }
.op-dir span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.op-dir span > b { font-size: 14px; font-weight: 700; } .op-dir.up span > b { color: #6ea2ff; } .op-dir.down span > b { color: #ff7a80; }
.op-dir small { font-size: 12px; color: #8b95a7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-feature-settings: "tnum" 1; }
.op-dir small b { color: #c3cad5; font-weight: 600; } .op-dir small b.dig { display: inline-grid; place-items: center; min-width: 18px; height: 18px; border-radius: 5px; background: #1c2433; color: #fff; font-weight: 800; }
.op-num, .op-res { display: flex; flex-direction: column; gap: 2px; text-align: right; }
.op-num small, .op-res small { font-size: 11px; color: #6b7585; font-weight: 600; }
.op-num b { font-size: 14px; font-weight: 600; color: #e8edf4; font-feature-settings: "tnum" 1; white-space: nowrap; }
.op-res b { font-size: 17px; font-weight: 800; font-feature-settings: "tnum" 1; white-space: nowrap; }
.op.win .op-res b { color: #2ebd85; } .op.loss .op-res b { color: #f6465d; }
.op-src { justify-self: end; display: flex; flex-direction: column; align-items: flex-end; font-size: 12px; font-weight: 600; color: #c3cad5; padding: 5px 10px; border-radius: 7px; background: #141b29; border: 1px solid #222c3e; white-space: nowrap; }
.op-src.is-auto { color: #9fc2ff; border-color: rgba(76,141,255,.35); background: rgba(47,111,237,.1); }
.op-src small { font-size: 10.5px; color: #8b95a7; font-weight: 500; }
.op-st { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font-style: normal; font-size: 13px; font-weight: 900; }
.op.win .op-st { color: #2ebd85; background: rgba(46,189,133,.14); } .op.loss .op-st { color: #f6465d; background: rgba(246,70,93,.14); }
.op-none { padding: 24px 0; text-align: center; }
@media (max-width: 1150px) { .op { grid-template-columns: 54px 1fr 1fr 1fr 30px; } .op-num, .op-src { display: none; } }

/* ======================= v0.48 Comprovante da operação ======================= */
.op[data-k] { cursor: pointer; }
.op[data-k]:focus-visible { outline: 2px solid #4c8dff; outline-offset: 2px; }
.rcpt { position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(3,5,8,.78); backdrop-filter: blur(4px); }
.rcpt[hidden] { display: none; }
.rc-card { position: relative; width: min(500px, 100%); max-height: 100%; overflow-y: auto; padding: 20px 24px 22px; border-radius: 20px; scrollbar-width: none;
  background: radial-gradient(420px 260px at 50% 22%, var(--rc-glow), transparent 70%), linear-gradient(180deg, #111824 0%, #0b0f17 100%);
  border: 1px solid #1f2838; box-shadow: 0 30px 90px rgba(0,0,0,.65); animation: auIn .25s cubic-bezier(.2,.9,.3,1); }
.rc-card.win { --rc-c: #2ebd85; --rc-glow: rgba(46,189,133,.16); } .rc-card.loss { --rc-c: #f6465d; --rc-glow: rgba(246,70,93,.13); }
.rc-head { display: flex; align-items: center; gap: 10px; }
.rc-head .zmark { width: 32px; height: 32px; }
.rc-head > div { display: flex; flex-direction: column; line-height: 1.15; margin-right: auto; }
.rc-head > div b { font-size: 17px; font-weight: 900; font-style: italic; color: #fff; letter-spacing: .02em; }
.rc-head > div small { font-size: 11.5px; color: #8b95a7; }
.rc-acct { font-size: 11.5px; font-weight: 700; padding: 4px 9px; border-radius: 6px; background: #1c2433; color: #c3cad5; }
.rc-acct.demo { background: rgba(255,176,32,.14); color: #ffbf47; } .rc-acct.real { background: rgba(46,189,133,.14); color: #2ebd85; }
.rc-hero { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 22px 0 14px; }
.rc-seal { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--rc-c) 16%, transparent); box-shadow: 0 0 0 6px color-mix(in srgb, var(--rc-c) 6%, transparent); }
.rc-card.win .rc-seal::before { content: "✓"; color: var(--rc-c); font-size: 30px; font-weight: 900; font-style: normal; }
.rc-card.loss .rc-seal::before { content: "✕"; color: var(--rc-c); font-size: 26px; font-weight: 900; font-style: normal; }
.rc-hero span { margin-top: 12px; font-size: 13.5px; font-weight: 600; color: #c3cad5; }
.rc-hero b { margin: 4px 0 8px; font-size: 46px; font-weight: 800; letter-spacing: -.03em; color: var(--rc-c); font-feature-settings: "tnum" 1; text-shadow: 0 0 30px color-mix(in srgb, var(--rc-c) 30%, transparent); }
.rc-hero strong { font-size: 16px; color: #fff; font-weight: 700; }
.rc-hero small { margin-top: 3px; font-size: 13px; color: #8b95a7; font-feature-settings: "tnum" 1; }
#rcCv { display: block; width: 100%; height: 150px; margin: 6px 0 14px; }
.rc-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid #1c2433; border-radius: 12px; overflow: hidden; }
.rc-grid > div { padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid #1c2433; border-bottom: 1px solid #1c2433; }
.rc-grid > div:nth-child(3n) { border-right: 0; }
.rc-grid > div.full { grid-column: 1 / -1; border-right: 0; }
.rc-grid > div:last-child, .rc-grid > div:nth-last-child(-n+3):not(.full) ~ .full { border-bottom: 0; }
.rc-grid small { font-size: 11px; color: #6b7585; font-weight: 600; }
.rc-grid b { font-size: 13.5px; color: #e8edf4; font-weight: 700; font-feature-settings: "tnum" 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rc-act { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.rc-act button { height: 44px; border-radius: 10px; border: 1px solid #263044; background: #0f1420; color: #fff; font: 700 14px inherit; cursor: pointer; }
.rc-act button:hover { background: #141b29; }
.rc-act button.pri { background: #2f6fed; border-color: #2f6fed; } .rc-act button.pri:hover { background: #4280f5; }
.rc-note { margin: 12px 0 0; text-align: center; font-size: 11px; color: #5e6673; }

/* ======================= v0.49 Comprovante: acabamento HD ======================= */
.rc-card { background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .035 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(460px 280px at 50% 18%, var(--rc-glow), transparent 70%),
    linear-gradient(155deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,0) 32%),
    linear-gradient(180deg, #121925 0%, #0a0e15 100%);
  border: 1px solid #222c3d; box-shadow: 0 0 0 1px rgba(0,0,0,.6), 0 40px 100px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.07); }
/* selo em relevo */
.rc-seal { width: 74px; height: 74px; position: relative;
  background: radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--rc-c) 55%, #fff 0%) 0%, color-mix(in srgb, var(--rc-c) 85%, #000) 70%);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--rc-c) 18%, transparent), 0 0 0 11px color-mix(in srgb, var(--rc-c) 7%, transparent),
    0 12px 30px color-mix(in srgb, var(--rc-c) 40%, transparent), inset 0 2px 0 rgba(255,255,255,.35), inset 0 -4px 8px rgba(0,0,0,.25); }
.rc-seal::after { content: ""; position: absolute; left: 14%; right: 14%; top: 7%; height: 42%; border-radius: 50% 50% 45% 45%; background: linear-gradient(180deg, rgba(255,255,255,.4), rgba(255,255,255,0)); }
.rc-card.win .rc-seal::before, .rc-card.loss .rc-seal::before { color: #fff; text-shadow: 0 2px 4px rgba(0,0,0,.3); position: relative; z-index: 1; }
.rc-card.win .rc-seal::before { font-size: 36px; } .rc-card.loss .rc-seal::before { font-size: 30px; }
.rc-hero b { font-size: 50px; background: linear-gradient(180deg, color-mix(in srgb, var(--rc-c) 60%, #fff) 0%, var(--rc-c) 55%, color-mix(in srgb, var(--rc-c) 80%, #000) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 6px 22px color-mix(in srgb, var(--rc-c) 35%, transparent)); }
#rcCv { height: 190px; border-radius: 14px; box-shadow: 0 10px 26px rgba(0,0,0,.35); }
#rcCv[hidden] { display: none; }
/* grade de detalhes com ícones */
.rc-grid { grid-template-columns: 1fr 1fr; gap: 8px; border: 0; overflow: visible; }
.rc-grid > div { flex-direction: row; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #1f2838 !important; border-radius: 11px;
  background: linear-gradient(180deg, #121926 0%, #0e141e 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.rc-grid > div.full { grid-column: 1 / -1; }
.rc-grid i { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: #182131; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px #0a0e15; }
.rc-grid i svg { width: 17px; height: 17px; fill: none; stroke: #9fb0c8; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.rc-grid span { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.rc-grid small { font-size: 11px; color: #7f8aa0; }
.rc-grid b { font-size: 14px; }
.rc-grid > div.hl { border-color: color-mix(in srgb, var(--rc-c) 40%, transparent) !important; background: linear-gradient(180deg, color-mix(in srgb, var(--rc-c) 10%, #121926) 0%, #0e141e 100%); }
.rc-grid > div.hl i { background: color-mix(in srgb, var(--rc-c) 18%, #182131); } .rc-grid > div.hl i svg { stroke: var(--rc-c); } .rc-grid > div.hl b { color: var(--rc-c); }
.rc-act button { height: 48px; border-radius: 12px; }
.rc-act button.pri { background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 55%), #2f6fed; box-shadow: 0 8px 20px -6px rgba(47,111,237,.7), inset 0 1px 0 rgba(255,255,255,.25); }

/* ======================= v0.50 Comprovante: detalhes em formato de recibo destacável ======================= */
.rc-grid { position: relative; display: block; margin-top: 18px; padding: 18px 18px 14px; border-radius: 14px; border: 0; overflow: visible;
  background: linear-gradient(180deg, #121926 0%, #0e141e 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 0 1px #1f2838; }
/* picote: recortes laterais e linha tracejada no topo do recibo */
.rc-grid::before, .rc-grid::after { content: ""; position: absolute; top: -9px; width: 18px; height: 18px; border-radius: 50%; background: #0b0f17; box-shadow: inset 0 0 0 1px #1f2838; }
.rc-grid::before { left: -9px; } .rc-grid::after { right: -9px; }
.rc-grid > div { display: flex !important; flex-direction: row; align-items: center; gap: 10px; padding: 9px 0 !important; border: 0 !important; border-bottom: 1px dashed #263044 !important;
  border-radius: 0; background: none !important; box-shadow: none !important; }
.rc-grid > div:last-child { border-bottom: 0 !important; }
.rc-grid i { width: 26px; height: 26px; border-radius: 7px; background: #182131; box-shadow: none; }
.rc-grid i svg { width: 14px; height: 14px; }
.rc-grid span { flex: 1 1 auto; flex-direction: row; justify-content: space-between; align-items: center; gap: 12px; }
.rc-grid small { font-size: 13px; color: #8b95a7; font-weight: 500; }
.rc-grid b { font-size: 14px; font-weight: 700; color: #f1f4f8; text-align: right; }
.rc-grid > div.hl b { font-size: 16px; }
.rc-grid > div.full b { font-size: 12.5px; font-weight: 600; color: #c3cad5; letter-spacing: .02em; }

/* ======================= v0.51 Comprovante: foto do resultado como destaque ======================= */
.rc-photo { position: relative; margin: 16px 0 0; border-radius: 16px; overflow: hidden; aspect-ratio: 16 / 12.5; box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.06); }
.rc-photo #rcCv { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border-radius: 0; box-shadow: none; display: block; }
.rc-tag { position: absolute; left: 14px; top: 14px; padding: 6px 10px; border-radius: 8px; background: rgba(7,10,15,.62); backdrop-filter: blur(6px); color: #e8edf4; font-size: 12px; font-weight: 700; }
.rc-pl { position: absolute; left: 18px; right: 18px; bottom: 16px; display: flex; flex-direction: column; }
.rc-pl small { font-size: 13px; font-weight: 700; color: #e8edf4; letter-spacing: .01em; }
.rc-pl b { display: flex; align-items: flex-start; gap: 6px; margin: 2px 0 4px; font-size: 54px; font-weight: 800; line-height: 1; letter-spacing: -.035em; color: var(--rc-c); font-feature-settings: "tnum" 1;
  text-shadow: 0 0 28px color-mix(in srgb, var(--rc-c) 45%, transparent); }
.rc-pl b i { font-style: normal; font-size: 20px; letter-spacing: 0; margin-top: 7px; opacity: .95; }
.rc-pl span { font-size: 13px; color: #b8c1ce; } .rc-pl span b { all: unset; color: #fff; font-weight: 700; }
#rcChart { display: block; width: 100%; height: 150px; margin-top: 12px; border-radius: 14px; }
#rcChart[hidden] { display: none; }
.rc-card .rc-hero, .rc-card .rc-seal { display: none; }
/* mesa 3D carregando */
#felt3d.loading { position: relative; }
#felt3d.loading::after { content: "Preparando a mesa…"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 13px; color: #6b7585; background: radial-gradient(closest-side, #0e131b, #05070a); }

/* v0.55 — Sobe × Desce: o aviso de resultado fica no topo, sem cobrir o painel da rodada */
body.g-sd .banner.overlay { bottom: auto; top: 6px; left: auto; right: 14px; transform: none; padding: 8px 14px; }
body.g-sd .banner.overlay { animation: bannerDrop .3s ease-out; }
@keyframes bannerDrop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* v0.58 — histórico: extrato do período (substitui a fileira de números) */
.hs-stats { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 0; padding: 0; background: linear-gradient(180deg, #0d121b, #0a0e15); }
.hs-stats > div { padding: 18px 22px 20px; gap: 0; }
.hs-stats .st-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.hs-stats .st-h small { font-size: 12.5px; color: #c9d1db; font-weight: 700; }
.hs-stats .st-h em { font-style: normal; font-size: 12px; color: #6b7585; }
.hs-stats .st-h em b { font-size: 12px; color: #c9d1db; font-weight: 700; }
.hs-stats .st-h2 { margin: 16px 0 8px; }
.hs-stats .st-amts { display: flex; justify-content: space-between; }
.hs-stats .st-amts b { font-size: 24px; letter-spacing: -.01em; }
.hs-stats b.g { color: #2ebd85; } .hs-stats b.r { color: #f6465d; }
.hs-stats .st-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; margin: 10px 0 8px; background: #151c27; gap: 2px; }
.hs-stats .st-bar i { display: block; height: 100%; min-width: 3px; }
.hs-stats .st-bar i.g { background: linear-gradient(90deg, #1f9d6c, #2ebd85); border-radius: 5px 0 0 5px; }
.hs-stats .st-bar i.r { background: linear-gradient(90deg, #f6465d, #c9303f); border-radius: 0 5px 5px 0; }
.hs-stats .st-sub span { font-size: 12px; color: #6b7585; }
.hs-stats .st-led p { display: flex; justify-content: space-between; align-items: baseline; margin: 0; padding: 7px 0; border-bottom: 1px dashed #1c2433; font-size: 12.5px; color: #8b95a7; }
.hs-stats .st-led p:last-child { border-bottom: 0; }
.hs-stats .st-led p b { font-size: 13.5px; font-weight: 700; color: #e6ebf1; }
.hs-stats .st-ticks { display: flex; gap: 3px; height: 26px; align-items: stretch; }
.hs-stats .st-ticks i { flex: 0 0 8px; border-radius: 2px; }
.hs-stats .st-ticks i.g { background: #2ebd85; } .hs-stats .st-ticks i.r { background: #f6465d; }
.hs-stats .st-none { font-size: 12px; color: #4d5767; align-self: center; }
.hs-stats .st-days { display: flex; gap: 4px; flex-wrap: wrap; }
.hs-stats .st-days i { width: 24px; height: 24px; border-radius: 5px; display: grid; place-items: center; font-style: normal; }
.hs-stats .st-days i span { font-size: 10.5px; font-weight: 700; color: #fff; }
.hs-stats .st-days i.g { background: rgba(46,189,133,.32); box-shadow: inset 0 0 0 1px rgba(46,189,133,.55); }
.hs-stats .st-days i.r { background: rgba(246,70,93,.28); box-shadow: inset 0 0 0 1px rgba(246,70,93,.5); }
@media (max-width: 1100px) { .hs-stats { grid-template-columns: 1fr; } .hs-stats > div + div { border-left: 0; border-top: 1px solid #1c2433; } }
.hs-stats .st-led p b.g { color: #2ebd85; } .hs-stats .st-led p b.r { color: #f6465d; }

/* v0.59 — histórico: barra de filtros estilo terminal */
.hs-bar { display: flex; flex-wrap: nowrap; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 0 22px; min-height: 64px; border-bottom: 1px solid #1c2433; background: linear-gradient(180deg, #0c1018, #0a0d14); }
.hs-bar .hs-per { display: flex; gap: 2px; background: none; border: 0; padding: 0; border-radius: 0; height: auto; align-self: stretch; align-items: stretch; }
.hs-bar .hs-per button { position: relative; height: auto; padding: 0 14px; background: none; border: 0; border-radius: 0; color: #7f8a97; font: 600 13px inherit; letter-spacing: .005em; cursor: pointer; transition: color .15s; box-shadow: none; }
.hs-bar .hs-per button:hover { color: #d6dde6; }
.hs-bar .hs-per button.on { color: #fff; background: none; }
.hs-bar .hs-per button::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 2px; border-radius: 2px 2px 0 0; background: transparent; transition: background .15s; }
.hs-bar .hs-per button.on::after { background: #2f6fed; box-shadow: 0 0 10px rgba(47,111,237,.6); }
.hs-bar .hs-per button[data-p="custom"] { padding-left: 32px; }
.hs-bar .hs-per button[data-p="custom"]::before { content: ""; position: absolute; left: 12px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='3' y='4.5' width='14' height='12' rx='2'/%3E%3Cpath d='M3 8.5h14M7 2.5v4M13 2.5v4'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='3' y='4.5' width='14' height='12' rx='2'/%3E%3Cpath d='M3 8.5h14M7 2.5v4M13 2.5v4'/%3E%3C/svg%3E") center/contain no-repeat; }
.hs-bar .hs-custom { align-self: center; }
.hs-bar .hs-flt { display: flex; align-items: center; gap: 8px; align-self: center; padding: 10px 0; margin-left: auto; }
.hs-fld { position: relative; display: flex; flex-direction: column; justify-content: center; height: 42px; padding: 0 30px 0 12px; border-radius: 9px; background: #0f141d; box-shadow: inset 0 0 0 1px #1f2836, inset 0 1px 0 rgba(255,255,255,.03); cursor: pointer; transition: box-shadow .15s; }
.hs-fld:hover { box-shadow: inset 0 0 0 1px #2c3747, inset 0 1px 0 rgba(255,255,255,.04); }
.hs-fld:focus-within { box-shadow: inset 0 0 0 1px #2f6fed; }
.hs-fld small { font-size: 10.5px; font-weight: 600; color: #5d6676; line-height: 1; margin-bottom: 4px; pointer-events: none; }
.hs-fld .hs-sel { height: auto; padding: 0; border: 0; background: none; color: #e6ebf1; font: 600 13px inherit; -webkit-appearance: none; appearance: none; cursor: pointer; outline: none; line-height: 1.1; }
.hs-fld .hs-sel option { background: #0f141d; color: #e6ebf1; }
.hs-fld::after { content: ""; position: absolute; right: 12px; top: 50%; width: 7px; height: 7px; margin-top: -5px; border-right: 1.6px solid #7f8a97; border-bottom: 1.6px solid #7f8a97; transform: rotate(45deg); pointer-events: none; }
.hs-div { width: 1px; height: 26px; background: #1f2836; margin: 0 4px; }
.hs-bar .hs-csv { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; border-radius: 9px; border: 0; background: #0f141d; color: #d6dde6; font: 600 13px inherit; cursor: pointer; box-shadow: inset 0 0 0 1px #1f2836, inset 0 1px 0 rgba(255,255,255,.03); transition: box-shadow .15s, background .15s; }
.hs-bar .hs-csv:hover { box-shadow: inset 0 0 0 1px #2c3747; background: #121925; }
.hs-bar .hs-csv svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.hs-bar .hs-csv.pri { color: #fff; background: linear-gradient(180deg, #3a7bf5, #2a62d9); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 18px -8px rgba(47,111,237,.8); }
.hs-bar .hs-csv.pri:hover { background: linear-gradient(180deg, #4586ff, #2f6aea); }
@media (max-width: 1280px) { .hs-bar { flex-wrap: wrap; padding-top: 4px; } .hs-bar .hs-per { min-height: 46px; } .hs-bar .hs-flt { margin-left: 0; } }
.hs-bar { flex-wrap: wrap; align-items: stretch; gap: 0; padding: 0 22px; }
.hs-bar .hs-per { flex: 1 1 100%; min-height: 46px; border-bottom: 1px solid #161c26 !important; margin: 0 -22px; padding: 0 12px !important; width: auto; box-shadow: none !important; background: none !important; }
.hs-bar .hs-custom { flex: 1 1 100%; padding: 10px 0 0; }
.hs-bar .hs-flt { flex: 1 1 100%; margin-left: 0; padding: 12px 0 14px; }
.hs-bar .hs-div { margin-left: auto; background: none; }
@media (max-width: 1280px) { .hs-bar { padding-top: 0; } }
.hist .hs-bar { flex: 0 0 auto; }
.hs-bar .hs-custom[hidden] { display: none !important; }

/* v0.60 — histórico: calendário de resultado e "por jogo" */
.hs-cal, .hs-games { background: linear-gradient(180deg, #0d121b, #0a0e15); padding: 0; overflow: hidden; }
.hs-cal-h { flex-wrap: wrap; gap: 14px 22px; margin: 0; padding: 16px 18px 14px; border-bottom: 1px solid #161c26; }
.hs-cal-h button { width: 28px; height: 28px; border: 0; border-radius: 7px; background: transparent; color: #8b95a7; font-size: 20px; }
.hs-cal-h button:hover { background: #151c27; color: #fff; }
.hs-cal-h b { min-width: 132px; font-size: 14.5px; font-weight: 700; }
.hs-cal-h em { display: flex; gap: 26px; margin-left: auto; }
.hs-cal-h em > span { display: flex; flex-direction: column; gap: 3px; text-align: right; }
.hs-cal-h em small { font-size: 10.5px; color: #5d6676; font-weight: 600; }
.hs-cal-h em b { min-width: 0; text-align: right; font-size: 13.5px; font-weight: 700; color: #c9d1db; font-feature-settings: "tnum" 1; white-space: nowrap; }
.hs-cal-h em b.g, .hs-cal-h em i.g { color: #2ebd85; } .hs-cal-h em b.r, .hs-cal-h em i.r { color: #f6465d; }
.hs-cal-h em i { font-style: normal; }
.hs-cal-w { gap: 0; padding: 10px 0 6px; border-bottom: 1px solid #161c26; }
.hs-cal-w span { font-size: 10.5px; font-weight: 600; color: #4d5767; text-transform: none; }
.hs-cal-g { gap: 0; }
.hs-cal-g > * { border-right: 1px solid #141a24; border-bottom: 1px solid #141a24; }
.hs-cal-g > :nth-child(7n) { border-right: 0; }
.hs-cal-g i.pad { background: repeating-linear-gradient(135deg, transparent 0 6px, rgba(255,255,255,.012) 6px 7px); }
.hs-cal-g button { height: 66px; border: 0; border-right: 1px solid #141a24; border-bottom: 1px solid #141a24; border-radius: 0; background: transparent; padding: 8px 10px 10px; transition: background .12s; }
.hs-cal-g button:nth-child(7n) { border-right: 0; }
.hs-cal-g button span { position: absolute; top: 7px; right: 9px; font-size: 11px; font-weight: 600; color: #6b7585; }
.hs-cal-g button.today span { color: #fff; background: #2f6fed; border-radius: 9px; padding: 1px 6px; top: 5px; right: 6px; }
.hs-cal-g button.today { box-shadow: none; }
.hs-cal-g button b { margin-top: auto; font-size: 13px; font-weight: 800; }
.hs-cal-g button.g b { color: #2ebd85; } .hs-cal-g button.r b { color: #f6465d; }
.hs-cal-g button small { font-size: 10.5px; color: #5d6676; margin-top: 1px; }
.hs-cal-g button u { position: absolute; left: 0; bottom: 0; height: 2px; text-decoration: none; }
.hs-cal-g button.g u { background: #2ebd85; box-shadow: 0 0 8px rgba(46,189,133,.6); } .hs-cal-g button.r u { background: #f6465d; box-shadow: 0 0 8px rgba(246,70,93,.6); }
.hs-cal-g button.g { background: linear-gradient(180deg, rgba(46,189,133,0), rgba(46,189,133,.07)); border-color: #141a24; }
.hs-cal-g button.r { background: linear-gradient(180deg, rgba(246,70,93,0), rgba(246,70,93,.07)); border-color: #141a24; }
.hs-cal-g button.fut { opacity: .45; }
.hs-cal-g button:not(.fut):hover { background-color: #111824; filter: none; }
.hs-games .hs-sec { margin: 0; padding: 18px 18px 14px; border-bottom: 1px solid #161c26; font-size: 13px; color: #c9d1db; }
#hsGames { padding: 2px 18px 8px; }
.hs-g { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; }
.hs-gt { flex: 0 0 44px; height: 44px; border-radius: 10px; background: #0f141d; box-shadow: inset 0 0 0 1px #1f2836; display: grid; place-items: center; }
.hs-gt svg { width: 30px; height: 30px; }
.hs-gbody { flex: 1; min-width: 0; }
.hs-gh b { font-size: 13.5px; }
.hs-gs { display: flex; align-items: center; gap: 10px; margin: 8px 0 6px; }
.hs-g .hs-gs i { flex: 1; display: flex; gap: 2px; height: 6px; margin: 0; background: none; }
.hs-g .hs-gs em { height: 100%; border-radius: 0; } .hs-g .hs-gs em.g { border-radius: 3px 0 0 3px; } .hs-g .hs-gs em.r { border-radius: 0 3px 3px 0; }
.hs-gs small { font-size: 11.5px; color: #6b7585; white-space: nowrap; } .hs-gs small b { color: #c9d1db; }
.hs-gn { display: block; font-size: 11.5px; color: #5d6676; }
.hs-cal-h { display: grid; grid-template-columns: auto auto auto 1fr; align-items: center; }
.hs-cal-h em { grid-column: 4; }
.hs-cal-h em small { white-space: nowrap; } .hs-cal-h em { gap: 20px; }

/* ===== v0.61 — lateral viva (contagem por jogo + gráfico do mercado) ===== */
.rail-item.gm { position: relative; }
.ri-live { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: #8b95a7; font-feature-settings: "tnum" 1; }
.ri-live b { font-weight: 700; }
.ri-ring { width: 14px; height: 14px; border-radius: 50%; background: conic-gradient(#3b7cf0 calc(var(--p, 0) * 1%), #1f2836 0); -webkit-mask: radial-gradient(circle, transparent 4px, #000 4.5px); mask: radial-gradient(circle, transparent 4px, #000 4.5px); }
.ri-live.hot { color: #ffd166; } .ri-live.hot .ri-ring { background: conic-gradient(#ffd166 calc(var(--p, 0) * 1%), #1f2836 0); }
.mkt .tk-spark { grid-column: 1 / -1; width: 100%; height: 46px; display: block; color: #3b7cf0; }

/* ---------- Modelo A · "Terminal" ---------- */
body.ui-a .top { background: linear-gradient(180deg, #0c111a, #090c12) !important; border-bottom: 1px solid #1a2230 !important; box-shadow: 0 1px 0 rgba(47,111,237,.12), 0 10px 30px -18px rgba(47,111,237,.5); }
body.ui-a .topnav .tn-item { position: relative; border-radius: 0 !important; background: none !important; box-shadow: none !important; height: var(--top-h); }
body.ui-a .topnav .tn-item.on { color: #fff; }
body.ui-a .topnav .tn-item.on::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px; background: #2f6fed; box-shadow: 0 0 12px #2f6fed; border-radius: 2px 2px 0 0; }
body.ui-a .topnav .tn-item.on svg { color: #5b93ff; }
body.ui-a .balance { position: relative; padding: 6px 14px 6px 40px !important; border-radius: 10px; background: #0f141d !important; box-shadow: inset 0 0 0 1px #1f2836 !important; }
body.ui-a .balance::before { content: ""; position: absolute; left: 12px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: #5b93ff; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 7h14a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a1 1 0 0 1-1-1z'/%3E%3Cpath d='M4 7l11-3v3M15.5 13.5h.01'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 7h14a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a1 1 0 0 1-1-1z'/%3E%3Cpath d='M4 7l11-3v3M15.5 13.5h.01'/%3E%3C/svg%3E") center/contain no-repeat; }
body.ui-a .cash .cash-btn.pri { background: linear-gradient(180deg, #24c38a, #17a372) !important; color: #04140d !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 8px 20px -10px rgba(36,195,138,.9) !important; border: 0 !important; }
body.ui-a .rail { background: linear-gradient(180deg, #0a0e15, #080b10) !important; border-right: 1px solid #161d29 !important; }
body.ui-a .mkt { background: radial-gradient(120% 80% at 0% 0%, rgba(47,111,237,.16), transparent 60%), #0d121b !important; box-shadow: inset 0 0 0 1px #1c2635, 0 12px 30px -20px rgba(47,111,237,.7) !important; }
body.ui-a .rail-item.gm { height: 58px !important; padding: 0 12px 0 10px !important; border-radius: 12px !important; margin: 2px 0; transition: background .15s, box-shadow .15s; }
body.ui-a .rail-item.gm .gm-th { width: 44px !important; height: 38px !important; border-radius: 10px !important; background: #0f141d !important; box-shadow: inset 0 0 0 1px #1f2836 !important; }
body.ui-a .rail-item.gm:hover { background: #0f1520 !important; }
body.ui-a .rail-item.gm.active { background: linear-gradient(90deg, rgba(47,111,237,.22), rgba(47,111,237,.04) 70%) !important; box-shadow: inset 0 0 0 1px rgba(47,111,237,.35) !important; }
body.ui-a .rail-item.gm.active::before { content: ""; position: absolute; left: -12px; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: #2f6fed; box-shadow: 0 0 12px #2f6fed; }
body.ui-a .rail-item.gm.active .gm-th { box-shadow: inset 0 0 0 1px rgba(47,111,237,.6), 0 0 18px -4px rgba(47,111,237,.8) !important; }

/* ---------- Modelo B · "Vitrine" (cada jogo com a sua cor) ---------- */
body.ui-b { --gc-sd: 59,124,240; --gc-pi: 229,72,79; --gc-dg: 255,159,10; --gc-ac: 46,189,133; }
body.ui-b .top { background: #090c12 !important; border-bottom: 0 !important; }
body.ui-b .top::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, #e5484f, #2f6fed 35%, rgba(47,111,237,.15) 70%, transparent); }
body.ui-b .topnav { background: #0f141d; border-radius: 12px; padding: 4px; box-shadow: inset 0 0 0 1px #1c2433; }
body.ui-b .topnav .tn-item { height: 36px !important; border-radius: 9px !important; }
body.ui-b .topnav .tn-item.on { background: linear-gradient(180deg, #1d2a40, #152035) !important; color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px #28406a !important; }
body.ui-b .cash .cash-btn.pri { background: linear-gradient(180deg, #3a7bf5, #2a62d9) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 8px 22px -10px rgba(47,111,237,1) !important; }
body.ui-b .rail { background: #080b10 !important; border-right: 1px solid #141a24 !important; }
body.ui-b .rail-item.gm { --c: var(--gc-sd); height: 72px !important; padding: 0 14px 0 12px !important; margin: 4px 0; border-radius: 14px !important; overflow: hidden;
  background: radial-gradient(120% 140% at 0% 50%, rgba(var(--c), .20), transparent 55%), linear-gradient(180deg, #0f141d, #0c1017) !important; box-shadow: inset 0 0 0 1px rgba(var(--c), .18) !important; }
body.ui-b .rail-item.gm[data-g="pi"] { --c: var(--gc-pi); } body.ui-b .rail-item.gm[data-g="dg"] { --c: var(--gc-dg); } body.ui-b .rail-item.gm[data-g="ac"] { --c: var(--gc-ac); }
body.ui-b .rail-item.gm .gm-th { width: 50px !important; height: 44px !important; background: none !important; box-shadow: none !important; filter: drop-shadow(0 4px 10px rgba(var(--c), .55)); }
body.ui-b .rail-item.gm .ri-tx b { font-size: 14.5px; color: #fff; }
body.ui-b .rail-item.gm:hover { box-shadow: inset 0 0 0 1px rgba(var(--c), .45) !important; }
body.ui-b .rail-item.gm.active { background: radial-gradient(120% 160% at 0% 50%, rgba(var(--c), .38), transparent 60%), linear-gradient(180deg, #121926, #0d121a) !important; box-shadow: inset 0 0 0 1.5px rgba(var(--c), .75), 0 10px 28px -14px rgba(var(--c), .9) !important; }
body.ui-b .rail-item.gm .ri-live { position: absolute; right: 12px; bottom: 9px; font-size: 11px; }
body.ui-b .rail-item.gm .ri-ring { background: conic-gradient(rgb(var(--c)) calc(var(--p, 0) * 1%), #1f2836 0); }
body.ui-b .rail-item.gm::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: calc(var(--pp, 0) * 1%); background: rgb(var(--c)); }
body.ui-b .mkt { background: linear-gradient(180deg, #0f141d, #0b0f16) !important; box-shadow: inset 0 0 0 1px #1c2433 !important; }
body.ui-b .rail-cap { color: #8b95a7; font-weight: 700; }

/* ---------- Modelo C · "Arena" (jogos em blocos) ---------- */
body.ui-c .top { background: linear-gradient(180deg, #0b1020, #090c14) !important; border-bottom: 1px solid #1b2440 !important; }
body.ui-c .brand .wm strong { background: linear-gradient(90deg, #fff, #9cbcff); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.ui-c .topnav .tn-item.on { background: rgba(47,111,237,.14) !important; color: #fff; box-shadow: inset 0 0 0 1px rgba(47,111,237,.45) !important; border-radius: 10px !important; }
body.ui-c .balance { padding: 6px 16px !important; border-radius: 12px; background: linear-gradient(180deg, #121a2e, #0d1322) !important; box-shadow: inset 0 0 0 1px #24345a, 0 0 24px -10px rgba(47,111,237,.8) !important; }
body.ui-c .cash .cash-btn.pri { background: linear-gradient(135deg, #2f6fed, #6a5cff) !important; box-shadow: 0 8px 24px -10px rgba(106,92,255,1) !important; }
body.ui-c .rail { background: linear-gradient(180deg, #0a0f1d, #080b12) !important; border-right: 1px solid #172038 !important; }
body.ui-c .rail .rail-cap ~ .rail-item.gm { display: none; }
body.ui-c .rail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 2px; }
body.ui-c .rail-grid .rail-item.gm { display: flex !important; flex-direction: column; align-items: flex-start; justify-content: space-between; height: 104px !important; padding: 10px !important; border-radius: 14px !important; gap: 0;
  background: linear-gradient(160deg, #131b2e, #0d1220) !important; box-shadow: inset 0 0 0 1px #1d2844 !important; overflow: hidden; }
body.ui-c .rail-grid .rail-item.gm .gm-th { width: 46px !important; height: 34px !important; background: none !important; box-shadow: none !important; }
body.ui-c .rail-grid .rail-item.gm .ri-tx { display: flex; flex-direction: column; }
body.ui-c .rail-grid .rail-item.gm .ri-tx b { font-size: 13px; color: #fff; } body.ui-c .rail-grid .rail-item.gm .ri-tx small { display: none; }
body.ui-c .rail-grid .rail-item.gm .ri-live { position: absolute; top: 10px; right: 10px; margin: 0; font-size: 10.5px; }
body.ui-c .rail-grid .rail-item.gm.active { background: linear-gradient(160deg, #1f3a78, #142450) !important; box-shadow: inset 0 0 0 1.5px #3f7bff, 0 12px 30px -14px rgba(63,123,255,1) !important; }
body.ui-c .rail-grid .rail-item.gm:hover:not(.active) { box-shadow: inset 0 0 0 1px #2d3d66 !important; }
body.ui-c .mkt { background: radial-gradient(140% 90% at 100% 0%, rgba(106,92,255,.18), transparent 60%), #0e1424 !important; box-shadow: inset 0 0 0 1px #1d2844 !important; }
body.ui-c .mkt .tk-spark { color: #7b8cff; }
body.ui-a .rail-item.gm { gap: 9px !important; } body.ui-a .rail-item.gm .gm-th { width: 40px !important; flex: 0 0 40px; }
body.ui-a .ri-live { gap: 4px; font-size: 11px; } body.ui-a .ri-ring { width: 12px; height: 12px; -webkit-mask: radial-gradient(circle, transparent 3.4px, #000 4px); mask: radial-gradient(circle, transparent 3.4px, #000 4px); }
body.ui-a .rail-item.gm .ri-tx { min-width: 0; flex: 1; }
body.ui-b .topnav { height: auto !important; align-self: center; margin-left: 8px; }
body.ui-c .rail-grid .rail-item.gm .ri-live { top: auto; bottom: 12px; right: 10px; }
body.ui-c .rail-grid .rail-item.gm .ri-tx b { max-width: 70px; white-space: normal; line-height: 1.15; }
body.ui-c .rail-grid .rail-item.gm .ri-live { top: 10px; bottom: auto; right: 10px; }
body.ui-c .rail-grid .rail-item.gm .gm-th { width: 40px !important; }
body.ui-c .rail-grid .rail-item.gm .ri-tx b { max-width: none; white-space: nowrap; font-size: 12.5px; }

/* v0.63 — ZUPX Auto e Laboratório saem do topo */
.topnav #openAuto, .topnav #openLab { display: none !important; }

/* v0.64 — Ímpar × Par: faixa de resultados embaixo da mesa */
.pi-tape { display: none; }
.g-pi .pi-tape { display: flex; align-items: center; gap: 18px; position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); z-index: 4; max-width: calc(100% - 40px); padding: 8px 14px 8px 16px; border-radius: 14px;
  background: linear-gradient(180deg, rgba(14,18,26,.92), rgba(8,10,15,.92)); box-shadow: inset 0 0 0 1px #1f2836, inset 0 1px 0 rgba(255,255,255,.04), 0 14px 30px -14px #000; backdrop-filter: blur(6px); pointer-events: none; }
.g-pi .pi-tape:empty { display: none; }
.pt-cap { display: flex; flex-direction: column; gap: 3px; white-space: nowrap; }
.pt-cap b { font-size: 12.5px; color: #e6ebf1; font-weight: 700; }
.pt-cap span { display: flex; align-items: center; gap: 5px; font-size: 11px; color: #8b95a7; font-weight: 600; }
.pt-cap i { width: 7px; height: 7px; border-radius: 2px; margin-left: 4px; } .pt-cap i:first-child { margin-left: 0; }
.pt-cap i.dn { background: #e5484f; } .pt-cap i.up { background: #3b7cf0; }
.pt-cap em { font-style: normal; color: #4d5767; margin-left: 4px; }
.pt-row { display: flex; gap: 6px; overflow: hidden; }
.pt-it { position: relative; flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 7px 5px; border-radius: 10px; background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; }
.pt-it.dn { background: linear-gradient(180deg, rgba(229,72,79,.16), rgba(229,72,79,.04)); box-shadow: inset 0 0 0 1px rgba(229,72,79,.3); }
.pt-it.up { background: linear-gradient(180deg, rgba(59,124,240,.18), rgba(59,124,240,.04)); box-shadow: inset 0 0 0 1px rgba(59,124,240,.32); }
.pt-it.new { box-shadow: inset 0 0 0 1.5px #e6ebf1, 0 0 16px -4px rgba(255,255,255,.35); animation: ptIn .5s ease-out; }
.pt-d { display: flex; gap: 3px; } .pt-d svg { width: 17px; height: 17px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
.pt-it b { font-size: 12px; font-weight: 800; color: #fff; line-height: 1; font-feature-settings: "tnum" 1; }
.pt-it small { position: absolute; top: -6px; right: -5px; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: #0b0f16; box-shadow: inset 0 0 0 1px #2a3342; font-size: 9.5px; font-weight: 700; color: #aab4c2; display: grid; place-items: center; }
@keyframes ptIn { from { transform: translateY(6px) scale(.9); opacity: 0; } to { transform: none; opacity: 1; } }
.g-pi .pi-tape { bottom: 6px; padding: 5px 8px 5px 12px; gap: 12px; border-radius: 11px; }
.pt-cap { flex-direction: row; align-items: center; gap: 10px; }
.pt-cap b { font-size: 12px; }
.pt-row { gap: 5px; }
.pt-it { flex-direction: row; gap: 5px; padding: 4px 7px; border-radius: 8px; }
.pt-d svg { width: 15px; height: 15px; }
.pt-it b { font-size: 12px; min-width: 14px; text-align: center; }
.pt-it small { position: static; min-width: 0; height: auto; padding: 0 0 0 5px; border-radius: 0; background: none; box-shadow: inset 1px 0 0 rgba(255,255,255,.12); font-size: 10.5px; color: #8b95a7; }

/* ===== v0.65 — Carteira ===== */
.wl-btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px 0 12px; border-radius: 9px; border: 0; cursor: pointer; font: 600 13.5px inherit; color: #e6ebf1;
  background: linear-gradient(180deg, #151c28, #0f141d); box-shadow: inset 0 0 0 1px #243042, inset 0 1px 0 rgba(255,255,255,.05); transition: box-shadow .15s, background .15s; }
.wl-btn:hover { background: linear-gradient(180deg, #19212f, #121823); box-shadow: inset 0 0 0 1px #33435c, inset 0 1px 0 rgba(255,255,255,.06); }
.wl-btn svg { width: 18px; height: 18px; fill: none; stroke: #d2b26a; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wl[hidden] { display: none; }
#wallet.wl { position: fixed; inset: 0; z-index: 90; }
.wl-scrim { position: absolute; inset: 0; background: rgba(3,5,8,.55); backdrop-filter: blur(2px); opacity: 0; transition: opacity .2s; }
.wl-pan { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 100%); display: flex; flex-direction: column; background: linear-gradient(180deg, #0d121b, #090c12);
  box-shadow: -1px 0 0 #1c2433, -30px 0 60px -20px rgba(0,0,0,.8); transform: translateX(24px); opacity: 0; transition: transform .22s cubic-bezier(.2,.8,.2,1), opacity .2s; }
.wl.in .wl-scrim { opacity: 1; } .wl.in .wl-pan { transform: none; opacity: 1; }
.wl-h { display: flex; align-items: center; gap: 8px; padding: 18px 20px; border-bottom: 1px solid #161c26; }
.wl-h > div { margin-right: auto; display: flex; flex-direction: column; gap: 2px; } .wl-h b { font-size: 17px; color: #fff; } .wl-h small { font-size: 12px; color: #6b7585; }
.wl-eye, .wl-x { width: 34px; height: 34px; border-radius: 9px; border: 0; background: #111824; color: #aab4c2; cursor: pointer; display: grid; place-items: center; font-size: 20px; box-shadow: inset 0 0 0 1px #1f2836; }
.wl-eye:hover, .wl-x:hover { color: #fff; background: #151d2b; }
.wl-eye svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wl-body { flex: 1; overflow-y: auto; padding: 18px 20px 24px; display: flex; flex-direction: column; gap: 18px; scrollbar-width: thin; }
/* cartão do saldo */
.wl-card { position: relative; overflow: hidden; border-radius: 16px; padding: 18px 20px 16px; color: #fff;
  background: radial-gradient(120% 90% at 100% 0%, rgba(47,111,237,.38), transparent 55%), radial-gradient(90% 80% at 0% 100%, rgba(47,111,237,.14), transparent 60%), linear-gradient(160deg, #15203a, #0c1220 60%, #0a0f1a);
  box-shadow: inset 0 0 0 1px rgba(91,147,255,.28), inset 0 1px 0 rgba(255,255,255,.08), 0 20px 40px -24px rgba(47,111,237,.9); }
.wl-card.k-real { background: radial-gradient(120% 90% at 100% 0%, rgba(210,178,106,.35), transparent 55%), linear-gradient(160deg, #2a2312, #15120b 60%, #0e0c08); box-shadow: inset 0 0 0 1px rgba(210,178,106,.4), inset 0 1px 0 rgba(255,255,255,.08), 0 20px 40px -24px rgba(210,178,106,.8); }
.wl-card.k-treino { background: radial-gradient(120% 90% at 100% 0%, rgba(148,160,180,.22), transparent 55%), linear-gradient(160deg, #1a2029, #10141b 60%, #0c0f14); box-shadow: inset 0 0 0 1px #2a3342, inset 0 1px 0 rgba(255,255,255,.06); }
.wl-card::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, transparent 0 14px, rgba(255,255,255,.018) 14px 15px); pointer-events: none; }
.wc-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; position: relative; z-index: 1; }
.wc-top em { font-style: normal; font-size: 11.5px; font-weight: 700; padding: 4px 9px; border-radius: 20px; }
.t-demo { color: #9cbcff; background: rgba(47,111,237,.18); box-shadow: inset 0 0 0 1px rgba(91,147,255,.35); }
.t-real { color: #f1d690; background: rgba(210,178,106,.16); box-shadow: inset 0 0 0 1px rgba(210,178,106,.45); }
.t-tr { color: #c3cad5; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); }
.wc-id { font-size: 12px; color: rgba(255,255,255,.55); font-weight: 600; letter-spacing: .04em; font-feature-settings: "tnum" 1; }
.wc-lbl { position: relative; z-index: 1; font-size: 12px; color: rgba(255,255,255,.6); }
.wc-bal { position: relative; z-index: 1; display: flex; align-items: baseline; gap: 8px; margin: 2px 0 16px; font-feature-settings: "tnum" 1; }
.wc-bal span { font-size: 18px; font-weight: 600; color: rgba(255,255,255,.7); } .wc-bal b { font-size: 40px; font-weight: 800; letter-spacing: -.02em; line-height: 1; } .wc-bal i { font-style: normal; font-size: 22px; font-weight: 700; color: rgba(255,255,255,.7); margin-left: -6px; }
.wc-row { position: relative; z-index: 1; display: grid; grid-template-columns: 1.25fr 1fr .7fr; gap: 10px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.09); }
.wc-row small { display: block; font-size: 11px; color: rgba(255,255,255,.5); margin-bottom: 3px; } .wc-row b { font-size: 14px; font-weight: 700; font-feature-settings: "tnum" 1; white-space: nowrap; }
.wc-row b.g { color: #3ddc97; } .wc-row b.r { color: #ff6b7a; }
.wc-chip { position: absolute; right: 20px; top: 54px; width: 38px; height: 28px; border-radius: 6px; background: linear-gradient(135deg, #e9cf8f, #9c7c3a); opacity: .55; box-shadow: inset 0 0 0 1px rgba(0,0,0,.25); }
.wc-chip::before { content: ""; position: absolute; inset: 6px 9px; border: 1px solid rgba(0,0,0,.3); border-radius: 3px; }
/* ações */
.wl-act { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.wl-act:has(> :nth-child(2):last-child) { grid-template-columns: 1fr 1fr; }
.wa { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 12px; border-radius: 12px; border: 0; text-decoration: none; cursor: pointer; text-align: left; font: inherit; color: #e6ebf1;
  background: #0f141d; box-shadow: inset 0 0 0 1px #1f2836, inset 0 1px 0 rgba(255,255,255,.03); transition: box-shadow .15s, background .15s; }
.wa:hover { background: #121925; box-shadow: inset 0 0 0 1px #2c3747; }
.wa svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; padding: 7px; box-sizing: content-box; border-radius: 9px; background: #161e2b; }
.wa span { display: flex; flex-direction: column; gap: 1px; } .wa b { font-size: 13.5px; } .wa small { font-size: 11px; color: #6b7585; }
.wa-dep { color: #fff; background: linear-gradient(180deg, #1fb57f, #14915f); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 10px 22px -12px rgba(36,195,138,.9); }
.wa-dep:hover { background: linear-gradient(180deg, #23c48a, #179b66); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 10px 22px -12px rgba(36,195,138,1); }
.wa-dep svg { background: rgba(0,0,0,.18); } .wa-dep small { color: rgba(255,255,255,.75); }
/* contas e movimentações */
.wl-st { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; } .wl-st b { font-size: 13.5px; color: #e6ebf1; } .wl-st small { font-size: 11.5px; color: #5d6676; }
.wl-lnk { border: 0; background: none; color: #5b93ff; font: 600 12px inherit; cursor: pointer; padding: 0; } .wl-lnk:hover { color: #8fb4ff; }
.wl-acc { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin-bottom: 6px; border-radius: 11px; border: 0; cursor: pointer; font: inherit; text-align: left; color: #e6ebf1;
  background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; }
.wl-acc:hover { box-shadow: inset 0 0 0 1px #2c3747; } .wl-acc.on { background: #111a2a; box-shadow: inset 0 0 0 1.5px #2f6fed; cursor: default; }
.wa-ic { flex: 0 0 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.wa-ic.treino { background: #1a202a; color: #c3cad5; } .wa-ic.demo { background: rgba(47,111,237,.18); color: #9cbcff; } .wa-ic.real { background: rgba(210,178,106,.18); color: #f1d690; }
.wa-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; } .wa-tx b { font-size: 13.5px; } .wa-tx small { font-size: 11.5px; color: #6b7585; }
.wa-bl { display: flex; flex-direction: column; align-items: flex-end; font-size: 13.5px; font-weight: 700; font-feature-settings: "tnum" 1; white-space: nowrap; }
.wa-bl em { font-style: normal; font-size: 10.5px; font-weight: 700; color: #5b93ff; }
.wl-mday { font-size: 11px; font-weight: 700; color: #5d6676; padding: 10px 0 4px; }
.wl-mv { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #131a24; }
.wl-mic { flex: 0 0 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; }
.wl-mic svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.wl-mv.g .wl-mic { background: rgba(46,189,133,.14); color: #2ebd85; } .wl-mv.r .wl-mic { background: rgba(246,70,93,.12); color: #f6465d; }
.wl-mtx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; } .wl-mtx b { font-size: 13px; font-weight: 600; color: #e6ebf1; } .wl-mtx small { font-size: 11px; color: #5d6676; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-mval { font-size: 13.5px; font-weight: 700; font-feature-settings: "tnum" 1; white-space: nowrap; } .wl-mv.g .wl-mval { color: #2ebd85; } .wl-mv.r .wl-mval { color: #f6465d; }
.wl-none { font-size: 12.5px; color: #5d6676; padding: 10px 0; }
.wl-note { font-size: 11px; line-height: 1.5; color: #4d5767; margin: 0; padding-top: 12px; border-top: 1px solid #141a24; }
.wl-body > * { flex-shrink: 0; }

/* ===== v0.66 — Carteira: cartão de metal ===== */
.wl-pan { background: radial-gradient(120% 50% at 100% 0%, rgba(47,111,237,.10), transparent 60%), linear-gradient(180deg, #0c1119, #080b10); }
.wl-body { gap: 16px; padding-top: 22px; }
.wl-card { perspective: 900px; padding: 0 !important; background: none !important; box-shadow: none !important; overflow: visible; border-radius: 18px; }
.wl-card::after { display: none; }
.wc-face { --c1: #1b2a4a; --c2: #0c1428; --c3: #24407a; --edge: rgba(150,185,255,.35); --ink: #eaf1ff;
  position: relative; aspect-ratio: 1.586; border-radius: 18px; padding: 20px 22px; overflow: hidden; color: var(--ink);
  display: grid; grid-template-rows: auto auto 1fr auto; transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .25s ease-out; transform-style: preserve-3d;
  background:
    radial-gradient(140% 100% at 110% -10%, var(--c3), transparent 55%),
    radial-gradient(90% 90% at -10% 120%, rgba(0,0,0,.55), transparent 60%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.022) 0 1px, transparent 1px 3px),
    linear-gradient(135deg, var(--c1), var(--c2));
  box-shadow: inset 0 0 0 1px var(--edge), inset 0 1px 0 rgba(255,255,255,.25), inset 0 -1px 0 rgba(0,0,0,.5), 0 24px 40px -18px rgba(0,0,0,.9), 0 30px 60px -30px var(--glow, rgba(47,111,237,.75)); }
.wc-face::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.wc-sheen { position: absolute; inset: -40%; pointer-events: none; background: radial-gradient(28% 22% at var(--mx, 30%) var(--my, 20%), rgba(255,255,255,.22), transparent 70%), linear-gradient(115deg, transparent 38%, rgba(255,255,255,.09) 46%, rgba(255,255,255,.02) 52%, transparent 60%); transition: background-position .2s; }
.wl-card.k-real .wc-face { --c1: #2b2416; --c2: #0e0b07; --c3: #8a6a2a; --edge: rgba(233,207,143,.45); --ink: #fbf1d6; --glow: rgba(210,178,106,.55); }
.wl-card.k-treino .wc-face { --c1: #262c35; --c2: #0e1116; --c3: #4a5466; --edge: rgba(200,210,225,.25); --ink: #eef2f7; --glow: rgba(120,135,160,.45); }
.wc-r1 { position: relative; display: flex; justify-content: space-between; align-items: center; }
.wc-logo { display: inline-flex; align-items: center; gap: 7px; }
.wc-logo i { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; font-style: italic; font-weight: 900; font-size: 14px; color: #fff; background: linear-gradient(135deg, #e5484f 0 50%, #2f6fed 50%); box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 2px 6px rgba(0,0,0,.5); }
.wc-logo b { font-style: italic; font-weight: 900; font-size: 17px; letter-spacing: .02em; text-shadow: 0 1px 0 rgba(0,0,0,.5); }
.wc-r1 em { font-size: 11px !important; padding: 4px 10px !important; backdrop-filter: blur(4px); }
.wc-r2 { position: relative; display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.wc-chipsvg { width: 44px; height: 33px; filter: drop-shadow(0 2px 2px rgba(0,0,0,.5)); }
.wc-nfc { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; opacity: .55; }
.wc-bl { position: relative; align-self: end; }
.wc-bl small { display: block; font-size: 11.5px; color: color-mix(in srgb, var(--ink) 60%, transparent); margin-bottom: 2px; }
.wc-bal { margin: 0 !important; text-shadow: 0 2px 6px rgba(0,0,0,.45); }
.wc-bal b { font-size: 38px !important; background: linear-gradient(180deg, #fff 30%, color-mix(in srgb, var(--ink) 70%, #8a96aa)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wc-r4 { position: relative; display: flex; justify-content: space-between; align-items: flex-end; margin-top: 12px; }
.wc-num { font-family: "Consolas", "SFMono-Regular", ui-monospace, monospace; font-size: 14.5px; letter-spacing: .14em; color: color-mix(in srgb, var(--ink) 85%, transparent); text-shadow: 0 1px 0 rgba(0,0,0,.6), 0 -1px 0 rgba(255,255,255,.12); }
.wc-hold { display: flex; flex-direction: column; align-items: flex-end; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: color-mix(in srgb, var(--ink) 80%, transparent); }
.wc-hold small { font-size: 9px; font-weight: 600; letter-spacing: .1em; opacity: .55; text-transform: uppercase; }
/* hoje */
.wl-today { border-radius: 14px; padding: 14px 16px 12px; background: linear-gradient(180deg, #0f141d, #0b0f16); box-shadow: inset 0 0 0 1px #1c2433, inset 0 1px 0 rgba(255,255,255,.03); }
.wt-h { display: flex; justify-content: space-between; align-items: baseline; } .wt-h small { font-size: 12px; color: #8b95a7; font-weight: 600; } .wt-h span { font-size: 11.5px; color: #5d6676; }
.wt-v { font-size: 24px; font-weight: 800; color: #e6ebf1; margin-top: 2px; font-feature-settings: "tnum" 1; } .wt-v.g { color: #2ebd85; } .wt-v.r { color: #f6465d; }
.wt-cv { display: block; width: 100%; height: 64px; margin: 8px 0 10px; }
.wt-s { display: grid; grid-template-columns: .8fr 1.1fr 1.1fr; gap: 8px; padding-top: 10px; border-top: 1px solid #161d29; }
.wt-s small { display: block; font-size: 10.5px; color: #5d6676; margin-bottom: 2px; } .wt-s b { font-size: 13px; font-weight: 700; color: #e6ebf1; white-space: nowrap; font-feature-settings: "tnum" 1; }
.wt-s i { font-style: normal; } .wt-s i.g { color: #2ebd85; } .wt-s i.r { color: #f6465d; }
/* ações */
.wl-act { grid-template-columns: 1fr !important; gap: 8px; }
.wa { flex-direction: row !important; align-items: center !important; gap: 12px !important; padding: 12px 14px !important; border-radius: 13px !important; }
.wa-i { flex: 0 0 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: #161e2b; box-shadow: inset 0 0 0 1px #243042; }
.wa-i svg { width: 19px !important; height: 19px !important; padding: 0 !important; background: none !important; }
.wa-t { flex: 1; } .wa-t b { font-size: 14px; } .wa-t small { font-size: 11.5px; }
.wa-go { width: 18px !important; height: 18px !important; padding: 0 !important; background: none !important; opacity: .55; }
.wa-dep { background: linear-gradient(180deg, #22c088, #129a64) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.28), inset 0 -1px 0 rgba(0,0,0,.2), 0 12px 26px -12px rgba(36,195,138,.95) !important; }
.wa-dep .wa-i { background: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.25); } .wa-dep .wa-go { opacity: .9; }
.wa-wd { background: linear-gradient(180deg, #141b27, #0f141d) !important; }
.wl-card .wc-r1 em { font-style: normal !important; border-radius: 20px !important; border: 0 !important; font-weight: 700 !important; }
.wl .wa .wa-i { display: flex !important; align-items: center; justify-content: center; line-height: 0; padding: 0; } .wl .wa .wa-i svg { display: block !important; width: 20px !important; height: 20px !important; margin: 0 !important; padding: 0 !important; border-radius: 0 !important; box-sizing: border-box !important; flex: 0 0 auto; }

/* v0.67 — Carteira: botões Depositar / Sacar em "moeda" de metal */
.wl .wl-act { grid-template-columns: 1fr 1fr !important; gap: 10px; }
.wl .wa { flex-direction: column !important; align-items: center !important; justify-content: center; gap: 10px !important; padding: 18px 12px 14px !important; border-radius: 16px !important; text-align: center;
  background: linear-gradient(180deg, #121823, #0c1017) !important; box-shadow: inset 0 0 0 1px #1e2633, inset 0 1px 0 rgba(255,255,255,.05), 0 10px 24px -16px #000 !important; transition: transform .15s, box-shadow .2s, background .2s; }
.wl .wa:hover { transform: translateY(-2px); background: linear-gradient(180deg, #151c29, #0e131b) !important; box-shadow: inset 0 0 0 1px #2a3546, inset 0 1px 0 rgba(255,255,255,.07), 0 16px 30px -16px #000 !important; }
.wl .wa:active { transform: translateY(0) scale(.98); }
.wl .wa-go { display: none; }
.wl .wa-t { flex: 0 0 auto; align-items: center; } .wl .wa-t b { font-size: 14.5px; letter-spacing: .01em; } .wl .wa-t small { font-size: 11px; color: #6b7585; }
.wl .wa .wa-i { position: relative; width: 58px; height: 58px; flex: 0 0 58px; border-radius: 50% !important;
  background: radial-gradient(circle at 50% 30%, #4a5568 0%, #232a36 55%, #151a22 100%) !important;
  box-shadow: 0 0 0 2px #0b0e13, 0 0 0 3.5px rgba(255,255,255,.08), inset 0 2px 1px rgba(255,255,255,.22), inset 0 -3px 6px rgba(0,0,0,.6), 0 8px 16px -6px rgba(0,0,0,.9) !important; }
.wl .wa .wa-i::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: conic-gradient(from 210deg, rgba(255,255,255,.18), rgba(255,255,255,0) 25%, rgba(255,255,255,.12) 50%, rgba(255,255,255,0) 75%, rgba(255,255,255,.18)); -webkit-mask: radial-gradient(circle, transparent 62%, #000 64%); mask: radial-gradient(circle, transparent 62%, #000 64%); }
.wl .wa .wa-i svg { width: 22px !important; height: 22px !important; stroke: #fff; stroke-width: 2 !important; filter: drop-shadow(0 1px 1px rgba(0,0,0,.7)); position: relative; }
.wl .wa-dep { background: radial-gradient(120% 90% at 50% 0%, rgba(36,195,138,.22), transparent 60%), linear-gradient(180deg, #10201b, #0b1512) !important; box-shadow: inset 0 0 0 1px rgba(36,195,138,.38), inset 0 1px 0 rgba(255,255,255,.07), 0 14px 30px -18px rgba(36,195,138,.8) !important; }
.wl .wa-dep:hover { background: radial-gradient(120% 90% at 50% 0%, rgba(36,195,138,.32), transparent 60%), linear-gradient(180deg, #12251f, #0c1814) !important; box-shadow: inset 0 0 0 1px rgba(36,195,138,.6), inset 0 1px 0 rgba(255,255,255,.08), 0 18px 34px -16px rgba(36,195,138,.9) !important; }
.wl .wa-dep .wa-i { background: radial-gradient(circle at 50% 28%, #6ff0bf 0%, #22c088 40%, #0d7a52 100%) !important;
  box-shadow: 0 0 0 2px #06120e, 0 0 0 3.5px rgba(111,240,191,.25), inset 0 2px 1px rgba(255,255,255,.45), inset 0 -4px 7px rgba(0,60,35,.7), 0 10px 20px -6px rgba(36,195,138,.85) !important; }
.wl .wa-dep .wa-t b { color: #fff; } .wl .wa-dep .wa-t small { color: rgba(170,240,210,.7); }

/* v0.68 — cartão exclusivo de PARCEIRO (demo/treino): platina e preto fosco, nunca dourado */
.wl-card.k-pt .wc-face { --c1: #2b2f36; --c2: #08090b; --c3: #b9c2cd; --edge: rgba(226,232,240,.5); --ink: #f4f6f9; --glow: rgba(190,200,215,.35);
  background:
    radial-gradient(120% 90% at 110% -10%, rgba(214,222,232,.42), transparent 50%),
    radial-gradient(70% 60% at -5% 105%, rgba(0,0,0,.7), transparent 60%),
    linear-gradient(115deg, transparent 0 58%, rgba(255,255,255,.05) 58% 59%, transparent 59% 63%, rgba(255,255,255,.035) 63% 64%, transparent 64%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 2px),
    linear-gradient(135deg, var(--c1) 0%, #15171b 45%, var(--c2) 100%); }
.wl-card.k-pt .wc-bal b { background: linear-gradient(180deg, #ffffff 25%, #c9d1db 60%, #8d97a5); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wl-card.k-pt .wc-logo b { background: linear-gradient(180deg, #fff, #b9c2cd); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; }
.t-pt { display: inline-flex; align-items: center; gap: 5px; color: #11141a !important; background: linear-gradient(180deg, #f3f6fa, #b9c2cd) !important; box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(0,0,0,.2), 0 2px 8px rgba(0,0,0,.4) !important; letter-spacing: .04em; text-transform: uppercase; font-size: 10.5px !important; }
.t-pt svg { width: 11px; height: 11px; fill: #11141a; }
.wc-holo { margin-left: auto; width: 34px; height: 24px; border-radius: 5px; opacity: .85;
  background: conic-gradient(from 0deg at 50% 50%, #9be7ff, #c9a7ff, #ffb3d9, #ffe6a3, #b5ffd1, #9be7ff); filter: saturate(.7) brightness(.95);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.4), 0 1px 3px rgba(0,0,0,.5); position: relative; overflow: hidden; }
.wc-holo::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(45deg, rgba(255,255,255,.35) 0 2px, transparent 2px 5px); mix-blend-mode: overlay; }
.wl-card.k-pt .wc-face { box-shadow: inset 0 0 0 1px var(--edge), inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(0,0,0,.6), 0 24px 40px -18px rgba(0,0,0,.95), 0 30px 60px -30px var(--glow); }
.wc-hold { cursor: text; }
.wc-nm { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wc-in { width: 180px; text-align: right; font: 700 11px inherit; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: rgba(0,0,0,.35); border: 0; border-radius: 4px; padding: 2px 6px; outline: 1px solid rgba(255,255,255,.35); }

/* ===== v0.70 — Mídia ===== */
.md .lab-win { width: min(1320px, 100%); height: min(940px, 100%); background: linear-gradient(180deg, #0d121b, #090c12); border-color: #1c2433; }
.md-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: 220px minmax(0, 1fr) 340px; }
.md-nav { display: flex; flex-direction: column; gap: 4px; padding: 16px 12px; border-right: 1px solid #161c26; }
.md-nav button { display: flex; align-items: center; gap: 11px; height: 42px; padding: 0 12px; border: 0; border-radius: 10px; background: none; color: #8b95a7; font: 600 13.5px inherit; cursor: pointer; text-align: left; }
.md-nav button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.md-nav button:hover { background: #111824; color: #e6ebf1; }
.md-nav button.on { background: linear-gradient(90deg, rgba(47,111,237,.2), rgba(47,111,237,.04)); color: #fff; box-shadow: inset 2px 0 0 #2f6fed; }
.md-nav button.on svg { color: #5b93ff; }
.md-note { margin-top: auto; padding: 12px; border-radius: 10px; background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; display: flex; flex-direction: column; gap: 4px; }
.md-note b { font-size: 12px; color: #d2b26a; } .md-note span { font-size: 11.5px; line-height: 1.45; color: #6b7585; }
.md-feed { overflow-y: auto; padding: 18px 26px 30px; display: flex; flex-direction: column; gap: 14px; scrollbar-width: thin; }
.md-av { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font: 800 13.5px inherit; color: #fff; background: linear-gradient(135deg, #2f6fed, #6a5cff); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 0 0 2px #0b0e13, 0 0 0 3px #243042; }
.md-av.s { flex-basis: 28px; width: 28px; height: 28px; font-size: 10.5px; }
.md-av.off { background: #0d1015; }
.md-av.off i { width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; font-style: italic; font-weight: 900; font-size: 15px; background: linear-gradient(135deg, #e5484f 0 50%, #2f6fed 50%); }
.md-comp { display: flex; gap: 12px; padding: 14px 16px; border-radius: 14px; background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; }
.md-cb { flex: 1; display: flex; flex-direction: column; gap: 10px; }
.md-cb textarea { resize: none; border: 0; outline: 0; background: none; color: #e6ebf1; font: 400 14px/1.45 inherit; padding: 9px 0 0; }
.md-cb textarea::placeholder { color: #5d6676; }
.md-cf { display: flex; align-items: center; gap: 10px; padding-top: 10px; border-top: 1px solid #1a212c; }
.md-att { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #aab4c2; cursor: pointer; }
.md-att input { accent-color: #2f6fed; } .md-att em { font-style: normal; color: #5d6676; } .md-att.off { color: #4d5767; cursor: default; }
.md-pub { margin-left: auto; height: 36px; padding: 0 18px; border: 0; border-radius: 9px; cursor: pointer; font: 700 13px inherit; color: #fff; background: linear-gradient(180deg, #3a7bf5, #2a62d9); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 16px -8px rgba(47,111,237,.9); }
.md-post { border-radius: 14px; background: linear-gradient(180deg, #0f141d, #0c1017); box-shadow: inset 0 0 0 1px #1c2433, inset 0 1px 0 rgba(255,255,255,.03); padding: 16px 18px 6px; }
.md-post header { display: flex; align-items: center; gap: 12px; }
.md-who { display: flex; flex-direction: column; } .md-who b { font-size: 14px; color: #fff; display: inline-flex; align-items: center; } .md-who small { font-size: 11.5px; color: #5d6676; }
.md-who { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: 5px; } .md-who small { flex-basis: 100%; }
.md-vf { width: 16px; height: 16px; fill: #2f6fed; }
.md-post p { margin: 12px 0 0; font-size: 14px; line-height: 1.55; color: #c9d1db; white-space: pre-wrap; }
.md-ban { margin-top: 14px; height: 168px; border-radius: 12px; position: relative; overflow: hidden; display: flex; align-items: flex-end; gap: 16px; padding: 18px 20px;
  background: radial-gradient(90% 120% at 100% 0%, rgba(var(--bc), .45), transparent 60%), linear-gradient(135deg, #131b2a, #0a0e15); box-shadow: inset 0 0 0 1px rgba(var(--bc), .3); --bc: 59,124,240; }
.md-ban.g-pi { --bc: 229,72,79; } .md-ban.g-dg { --bc: 255,159,10; } .md-ban.g-ac { --bc: 46,189,133; }
.md-ban::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, transparent 0 22px, rgba(255,255,255,.025) 22px 23px); }
.md-bth { position: relative; width: 74px; height: 56px; display: grid; place-items: center; border-radius: 14px; background: rgba(0,0,0,.35); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.md-bth svg { width: 56px; height: 42px; filter: drop-shadow(0 6px 12px rgba(var(--bc), .6)); }
.md-btx { position: relative; display: flex; flex-direction: column; gap: 6px; }
.md-btx em { align-self: flex-start; font-style: normal; font-size: 11px; font-weight: 700; color: #fff; padding: 3px 9px; border-radius: 20px; background: rgba(var(--bc), .35); box-shadow: inset 0 0 0 1px rgba(var(--bc), .6); }
.md-btx b { font-size: 22px; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.md-rc { margin-top: 12px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: #0b0f16; box-shadow: inset 0 0 0 1px #1f2836; }
.md-rc.w { box-shadow: inset 0 0 0 1px rgba(46,189,133,.4); background: linear-gradient(90deg, rgba(46,189,133,.08), #0b0f16 60%); }
.md-rc.l { box-shadow: inset 0 0 0 1px rgba(246,70,93,.35); background: linear-gradient(90deg, rgba(246,70,93,.07), #0b0f16 60%); }
.md-rth svg { width: 40px; height: 30px; display: block; } .md-rtx { flex: 1; display: flex; flex-direction: column; } .md-rtx b { font-size: 13.5px; color: #fff; } .md-rtx small { font-size: 11.5px; color: #6b7585; }
.md-rv { display: flex; flex-direction: column; align-items: flex-end; } .md-rv small { font-size: 10.5px; color: #6b7585; } .md-rv b { font-size: 16px; font-weight: 800; font-feature-settings: "tnum" 1; }
.md-rc.w .md-rv b { color: #2ebd85; } .md-rc.l .md-rv b { color: #f6465d; }
.md-post footer { display: flex; gap: 4px; margin-top: 12px; padding-top: 6px; border-top: 1px solid #161d29; }
.md-post footer button { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px; border: 0; border-radius: 8px; background: none; color: #8b95a7; font: 600 12.5px inherit; cursor: pointer; }
.md-post footer button:hover { background: #121925; color: #e6ebf1; }
.md-post footer svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.md-like.on { color: #ff6b7a !important; } .md-like.on svg { fill: #ff6b7a; stroke: #ff6b7a; }
.md-del { margin-left: auto; color: #5d6676 !important; }
.md-empty { padding: 40px 20px; text-align: center; border-radius: 14px; border: 1px dashed #222b38; display: flex; flex-direction: column; gap: 6px; } .md-empty b { color: #e6ebf1; font-size: 14px; } .md-empty span { color: #6b7585; font-size: 12.5px; }
.md-side { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-left: 1px solid #161c26; min-height: 0; }
.md-box { border-radius: 14px; background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; display: flex; flex-direction: column; min-height: 0; }
.md-live { flex: 0 0 46%; } .md-chat { flex: 1; }
.md-bh { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 14px 10px; border-bottom: 1px solid #161d29; } .md-bh b { font-size: 13px; color: #e6ebf1; display: inline-flex; align-items: center; gap: 7px; } .md-bh small { font-size: 11px; color: #5d6676; }
.md-dot { width: 7px; height: 7px; border-radius: 50%; background: #2ebd85; box-shadow: 0 0 0 0 rgba(46,189,133,.6); animation: mdPulse 1.6s infinite; }
@keyframes mdPulse { 70% { box-shadow: 0 0 0 7px rgba(46,189,133,0); } 100% { box-shadow: 0 0 0 0 rgba(46,189,133,0); } }
#mdLive { overflow-y: auto; padding: 4px 10px 8px; scrollbar-width: thin; }
.md-li { display: flex; align-items: center; gap: 10px; padding: 7px 4px; border-bottom: 1px solid #131a24; }
.md-lth svg { width: 32px; height: 24px; display: block; } .md-ltx { flex: 1; min-width: 0; display: flex; flex-direction: column; } .md-ltx b { font-size: 12.5px; color: #d6dde6; } .md-ltx small { font-size: 10.5px; color: #5d6676; }
.md-lr { font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 6px; white-space: nowrap; } .md-lr.up { color: #7fa9ff; background: rgba(59,124,240,.14); } .md-lr.dn { color: #ff7a80; background: rgba(229,72,79,.14); }
.md-lr i { font-style: normal; opacity: .7; margin-left: 2px; }
.md-li.me { background: linear-gradient(90deg, rgba(210,178,106,.08), transparent); border-radius: 8px; } .md-li.me .md-ltx b { color: #f1d690; }
.md-lv { font-size: 12.5px; font-feature-settings: "tnum" 1; } .md-li.w .md-lv { color: #2ebd85; } .md-li.l .md-lv { color: #f6465d; }
.md-msgs { flex: 1; overflow-y: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; scrollbar-width: thin; }
.md-sys { font-size: 11.5px; line-height: 1.45; color: #6b7585; padding: 8px 10px; border-radius: 8px; background: #0b0f16; box-shadow: inset 0 0 0 1px #1a212c; }
.md-msg { display: flex; gap: 9px; } .md-msg b { font-size: 12.5px; color: #e6ebf1; margin-right: 6px; } .md-msg small { font-size: 10.5px; color: #5d6676; } .md-msg p { margin: 2px 0 0; font-size: 13px; color: #c9d1db; line-height: 1.4; word-break: break-word; }
.md-in { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #161d29; }
.md-in input { flex: 1; height: 38px; border: 0; border-radius: 9px; padding: 0 12px; background: #0b0f16; color: #e6ebf1; font: 400 13px inherit; box-shadow: inset 0 0 0 1px #1f2836; outline: 0; }
.md-in input:focus { box-shadow: inset 0 0 0 1px #2f6fed; }
.md-in button { width: 38px; height: 38px; border: 0; border-radius: 9px; cursor: pointer; background: linear-gradient(180deg, #3a7bf5, #2a62d9); display: grid; place-items: center; }
.md-in button svg { width: 17px; height: 17px; fill: #fff; }
.md-none { font-size: 12px; color: #5d6676; padding: 10px 4px; }
@media (max-width: 1100px) { .md-grid { grid-template-columns: 1fr; } .md-nav { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid #161c26; } .md-note, .md-side { display: none; } }
.md-cb textarea, .md-in input { font-family: inherit !important; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important; }

/* ===== v0.71 — Mídia estilo rede social de verdade ===== */
.md .lab-win { background: #07090d; }
.md-grid { grid-template-columns: 240px minmax(0, 1fr) 360px; }
.md-nav { padding: 14px 14px; gap: 2px; }
.md-nav button { height: 48px; padding: 0 14px; border-radius: 24px; font-size: 15.5px; font-weight: 600; color: #c9d1db; gap: 16px; }
.md-nav button svg { width: 23px; height: 23px; }
.md-nav button.on { background: none; box-shadow: none; color: #fff; font-weight: 800; }
.md-nav button.on svg { color: #fff; stroke-width: 2.2; }
.md-nav button:hover { background: #12161d; }
.md-feed { padding: 0; gap: 0; border-right: 1px solid #1a1f27; align-items: stretch; }
.md-feed > * { width: 100%; max-width: 680px; margin: 0 auto; }
/* destaques */
.md-st { display: flex; gap: 18px; padding: 18px 20px 16px; border-bottom: 1px solid #1a1f27; overflow-x: auto; scrollbar-width: none; }
.md-s { display: flex; flex-direction: column; align-items: center; gap: 7px; text-decoration: none; cursor: pointer; flex: 0 0 auto; width: 72px; }
.md-sr { width: 68px; height: 68px; border-radius: 50%; padding: 2.5px; background: conic-gradient(from 210deg, #e5484f, #ff9f0a, #2f6fed, #6a5cff, #e5484f); display: block; transition: transform .15s; }
.md-s:hover .md-sr { transform: scale(1.05); }
.md-si { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, #1a2130, #0b0e14); box-shadow: 0 0 0 3px #07090d; overflow: hidden; }
.md-si svg { width: 40px; height: 30px; }
.md-sz i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-style: italic; font-weight: 900; font-size: 19px; color: #fff; background: linear-gradient(135deg, #e5484f 0 50%, #2f6fed 50%); }
.md-s small { font-size: 11.5px; color: #c9d1db; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 72px; }
/* composer */
.md-comp { border-radius: 0; background: none; box-shadow: none; border-bottom: 1px solid #1a1f27; padding: 16px 20px 12px; }
.md-cb textarea { font-size: 18px !important; padding-top: 8px; }
.md-cf { border-top-color: #1a1f27; }
.md-pub { border-radius: 20px; padding: 0 20px; background: #f2f5f9; color: #07090d; box-shadow: none; font-weight: 800; }
.md-pub:hover { background: #fff; }
/* post */
.md-post { display: flex; gap: 12px; border-radius: 0; background: none; box-shadow: none; padding: 14px 20px 6px; border-bottom: 1px solid #1a1f27; transition: background .15s; }
.md-post:hover { background: rgba(255,255,255,.012); }
.md-pa .md-av { width: 44px; height: 44px; }
.md-pb { flex: 1; min-width: 0; }
.md-ph { display: flex; align-items: center; gap: 5px; flex-wrap: nowrap; }
.md-ph b { font-size: 15px; color: #fff; font-weight: 800; }
.md-ph > span { font-size: 14px; color: #6b7585; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md-vf { width: 17px; height: 17px; fill: #2f6fed; flex: 0 0 auto; }
.md-pt { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; color: #aab4c2; padding: 2px 9px; border-radius: 20px; box-shadow: inset 0 0 0 1px #2a3240; }
.md-post p { margin: 4px 0 0; font-size: 15px; line-height: 1.5; color: #e6ebf1; }
.md-post p strong { color: #fff; }
.md-img { margin: 12px 0 0; border-radius: 16px; overflow: hidden; border: 1px solid #222a35; background: #05070a; aspect-ratio: 16 / 9; }
.md-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.md-img.card { aspect-ratio: auto; display: grid; place-items: center; padding: 34px 0; background: radial-gradient(70% 90% at 50% 0%, rgba(190,200,215,.12), transparent 70%), #07090d; }
.md-img.card img { width: 70%; height: auto; object-fit: contain; border-radius: 14px; filter: drop-shadow(0 24px 30px rgba(0,0,0,.8)); }
.md-post footer { display: flex; justify-content: space-between; max-width: 440px; border-top: 0; margin-top: 8px; padding-top: 0; }
.md-post footer button { height: 36px; padding: 0 8px; border-radius: 18px; color: #6b7585; gap: 6px; font-size: 13px; }
.md-post footer button svg { width: 19px; height: 19px; }
.md-post footer button:hover { background: rgba(47,111,237,.12); color: #5b93ff; }
.md-post footer .md-like:hover { background: rgba(249,24,128,.12); color: #f91880; }
.md-like.on { color: #f91880 !important; } .md-like.on svg { fill: #f91880; stroke: #f91880; }
.md-rc { border-radius: 16px; margin-top: 12px; }
.md-empty { margin: 20px auto !important; width: calc(100% - 40px) !important; }
/* lateral */
.md-side { padding: 14px 16px; gap: 14px; background: #07090d; }
.md-box { background: #0d1117; box-shadow: none; border: 1px solid #1a1f27; border-radius: 16px; }
.md-bh { padding: 14px 16px 10px; border-bottom: 0; } .md-bh b { font-size: 17px; font-weight: 800; color: #fff; }
.md-li { padding: 9px 6px; border-bottom: 1px solid #141920; }
.md-chat .md-msgs { padding: 6px 14px 12px; }
.md-msg { flex-direction: row; } .md-msg p { background: #161c25; padding: 8px 12px; border-radius: 4px 14px 14px 14px; display: inline-block; margin-top: 4px; font-size: 13.5px; }
.md-in { border-top: 1px solid #1a1f27; }
.md-in input { border-radius: 20px; height: 40px; padding: 0 16px; background: #121720; }
.md-in button { border-radius: 50%; width: 40px; height: 40px; }
.md-note { background: none; box-shadow: none; border-top: 1px solid #1a1f27; border-radius: 0; padding: 14px 6px 4px; }
.md-feed > * { flex-shrink: 0; }
.md-sr { padding: 3px !important; } .md-si { box-shadow: none !important; border: 3px solid #07090d; box-sizing: border-box; }

/* ===== v0.72 — Chat ao vivo nos jogos ===== */
body.chat-open .shell { margin-right: 340px; }
.lc { position: fixed; top: var(--top-h); right: 0; bottom: 0; width: 340px; z-index: 25; display: none; flex-direction: column; background: linear-gradient(180deg, #0b0f16, #080b10); border-left: 1px solid #1a212c; }
body.chat-open .lc { display: flex; }
body.chat-open .lc-tab { display: none; }
.lc-h { display: flex; align-items: center; padding: 14px 14px 12px 18px; border-bottom: 1px solid #161c26; }
.lc-h > div { flex: 1; display: flex; flex-direction: column; gap: 2px; } .lc-h b { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: #fff; } .lc-h small { font-size: 11.5px; color: #6b7585; }
.lc-dot { width: 8px; height: 8px; border-radius: 50%; background: #2ebd85; animation: mdPulse 1.6s infinite; }
.lc-x { width: 32px; height: 32px; border: 0; border-radius: 8px; background: #111824; color: #8b95a7; cursor: pointer; display: grid; place-items: center; box-shadow: inset 0 0 0 1px #1f2836; }
.lc-x:hover { color: #fff; } .lc-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lc-msgs { flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 12px; scrollbar-width: thin; }
.lc-sys { font-size: 12px; line-height: 1.45; color: #8b95a7; padding: 10px 12px; border-radius: 10px; background: #0f141d; box-shadow: inset 0 0 0 1px #1c2433; } .lc-sys b { color: #e6ebf1; }
.lc-m { display: flex; gap: 10px; }
.lc-av { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font: 800 11px inherit; color: #fff; background: linear-gradient(135deg, #2f6fed, #6a5cff); box-shadow: inset 0 1px 0 rgba(255,255,255,.25); }
.lc-m > div { min-width: 0; }
.lc-mh { display: flex; align-items: baseline; gap: 6px; } .lc-mh b { font-size: 12.5px; color: #e6ebf1; } .lc-mh small { font-size: 10.5px; color: #5d6676; }
.lc-m p { margin: 4px 0 0; display: inline-block; max-width: 100%; padding: 8px 12px; border-radius: 4px 14px 14px 14px; background: #161c25; font-size: 13.5px; line-height: 1.4; color: #e6ebf1; word-break: break-word; }
.lc-rd { display: flex; align-items: center; gap: 10px; font-size: 11.5px; font-weight: 700; color: #8b95a7; }
.lc-rd::before, .lc-rd::after { content: ""; flex: 1; height: 1px; background: #1c2433; }
.lc-rd span { padding: 3px 10px; border-radius: 20px; background: #0f141d; box-shadow: inset 0 0 0 1px #1f2836; white-space: nowrap; }
.lc-rd.up span { color: #7fa9ff; box-shadow: inset 0 0 0 1px rgba(59,124,240,.4); } .lc-rd.dn span { color: #ff7a80; box-shadow: inset 0 0 0 1px rgba(229,72,79,.4); }
.lc-in { display: flex; align-items: center; gap: 8px; padding: 12px 12px 6px; border-top: 1px solid #161c26; }
.lc-in input { flex: 1; min-width: 0; height: 40px; border: 0; border-radius: 20px; padding: 0 16px; background: #121720; color: #e6ebf1; font: 400 13.5px "Segoe UI", Roboto, Arial, sans-serif; box-shadow: inset 0 0 0 1px #1f2836; outline: 0; }
.lc-in input:focus { box-shadow: inset 0 0 0 1px #2f6fed; }
.lc-in button { flex: 0 0 40px; height: 40px; border: 0; border-radius: 50%; cursor: pointer; display: grid; place-items: center; background: linear-gradient(180deg, #3a7bf5, #2a62d9); box-shadow: 0 6px 16px -8px rgba(47,111,237,.9); }
.lc-in button svg { width: 17px; height: 17px; fill: #fff; }
.lc-rules { margin: 0; padding: 0 16px 12px; font-size: 10.5px; line-height: 1.4; color: #4d5767; }
.lc-tab { position: fixed; right: 18px; bottom: 18px; z-index: 25; display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 18px 0 16px; border: 0; border-radius: 23px; cursor: pointer; color: #fff; font: 700 14px inherit;
  background: linear-gradient(180deg, #1d2738, #121925); box-shadow: inset 0 0 0 1px #2a3850, inset 0 1px 0 rgba(255,255,255,.08), 0 12px 30px -10px rgba(0,0,0,.9); }
.lc-tab svg { width: 20px; height: 20px; fill: none; stroke: #5b93ff; stroke-width: 1.8; stroke-linejoin: round; }
.lc-tab:hover { background: linear-gradient(180deg, #223047, #151d2b); }
.md-msg > span { display: block; min-width: 0; }
@media (max-width: 1100px) { body.chat-open .shell { margin-right: 0; } .lc { width: min(340px, 100vw); box-shadow: -20px 0 40px rgba(0,0,0,.6); } }
.lc-tab { right: 0; bottom: auto; top: 50%; transform: translateY(-50%); height: auto; width: 40px; padding: 14px 0; flex-direction: column; border-radius: 12px 0 0 12px; gap: 10px; font-size: 12.5px; }
.lc-tab span { writing-mode: vertical-rl; transform: rotate(180deg); letter-spacing: .04em; }

/* ===== v0.73 — chat da mesa estilo live ===== */
.lc { width: 340px; background: #0b0d12; border-left: 1px solid #1a1f28; }
.lc::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 40% at 100% 0%, rgba(47,111,237,.08), transparent 60%); }
.lc > * { position: relative; }
.lc-h { gap: 12px; padding: 12px 12px 12px 16px; border-bottom: 1px solid #1a1f28; background: linear-gradient(180deg, #10141b, #0b0d12); }
.lc-th { flex: 0 0 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; background: #0d1117; box-shadow: inset 0 0 0 1px #232b38, 0 4px 12px -6px #000; }
.lc-th svg { width: 32px; height: 24px; }
.lc-ti { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lc-ti b { font-size: 15px; font-weight: 800; color: #fff; }
.lc-ti small { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #8b95a7; white-space: nowrap; }
.lc-dot { width: 7px; height: 7px; }
.lc-rnd { display: grid; grid-template-columns: 1fr auto; row-gap: 7px; padding: 10px 16px; border-bottom: 1px solid #1a1f28; background: #0d1016; font-size: 12px; }
.lc-rnd span { color: #aab4c2; font-weight: 600; } .lc-rnd b { color: #e6ebf1; font-weight: 700; font-feature-settings: "tnum" 1; }
.lc-rnd.bet b { color: #ffd166; } .lc-rnd.run b { color: #5b93ff; }
.lc-rnd i { grid-column: 1 / -1; height: 3px; border-radius: 2px; background: #1a212c; overflow: hidden; }
.lc-rnd em { display: block; height: 100%; background: linear-gradient(90deg, #2f6fed, #5b93ff); transition: width .25s linear; }
.lc-rnd.bet em { background: linear-gradient(90deg, #d2b26a, #ffd166); }
.lc-pin { display: flex; gap: 10px; margin: 10px 12px 0; padding: 10px 12px; border-radius: 12px; background: linear-gradient(180deg, #121722, #0e121a); box-shadow: inset 0 0 0 1px #1f2836, inset 3px 0 0 #2f6fed; }
.lc-zb i { width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; font-style: italic; font-weight: 900; font-size: 14px; color: #fff; background: linear-gradient(135deg, #e5484f 0 50%, #2f6fed 50%); }
.lc-pin b { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: #fff; }
.lc-pin b svg { width: 14px; height: 14px; fill: #2f6fed; }
.lc-pin b em { font-style: normal; font-size: 10.5px; font-weight: 600; color: #6b7585; margin-left: 4px; }
.lc-pin p { margin: 2px 0 0; font-size: 12px; line-height: 1.4; color: #aab4c2; }
.lc-msgs { padding: 10px 6px 10px 8px; gap: 2px; }
.lc-m { display: flex; align-items: flex-start; gap: 8px; padding: 6px 8px; border-radius: 8px; }
.lc-m:hover { background: #12161e; }
.lc-t { flex: 0 0 auto; font-size: 10.5px; color: #4d5767; padding-top: 3px; font-feature-settings: "tnum" 1; }
.lc-av { flex-basis: 22px !important; width: 22px !important; height: 22px !important; font-size: 9.5px !important; background: var(--c, #2f6fed) !important; color: #0b0d12 !important; box-shadow: none !important; }
.lc-m p { margin: 0; padding: 0; background: none; border-radius: 0; font-size: 13.5px; line-height: 1.45; color: #dfe5ec; word-break: break-word; }
.lc-m p b { font-weight: 700; margin-right: 2px; }
.lc-rd { margin: 8px 0; }
.lc-rd span { font-size: 11.5px; padding: 4px 12px; }
.lc-empty { margin: auto; padding: 30px 20px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.lc-empty svg { width: 34px; height: 34px; fill: none; stroke: #2a3342; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 4px; }
.lc-empty b { font-size: 13.5px; color: #c9d1db; } .lc-empty span { font-size: 12px; color: #5d6676; }
.lc-msgs:has(.lc-empty) { justify-content: center; }
.lc-q { display: flex; gap: 6px; padding: 8px 12px 0; overflow-x: auto; scrollbar-width: none; border-top: 1px solid #1a1f28; }
.lc-q button { flex: 0 0 auto; height: 28px; padding: 0 12px; border: 0; border-radius: 14px; cursor: pointer; font: 600 12px "Segoe UI", Roboto, Arial, sans-serif; color: #c9d1db; background: #141a24; box-shadow: inset 0 0 0 1px #232b38; }
.lc-q button:hover { background: #1a2230; color: #fff; }
.lc-in { border-top: 0; padding: 8px 12px 6px; }
.lc-field { flex: 1; position: relative; display: flex; }
.lc-field input { flex: 1; height: 42px !important; border-radius: 10px !important; padding: 0 44px 0 14px !important; background: #121720 !important; box-shadow: inset 0 0 0 1px #232b38 !important; font-size: 13.5px !important; }
.lc-field input:focus { box-shadow: inset 0 0 0 1px #2f6fed, 0 0 0 3px rgba(47,111,237,.15) !important; }
.lc-cnt { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 10.5px; color: #4d5767; font-feature-settings: "tnum" 1; }
.lc-send { flex: 0 0 42px !important; height: 42px !important; border-radius: 10px !important; }
.lc-rules { display: flex; align-items: center; gap: 6px; padding: 2px 14px 12px; }
.lc-rules svg { flex: 0 0 13px; width: 13px; height: 13px; fill: none; stroke: #4d5767; stroke-width: 1.8; stroke-linejoin: round; }

/* v0.74 — chat: entrada identificada */
.lc-gate { position: absolute; inset: 120px 0 0 0; z-index: 3; display: flex; align-items: center; justify-content: center; padding: 20px; background: linear-gradient(180deg, rgba(11,13,18,.92), #0b0d12 40%); }
.lc-gate[hidden] { display: none; }
.lc-gc { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; }
.lc-gi { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, #23324d, #121a2a); box-shadow: inset 0 0 0 1px #2f4672, 0 10px 24px -10px rgba(47,111,237,.8); margin-bottom: 4px; }
.lc-gi svg { width: 26px; height: 26px; fill: none; stroke: #9cbcff; stroke-width: 1.8; stroke-linecap: round; }
.lc-gc > b { font-size: 16px; color: #fff; } .lc-gc > span { font-size: 12.5px; line-height: 1.45; color: #8b95a7; max-width: 270px; }
.lc-gc form { width: 100%; display: flex; flex-direction: column; gap: 10px; margin-top: 10px; text-align: left; }
.lc-gc label { display: flex; flex-direction: column; gap: 6px; font-size: 11.5px; font-weight: 600; color: #aab4c2; }
.lc-gc label input:not([type]) , .lc-gc #lcName { height: 42px; border: 0; border-radius: 10px; padding: 0 14px; background: #121720; color: #fff; font: 500 14px "Segoe UI", Roboto, Arial, sans-serif; box-shadow: inset 0 0 0 1px #232b38; outline: 0; }
.lc-gc #lcName:focus { box-shadow: inset 0 0 0 1px #2f6fed, 0 0 0 3px rgba(47,111,237,.15); }
.lc-ck { flex-direction: row !important; align-items: flex-start; gap: 9px !important; font-weight: 500 !important; line-height: 1.4; cursor: pointer; }
.lc-ck input { margin-top: 2px; accent-color: #2f6fed; }
.lc-err { min-height: 14px; font-size: 11.5px; color: #ff7a80; }
.lc-gc button { height: 44px; border: 0; border-radius: 10px; cursor: pointer; font: 700 14px "Segoe UI", Roboto, Arial, sans-serif; color: #fff; background: linear-gradient(180deg, #3a7bf5, #2a62d9); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 20px -10px rgba(47,111,237,.9); }
.lc.lc-locked .lc-q, .lc.lc-locked .lc-in { opacity: .35; pointer-events: none; }
.lc-id { font-style: normal; font-size: 10px; font-weight: 700; color: #6b7585; margin: 0 4px 0 3px; padding: 1px 5px; border-radius: 4px; background: #151b25; vertical-align: 1px; }
.lc-id.v { color: #7fe0b5; background: rgba(46,189,133,.12); }
.lc-who { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 12px; background: #10151e; box-shadow: inset 0 0 0 1px #232b38; }
.lc-who .lc-av { flex-basis: 36px !important; width: 36px !important; height: 36px !important; font-size: 12px !important; }
.lc-who > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; } .lc-who small { font-size: 10.5px; color: #6b7585; } .lc-who b { font-size: 14px; color: #fff; }
.lc-who em { font-style: normal; font-size: 10.5px; font-weight: 700; color: #7fe0b5; padding: 3px 8px; border-radius: 20px; background: rgba(46,189,133,.12); white-space: nowrap; }
.lc-wn { font-size: 12.5px; color: #aab4c2; line-height: 1.4; }
.lc-ck[hidden] { display: none !important; }
.lc-decl { width: 100%; display: flex; flex-direction: column; gap: 7px; font-size: 11.5px; font-weight: 600; color: #aab4c2; }
.lc-decl b { color: #7fe0b5; }
.lc-decl input { height: 42px; border: 0; border-radius: 10px; padding: 0 14px; background: #121720; color: #fff; font: 500 14px "Segoe UI", Roboto, Arial, sans-serif; box-shadow: inset 0 0 0 1px #232b38; outline: 0; }
.lc-decl input:focus { box-shadow: inset 0 0 0 1px #2f6fed, 0 0 0 3px rgba(47,111,237,.15); }
.lc-decl small { font-size: 10.5px; font-weight: 500; color: #6b7585; }
.lc-who:has(.lc-decl) { background: none; box-shadow: none; padding: 0; }

/* ===== v0.76 — Perfil ===== */
.pf-btn { width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; margin-left: 4px; }
.pf-avi { display: inline-grid; place-items: center; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, #2f6fed, #6a5cff); color: #fff; font-weight: 800; box-shadow: 0 0 0 2px #0b0e13, 0 0 0 3.5px #2a3850; }
.pf-avi img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-avi i { font-style: normal; }
.pf-avi.sm { width: 36px; height: 36px; font-size: 13px; }
.pf-btn:hover .pf-avi { box-shadow: 0 0 0 2px #0b0e13, 0 0 0 3.5px #5b93ff; }
.pf-avi.lg { width: 128px; height: 128px; font-size: 42px; box-shadow: 0 0 0 5px #0b0e13, 0 0 0 7px #2a3850, 0 20px 40px -14px rgba(0,0,0,.9); }
.pf .lab-win { width: min(1000px, 100%); height: min(920px, 100%); background: #07090d; }
.pf-body { flex: 1; overflow-y: auto; scrollbar-width: thin; padding-bottom: 26px; }
.pf-hero { position: relative; }
.pf-cover { height: 190px; position: relative; overflow: hidden;
  background: radial-gradient(60% 120% at 85% 0%, rgba(47,111,237,.55), transparent 60%), radial-gradient(50% 120% at 10% 100%, rgba(229,72,79,.35), transparent 60%), linear-gradient(120deg, #0f1828, #0a0d15 60%, #12101a); }
.pf-cv-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 34px 34px; -webkit-mask: linear-gradient(180deg, #000, transparent); mask: linear-gradient(180deg, #000, transparent); }
.pf-cover::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, #e5484f, #2f6fed 50%, transparent); opacity: .7; }
.pf-id { display: flex; align-items: flex-end; gap: 20px; padding: 0 30px; margin-top: -64px; position: relative; }
.pf-photo { position: relative; cursor: pointer; flex: 0 0 auto; }
.pf-cam { position: absolute; right: 4px; bottom: 6px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: #151c28; box-shadow: 0 0 0 3px #07090d, inset 0 0 0 1px #2a3850; }
.pf-cam svg { width: 17px; height: 17px; fill: none; stroke: #c9d1db; stroke-width: 1.8; stroke-linejoin: round; }
.pf-photo:hover .pf-cam { background: #1d2738; }
.pf-nm { flex: 1; min-width: 0; padding-bottom: 8px; display: flex; flex-direction: column; gap: 4px; }
.pf-nm h3 { margin: 0; font-size: 26px; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.pf-nm span { font-size: 13.5px; color: #6b7585; }
.pf-edit { margin-bottom: 12px; height: 38px; padding: 0 18px; border-radius: 19px; border: 0; cursor: pointer; font: 700 13.5px inherit; color: #fff; background: transparent; box-shadow: inset 0 0 0 1px #3a4458; }
.pf-edit:hover { background: #121820; }
.pf-in { width: 100%; border: 0; border-radius: 10px; padding: 10px 14px; background: #10151e; color: #fff; font: 600 15px "Segoe UI", Roboto, Arial, sans-serif; box-shadow: inset 0 0 0 1px #2a3342; outline: 0; resize: none; }
.pf-in:focus { box-shadow: inset 0 0 0 1px #2f6fed, 0 0 0 3px rgba(47,111,237,.15); }
.pf-nm .pf-in { font-size: 20px; font-weight: 800; }
.pf-bio { padding: 14px 30px 0; }
.pf-bio p { margin: 0; font-size: 15px; line-height: 1.5; color: #e6ebf1; } .pf-bio textarea { font-weight: 400; }
.pf-mut { color: #5d6676 !important; font-size: 13.5px !important; }
.pf-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 12px; }
.pf-meta span { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: #8b95a7; }
.pf-meta svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pf-stats { display: grid; grid-template-columns: repeat(5, 1fr); margin: 22px 30px 0; border-radius: 16px; background: linear-gradient(180deg, #0f141d, #0b0f16); box-shadow: inset 0 0 0 1px #1c2433; }
.pf-stats > div { padding: 16px 10px; text-align: center; display: flex; flex-direction: column; gap: 3px; }
.pf-stats > div + div { box-shadow: inset 1px 0 0 #1a212c; }
.pf-stats b { font-size: 22px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; } .pf-stats small { font-size: 11.5px; color: #6b7585; }
.pf-cols { display: grid; grid-template-columns: 1.2fr 1fr; gap: 14px; margin: 14px 30px 0; }
.pf-box { border-radius: 16px; background: #0d1117; border: 1px solid #1a1f27; padding: 4px 16px 14px; }
.pf-bh { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0 10px; } .pf-bh b { font-size: 15px; color: #fff; } .pf-bh small { font-size: 11.5px; color: #5d6676; }
.pf-badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; }
.pf-bdg { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 5px; padding: 14px 8px 12px; border-radius: 14px; background: radial-gradient(90% 70% at 50% 0%, rgba(var(--bc), .16), transparent 70%), #10151e; box-shadow: inset 0 0 0 1px rgba(var(--bc), .3); --bc: 91,147,255; }
.pf-bdg.k-streak { --bc: 255,159,10; } .pf-bdg.k-cent { --bc: 46,189,133; } .pf-bdg.k-week { --bc: 196,155,255; } .pf-bdg.k-post { --bc: 229,72,79; }
.pf-bdg > span { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, rgba(var(--bc), .5), rgba(var(--bc), .12)); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 6px 14px -6px rgba(var(--bc), .9); }
.pf-bdg svg { width: 21px; height: 21px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pf-bdg b { font-size: 12.5px; color: #fff; } .pf-bdg small { font-size: 10.5px; color: #6b7585; line-height: 1.3; }
.pf-g { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #141920; } .pf-g:last-child { border-bottom: 0; }
.pf-gt { flex: 0 0 40px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: #10151e; box-shadow: inset 0 0 0 1px #1f2836; } .pf-gt svg { width: 30px; height: 22px; }
.pf-gn { flex: 1; display: flex; flex-direction: column; gap: 6px; } .pf-gn b { font-size: 13px; color: #e6ebf1; }
.pf-gn i { display: block; height: 5px; border-radius: 3px; background: #161d29; overflow: hidden; } .pf-gn em { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #2f6fed, #5b93ff); }
.pf-gv { font-size: 14px; color: #fff; font-feature-settings: "tnum" 1; min-width: 28px; text-align: right; }
.pf-note { margin: 18px 30px 0; font-size: 11.5px; line-height: 1.5; color: #4d5767; }
.lc-ph, .md-ph { overflow: hidden; padding: 0; } .lc-ph img, .md-ph img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50%; }

/* ===== v0.77 — Perfil: nível, desempenho, convite ===== */
.pf .lab-win { width: min(1120px, 100%); }
.pf-cover { height: 210px; background: #0a0d15; }
.pf-cover canvas, .pf-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-cover::after { z-index: 1; }
.pf-cvb { position: absolute; right: 18px; top: 16px; z-index: 2; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 16px; cursor: pointer; font: 600 12px inherit; color: #e6ebf1; background: rgba(8,10,15,.55); backdrop-filter: blur(6px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.pf-cvb svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.pf-ring { display: inline-block; padding: 4px; border-radius: 50%; background: conic-gradient(from 200deg, var(--r1), var(--r2), var(--r1), var(--r2), var(--r1)); box-shadow: 0 18px 40px -14px rgba(0,0,0,.95); }
.pf-ring .pf-avi.lg { box-shadow: 0 0 0 4px #07090d; width: 132px; height: 132px; }
.pf-nm h3 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pf-tier { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px 0 6px; border-radius: 14px; font-size: 12.5px; font-weight: 800; letter-spacing: .02em; color: #fff;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--r1) 55%, transparent), 0 0 18px -8px var(--r1); }
.pf-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; margin: 22px 30px 0; }
.pf-side { display: flex; flex-direction: column; gap: 14px; }
.pf-box { background: linear-gradient(180deg, #0e131b, #0a0e14); border: 1px solid #1a212c; }
.pf-pnl { display: grid; grid-template-columns: 1.4fr 1fr .8fr 1fr; gap: 10px; padding: 2px 0 12px; border-bottom: 1px solid #161d29; }
.pf-pnl small { display: block; font-size: 11px; color: #6b7585; margin-bottom: 3px; } .pf-pnl b { font-size: 18px; font-weight: 800; color: #fff; font-feature-settings: "tnum" 1; white-space: nowrap; }
.pf-pnl b.g { color: #2ebd85; } .pf-pnl b.r { color: #f6465d; } .pf-pnl > div:first-child b { font-size: 22px; }
.pf-curve { display: block; width: 100%; height: 170px; margin: 12px 0 6px; }
.pf-gl { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; border-top: 1px solid #161d29; padding-top: 4px; }
.pf-lvl { padding: 16px; background: radial-gradient(90% 80% at 0% 0%, color-mix(in srgb, var(--r2) 30%, transparent), transparent 70%), linear-gradient(180deg, #0e131b, #0a0e14); }
.pf-lvh { display: flex; align-items: center; gap: 14px; }
.pf-emb { filter: drop-shadow(0 6px 10px rgba(0,0,0,.6)); flex: 0 0 auto; }
.pf-lvh small { display: block; font-size: 11px; color: #6b7585; } .pf-lvh b { display: block; font-size: 24px; font-weight: 800; color: #fff; line-height: 1.1; } .pf-lvh span { font-size: 12px; color: #8b95a7; }
.pf-lvb { display: block; height: 7px; border-radius: 4px; margin: 14px 0 12px; background: #161d29; overflow: hidden; box-shadow: inset 0 1px 2px rgba(0,0,0,.5); }
.pf-lvb em { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--r2), var(--r1)); box-shadow: 0 0 10px color-mix(in srgb, var(--r1) 60%, transparent); }
.pf-lvs { display: flex; justify-content: space-between; } .pf-lvs span { opacity: .25; filter: grayscale(1); } .pf-lvs span.on { opacity: 1; filter: none; }
.pf-ref { padding: 4px 16px 16px; } .pf-ref p { margin: 0 0 10px; font-size: 12.5px; color: #8b95a7; }
.pf-link { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 12px; border-radius: 10px; background: #0b0f16; box-shadow: inset 0 0 0 1px #232b38; }
.pf-link span { flex: 1; min-width: 0; font: 600 13px "Consolas", ui-monospace, monospace; color: #c9d1db; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-link button { height: 32px; padding: 0 14px; border: 0; border-radius: 8px; cursor: pointer; font: 700 12.5px inherit; color: #fff; background: linear-gradient(180deg, #3a7bf5, #2a62d9); }
.pf-rs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; } .pf-rs div { padding: 10px; border-radius: 10px; background: #0f141d; text-align: center; } .pf-rs b { display: block; font-size: 18px; color: #fff; } .pf-rs small { font-size: 11px; color: #6b7585; }
.pf-medals { display: flex; justify-content: space-between; padding: 2px 2px 6px; }
.pf-md { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; --bc: 91,147,255; background: radial-gradient(circle at 50% 30%, #2a3140, #10141c); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -3px 6px rgba(0,0,0,.6), 0 0 0 2px #0b0f16, 0 0 0 3px #1f2836; opacity: .35; }
.pf-md svg { width: 21px; height: 21px; fill: none; stroke: #8b95a7; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pf-md.k-streak { --bc: 255,159,10; } .pf-md.k-cent { --bc: 46,189,133; } .pf-md.k-week { --bc: 196,155,255; } .pf-md.k-post { --bc: 229,72,79; }
.pf-md.on { opacity: 1; background: radial-gradient(circle at 50% 28%, rgba(var(--bc), .95), rgba(var(--bc), .35) 70%); box-shadow: inset 0 2px 1px rgba(255,255,255,.4), inset 0 -3px 6px rgba(0,0,0,.4), 0 0 0 2px #0b0f16, 0 0 0 3.5px rgba(var(--bc), .5), 0 8px 18px -6px rgba(var(--bc), .9); }
.pf-md.on svg { stroke: #fff; }
.pf-stats, .pf-cols { display: none; }
@media (max-width: 1000px) { .pf-grid { grid-template-columns: 1fr; } }
.pf-side, .pf-lvh > div, .pf-ref p { text-align: left !important; } .pf-ring { padding: 5px !important; } .pf-lvh > div { flex: 1; }
.pf-id { position: relative; }
.pf-rm { position: absolute; left: 30px; top: 70px; z-index: 3; width: 34px; height: 34px; border: 0; border-radius: 50%; cursor: pointer; display: grid; place-items: center; background: #151c28; box-shadow: 0 0 0 3px #07090d, inset 0 0 0 1px #3a2a30; }
.pf-rm svg { width: 16px; height: 16px; fill: none; stroke: #ff7a80; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pf-rm:hover { background: #2a1519; }
.pf-cvr { right: 108px !important; color: #ffb3b8 !important; }

/* ===== v0.78 — Perfil: carta de jogador premium ===== */
.pf-hero2 { position: relative; }
.pf-hero2 .pf-cover { height: 180px; }
.pf-row { position: relative; display: flex; gap: 34px; padding: 0 30px; margin-top: -120px; z-index: 2; }
.pf-cardw { flex: 0 0 280px; perspective: 1000px; }
.pf-card { --c1: var(--r1); --c2: var(--r2); position: relative; width: 280px; height: 400px; border-radius: 22px 22px 26px 26px; overflow: hidden; color: #1a1206;
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .2s ease-out; transform-style: preserve-3d;
  clip-path: polygon(0 6%, 8% 0, 92% 0, 100% 6%, 100% 88%, 50% 100%, 0 88%);
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(255,255,255,.55), transparent 55%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.07) 0 2px, transparent 2px 7px),
    linear-gradient(160deg, var(--c1) 0%, var(--c2) 45%, var(--c1) 62%, var(--c2) 100%);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.35), inset 0 0 0 7px rgba(0,0,0,.18); filter: drop-shadow(0 30px 40px rgba(0,0,0,.85)) drop-shadow(0 0 30px color-mix(in srgb, var(--c1) 30%, transparent)); }
.pf-card.k-diamante, .pf-card.k-platina { color: #0b1530; }
.pf-card.k-prata { color: #10151d; }
.pf-card::before { content: ""; position: absolute; inset: 10px; clip-path: inherit; border: 1.5px solid rgba(0,0,0,.25); border-radius: 18px; pointer-events: none; }
.pc-sheen { position: absolute; inset: -30%; pointer-events: none; background: radial-gradient(25% 20% at var(--mx, 30%) var(--my, 15%), rgba(255,255,255,.6), transparent 70%), linear-gradient(115deg, transparent 40%, rgba(255,255,255,.35) 48%, transparent 56%); mix-blend-mode: soft-light; z-index: 4; }
.pc-holo { position: absolute; inset: 0; pointer-events: none; opacity: .18; mix-blend-mode: color-dodge; z-index: 4; background: conic-gradient(from 90deg at var(--mx, 50%) var(--my, 50%), #ff6bd6, #6bd8ff, #b9ff6b, #ffd36b, #ff6bd6); }
.pc-top { position: absolute; left: 22px; right: 22px; top: 26px; display: flex; justify-content: space-between; align-items: flex-start; z-index: 3; }
.pc-ovr { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.pc-ovr b { font-size: 46px; font-weight: 900; letter-spacing: -.03em; text-shadow: 0 1px 0 rgba(255,255,255,.4); }
.pc-ovr small { font-size: 14px; font-weight: 900; letter-spacing: .04em; margin-top: 4px; }
.pc-top .pf-emb { filter: drop-shadow(0 2px 4px rgba(0,0,0,.4)); margin-top: 4px; }
.pc-photo { position: absolute; left: 50%; top: 52px; transform: translateX(-50%); width: 168px; height: 168px; border-radius: 50%; overflow: hidden; cursor: pointer; z-index: 2;
  background: radial-gradient(circle at 50% 35%, rgba(255,255,255,.35), rgba(0,0,0,.25)); box-shadow: inset 0 0 0 3px rgba(255,255,255,.35), 0 10px 24px -8px rgba(0,0,0,.6); display: grid; place-items: center; }
.pc-photo img { width: 100%; height: 100%; object-fit: cover; }
.pc-photo i { font-style: normal; font-size: 64px; font-weight: 900; color: rgba(0,0,0,.55); }
.pc-photo .pf-cam { right: 10px; bottom: 10px; opacity: 0; transition: opacity .15s; }
.pc-photo:hover .pf-cam { opacity: 1; }
.pf-card .pf-rm { left: 24px; top: 186px; z-index: 5; }
.pc-name { position: absolute; left: 0; right: 0; top: 230px; text-align: center; z-index: 3; font-size: 26px; font-weight: 900; letter-spacing: .03em; line-height: 1; }
.pc-name small { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; margin-top: 5px; opacity: .7; text-transform: uppercase; }
.pc-name::after { content: ""; display: block; height: 1.5px; margin: 10px 46px 0; background: linear-gradient(90deg, transparent, rgba(0,0,0,.35), transparent); }
.pc-attr { position: absolute; left: 34px; right: 34px; top: 290px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px 10px; z-index: 3; }
.pc-attr span { display: flex; align-items: baseline; gap: 5px; font-size: 12px; font-weight: 800; letter-spacing: .04em; opacity: .85; }
.pc-attr b { font-size: 19px; font-weight: 900; opacity: 1; min-width: 26px; text-align: right; }
.pc-foot { position: absolute; left: 0; right: 0; bottom: 30px; display: flex; flex-direction: column; align-items: center; gap: 4px; z-index: 3; font-size: 10px; font-weight: 800; letter-spacing: .1em; opacity: .75; }
.pc-z { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-style: italic; font-weight: 900; letter-spacing: .02em; }
.pc-z i { width: 16px; height: 16px; border-radius: 4px; display: grid; place-items: center; font-size: 10px; color: #fff; background: linear-gradient(135deg, #e5484f 0 50%, #2f6fed 50%); }
.pf-info { flex: 1; min-width: 0; padding-top: 140px; display: flex; flex-direction: column; gap: 12px; }
.pf-info .pf-nm { padding: 0; } .pf-info .pf-bio { padding: 0; }
.pf-acts { display: flex; gap: 10px; }
.pf-acts .pf-edit { margin: 0; }
.pf-ovrx { display: flex; align-items: center; gap: 16px; padding: 14px 16px; border-radius: 14px; background: radial-gradient(80% 120% at 0% 50%, color-mix(in srgb, var(--r2) 30%, transparent), transparent 70%), #0d1117; border: 1px solid #1a212c; }
.pf-ovrx small { display: block; font-size: 11px; color: #8b95a7; } .pf-ovrx b { font-size: 36px; font-weight: 900; line-height: 1; background: linear-gradient(180deg, var(--r1), var(--r2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pf-ovrx p { margin: 0; font-size: 12.5px; line-height: 1.45; color: #8b95a7; }
.pf-hero2 + .pf-grid { margin-top: 26px; }
.pf-card { height: 432px; } .pc-attr { top: 286px; } .pc-foot { bottom: 46px; } .pf-row { margin-top: -130px; }

/* ===== v0.79 — Perfil estilo corretora ===== */
.pf .lab-win { width: min(1180px, 100%); background: #0b0e12; }
.pf-body { padding: 0 0 26px; }
.bx-head { display: flex; align-items: center; gap: 18px; padding: 24px 28px; border-bottom: 1px solid #1a1f27; background: #0d1015; }
.bx-av { position: relative; flex: 0 0 72px; height: 72px; border-radius: 16px; overflow: hidden; cursor: pointer; display: grid; place-items: center; background: #1a2130; box-shadow: inset 0 0 0 1px #2a3240; }
.bx-av img { width: 100%; height: 100%; object-fit: cover; } .bx-av i { font-style: normal; font-size: 26px; font-weight: 800; color: #c9d1db; }
.bx-avc { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0,0,0,.55); opacity: 0; transition: opacity .15s; }
.bx-avc svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linejoin: round; } .bx-av:hover .bx-avc { opacity: 1; }
.bx-hi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 9px; }
.bx-hi h3 { margin: 0; font-size: 22px; font-weight: 700; color: #eaecef; }
.bx-in { max-width: 340px; font-size: 18px !important; }
.bx-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bx-uid { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #848e9c; } .bx-uid b { color: #eaecef; font-weight: 600; font-feature-settings: "tnum" 1; }
.bx-cp { width: 22px; height: 22px; padding: 0; border: 0; background: none; cursor: pointer; color: #848e9c; display: grid; place-items: center; }
.bx-cp:hover { color: #eaecef; } .bx-cp svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.bx-chip { font-size: 12px; font-weight: 600; color: #b7bdc6; padding: 3px 9px; border-radius: 4px; background: #1c2129; }
.bx-chip.real { color: #f0c96b; background: rgba(240,201,107,.12); } .bx-chip.vip { color: #c9d1db; background: #232934; }
.bx-chip.lvl { color: #9cbcff; background: rgba(47,111,237,.14); } .bx-chip.okc { color: #2ebd85; background: rgba(46,189,133,.12); } .bx-chip.warn { color: #f0b90b; background: rgba(240,185,11,.1); }
.bx-ha { display: flex; gap: 8px; }
.bx-btn { height: 36px; padding: 0 16px; border: 0; border-radius: 6px; cursor: pointer; font: 600 13.5px inherit; color: #eaecef; background: #2b3139; }
.bx-btn:hover { background: #363c45; } .bx-btn.ghost { background: transparent; color: #f6465d; box-shadow: inset 0 0 0 1px #3a2a30; } .bx-btn.ghost:hover { background: #1f1418; }
.bx-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 16px; padding: 20px 28px 0; }
.bx-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.bx-card { border-radius: 10px; background: #12161c; border: 1px solid #1e232b; padding: 16px 18px; }
.bx-ch { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; } .bx-ch b { font-size: 15px; font-weight: 600; color: #eaecef; } .bx-ch span { font-size: 12px; color: #848e9c; }
.bx-lnk { border: 0; background: none; padding: 0; cursor: pointer; font: 500 12.5px inherit; color: #5b93ff; } .bx-lnk:hover { color: #8fb4ff; }
.bx-bal small { font-size: 12.5px; color: #848e9c; } .bx-bal div { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; }
.bx-bal div b { font-size: 30px; font-weight: 700; color: #eaecef; font-feature-settings: "tnum" 1; letter-spacing: -.01em; } .bx-bal div span { font-size: 14px; font-weight: 600; color: #848e9c; }
.bx-bal em { font-style: normal; font-size: 12.5px; color: #848e9c; }
.bx-pnl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid #1e232b; }
.bx-pnl small { display: block; font-size: 12px; color: #848e9c; margin-bottom: 4px; } .bx-pnl b { font-size: 14.5px; font-weight: 600; color: #eaecef; font-feature-settings: "tnum" 1; white-space: nowrap; }
.bx-card b.g, .bx-tb b.g { color: #2ebd85; } .bx-card b.r, .bx-tb b.r { color: #f6465d; }
.bx-cv { display: block; width: 100%; height: 140px; margin-top: 16px; }
.bx-tb { width: 100%; border-collapse: collapse; font-size: 13px; }
.bx-tb th { text-align: left; font-weight: 500; font-size: 12px; color: #848e9c; padding: 0 0 10px; border-bottom: 1px solid #1e232b; }
.bx-tb td { padding: 11px 0; color: #eaecef; border-bottom: 1px solid #191d24; font-feature-settings: "tnum" 1; }
.bx-tb tr:last-child td { border-bottom: 0; } .bx-tb .r { text-align: right; } .bx-tb td b { font-weight: 600; }
.bx-empty { color: #5e6673 !important; text-align: center; padding: 22px 0 !important; }
.bx-tb.sm td { padding: 8px 0; font-size: 12.5px; color: #848e9c; } .bx-tb.sm tr.on td { color: #eaecef; font-weight: 600; }
.bx-dl { margin: 0; } .bx-dl div { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid #191d24; font-size: 13px; } .bx-dl div:last-child { border-bottom: 0; }
.bx-dl dt { color: #848e9c; } .bx-dl dd { margin: 0; color: #eaecef; font-weight: 500; font-feature-settings: "tnum" 1; }
.bx-sec { list-style: none; margin: 0; padding: 0; } .bx-sec li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #191d24; } .bx-sec li:last-child { border-bottom: 0; }
.bx-sec svg { flex: 0 0 20px; width: 20px; height: 20px; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.bx-sec li.ok svg { stroke: #2ebd85; } .bx-sec li.pend svg { stroke: #848e9c; }
.bx-sec span { display: flex; flex-direction: column; } .bx-sec b { font-size: 13px; font-weight: 600; color: #eaecef; } .bx-sec small { font-size: 12px; color: #848e9c; }
.bx-lv { display: flex; align-items: baseline; justify-content: space-between; } .bx-lv b { font-size: 20px; font-weight: 700; color: #eaecef; } .bx-lv span { font-size: 12px; color: #848e9c; }
.bx-bar { display: block; height: 4px; border-radius: 2px; background: #2b3139; margin: 10px 0 12px; overflow: hidden; } .bx-bar em { display: block; height: 100%; background: #2f6fed; }
@media (max-width: 980px) { .bx-grid { grid-template-columns: 1fr; } .bx-pnl { grid-template-columns: 1fr 1fr; } }

/* ===== v0.80 — Ranking ===== */
.rk-hero { position: relative; display: flex; align-items: center; gap: 36px; padding: 30px 40px; overflow: hidden; border-bottom: 1px solid #1a1f27;
  background: radial-gradient(60% 120% at 18% 50%, rgba(var(--gl), .28), transparent 60%), radial-gradient(40% 80% at 100% 0%, rgba(47,111,237,.12), transparent 70%), linear-gradient(180deg, #0c0f15, #090b10); }
.rk-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size: 28px 28px; -webkit-mask: radial-gradient(70% 90% at 20% 50%, #000, transparent); mask: radial-gradient(70% 90% at 20% 50%, #000, transparent); }
.rk-stage { position: relative; flex: 0 0 240px; height: 240px; display: grid; place-items: center; }
.rk-halo { position: absolute; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--gl), .55), transparent 65%); filter: blur(8px); animation: rkPulse 3.2s ease-in-out infinite; }
@keyframes rkPulse { 50% { transform: scale(1.08); opacity: .75; } }
.rk-crest { position: relative; filter: drop-shadow(0 14px 22px rgba(0,0,0,.75)) drop-shadow(0 0 16px rgba(var(--gl, 120,150,255), .35)); overflow: visible; }
.rk-stage .rk-crest { animation: rkFloat 4s ease-in-out infinite; }
@keyframes rkFloat { 50% { transform: translateY(-6px); } }
.rk-info { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.rk-info > small { font-size: 12.5px; font-weight: 600; color: #8b95a7; letter-spacing: .02em; }
.rk-info h2 { margin: 0; font-size: 46px; font-weight: 900; letter-spacing: -.02em; line-height: 1; color: #fff; text-shadow: 0 0 30px rgba(var(--gl), .5); }
.rk-info h2 span { font-size: 34px; color: rgb(var(--gl)); margin-left: 6px; }
.rk-pt { font-size: 14px; color: #aab4c2; } .rk-pt b { color: #fff; font-feature-settings: "tnum" 1; }
.rk-bar { display: block; max-width: 520px; height: 10px; border-radius: 5px; background: #161b24; box-shadow: inset 0 1px 2px rgba(0,0,0,.6), inset 0 0 0 1px #222a36; overflow: hidden; }
.rk-bar em { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, rgba(var(--gl), .55), rgb(var(--gl))); box-shadow: 0 0 14px rgba(var(--gl), .8); }
.rk-pos { display: flex; gap: 12px; margin-top: 6px; }
.rk-pos > div { padding: 10px 14px; border-radius: 10px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px #1f2836; display: flex; flex-direction: column; gap: 2px; min-width: 170px; }
.rk-pos small { font-size: 11px; color: #6b7585; } .rk-pos b { font-size: 20px; color: #fff; font-weight: 800; } .rk-pos em { font-style: normal; font-size: 11px; color: #6b7585; }
.rk-road { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; padding: 16px 28px; border-bottom: 1px solid #1a1f27; background: #0b0e12; }
.rk-tier { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px 6px 12px; border-radius: 10px; opacity: .4; filter: grayscale(.7); transition: opacity .2s; }
.rk-tier.done { opacity: .8; filter: none; } .rk-tier.cur { opacity: 1; filter: none; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 1px #2a3342; }
.rk-tn { display: flex; flex-direction: column; align-items: center; gap: 4px; } .rk-tn b { font-size: 12.5px; color: #e6ebf1; }
.rk-ds { display: flex; gap: 3px; flex-wrap: wrap; justify-content: center; }
.rk-ds span { min-width: 22px; height: 18px; padding: 0 4px; border-radius: 4px; display: grid; place-items: center; font-size: 10px; font-weight: 800; color: #6b7585; background: #141922; }
.rk-ds span.ok { color: #c9d1db; background: #1d2430; } .rk-ds span.on { color: #0b0e12; background: #e6ebf1; box-shadow: 0 0 10px rgba(255,255,255,.4); }
.rk-hero + .rk-road + .bx-grid { padding-top: 20px; }
@media (max-width: 900px) { .rk-road { grid-template-columns: repeat(4, 1fr); } .rk-hero { flex-direction: column; } }
.rk-pos b .g { color: #2ebd85; } .rk-pos b .r { color: #f6465d; } .rk-pos { flex-wrap: wrap; }
.rk-pos b.g { color: #2ebd85; } .rk-pos b.r { color: #f6465d; }

/* v0.84 — cabeçalho do perfil */
.bh2 { position: relative; display: flex; align-items: center; gap: 24px; padding: 26px 30px; overflow: hidden; border-bottom: 1px solid #1a1f27; }
.bh2-bg { position: absolute; inset: 0; background: radial-gradient(50% 160% at 0% 50%, rgba(var(--gl), .16), transparent 70%), linear-gradient(90deg, #0e1218, #0b0e12 60%); }
.bh2-bg::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, rgba(var(--gl), .7), transparent 60%); }
.bh2 > * { position: relative; }
.bh2-av { flex: 0 0 auto; position: relative; cursor: pointer; }
.bh2-ring { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: radial-gradient(circle at 50% 30%, #2a3346, #121722);
  box-shadow: 0 0 0 3px #0b0e12, 0 0 0 5px rgba(var(--gl), .85), 0 0 26px -4px rgba(var(--gl), .7), 0 14px 26px -12px #000; }
.bh2-ring img { width: 100%; height: 100%; object-fit: cover; } .bh2-ring i { font-style: normal; font-size: 32px; font-weight: 800; color: #e6ebf1; letter-spacing: .02em; }
.bh2-av .bx-avc { border-radius: 50%; width: 96px; height: 96px; }
.bh2-cr { position: absolute; right: -14px; bottom: -12px; filter: drop-shadow(0 4px 6px rgba(0,0,0,.7)); }
.bh2-i { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.bh2-i h3 { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 26px; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.bh2-vf { width: 22px; height: 22px; fill: #2f6fed; }
.bh2-sub { display: flex; align-items: center; gap: 14px; font-size: 13.5px; color: #8b95a7; }
.bh2-uid { display: inline-flex; align-items: center; gap: 4px; font-feature-settings: "tnum" 1; }
.bh2-facts { display: flex; margin-top: 10px; }
.bh2-facts > div { padding: 0 22px; display: flex; flex-direction: column; gap: 3px; } .bh2-facts > div:first-child { padding-left: 0; }
.bh2-facts > div + div { border-left: 1px solid #222a35; }
.bh2-facts small { font-size: 11.5px; color: #6b7585; } .bh2-facts b { font-size: 14px; font-weight: 700; color: #e6ebf1; white-space: nowrap; }
.bh2-facts b.gold { color: #f0c96b; } .bh2-facts b.okt { color: #2ebd85; } .bh2-facts b.wt { color: #f0b90b; }
.bh2 .bx-btn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 8px; background: linear-gradient(180deg, #232a35, #1a2029); box-shadow: inset 0 0 0 1px #2e3744, inset 0 1px 0 rgba(255,255,255,.05); }
.bh2 .bx-btn:hover { background: linear-gradient(180deg, #2a3240, #1f2631); }
.bh2 .bx-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.bh2 .bx-btn.ghost { background: transparent; box-shadow: inset 0 0 0 1px #3a2a30; }
.bh2-cr { right: -20px; bottom: -18px; }

/* v0.85 — perfil estilo plataforma de trader (eToro-like) */
.et-h { border-bottom: 1px solid #1a1f27; background: linear-gradient(180deg, #0f1319, #0b0e12); }
.et-top { display: flex; align-items: center; gap: 20px; padding: 26px 30px 22px; }
.et-av { position: relative; flex: 0 0 84px; height: 84px; border-radius: 50%; overflow: hidden; cursor: pointer; display: grid; place-items: center; background: #1c2230; box-shadow: 0 0 0 1px #2a3240; }
.et-av img { width: 100%; height: 100%; object-fit: cover; } .et-av i { font-style: normal; font-size: 28px; font-weight: 700; color: #d6dde6; }
.et-av .bx-avc { border-radius: 50%; }
.et-id { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.et-id h3 { margin: 0; font-size: 26px; font-weight: 700; color: #fff; letter-spacing: -.01em; }
.et-sub { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13.5px; color: #8b95a7; }
.et-sub > i { width: 3px; height: 3px; border-radius: 50%; background: #3a4352; }
.et-sub > span { display: inline-flex; align-items: center; gap: 4px; }
.et-rk { color: #e6ebf1; font-weight: 600; gap: 6px !important; } .et-rk .rk-crest { filter: none; margin: -4px 0; }
.et-kpi { display: grid; grid-template-columns: 1fr 1.4fr 1fr 1fr; border-top: 1px solid #1a1f27; }
.et-kpi > div { padding: 16px 30px 18px; display: flex; flex-direction: column; gap: 4px; } .et-kpi > div + div { border-left: 1px solid #1a1f27; }
.et-kpi small { font-size: 12px; color: #8b95a7; } .et-kpi em { font-style: normal; font-size: 11px; color: #5d6676; }
.et-kpi b { font-size: 26px; font-weight: 700; color: #fff; font-feature-settings: "tnum" 1; letter-spacing: -.01em; } .et-kpi b.g { color: #2ebd85; } .et-kpi b.r { color: #f6465d; }
.et-risk { display: flex; gap: 3px; margin: 4px 0 2px; }
.et-risk span { flex: 1; height: 28px; border-radius: 3px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #5d6676; background: #161b23; }
.et-risk span.on { color: #0b0e12; background: var(--rc); box-shadow: 0 0 12px -2px var(--rc); transform: scaleY(1.12); }
.et-mr { padding: 18px 30px 6px; border-bottom: 1px solid #1a1f27; }
.et-tb { width: 100%; border-collapse: separate; border-spacing: 3px; table-layout: fixed; }
.et-tb th { font-size: 11.5px; font-weight: 500; color: #8b95a7; text-align: center; padding: 0 0 4px; }
.et-tb td { height: 34px; text-align: center; font-size: 12px; font-weight: 600; font-feature-settings: "tnum" 1; border-radius: 4px; }
.et-tb td.g { color: #3ddc97; background: rgba(46,189,133,var(--a)); } .et-tb td.r { color: #ff6b7a; background: rgba(246,70,93,var(--a)); }
.et-tb td.et-e { color: #3a4352; background: #11151b; }
.et-tb td.et-y { color: #c9d1db; font-weight: 700; text-align: left; padding-left: 4px; width: 46px; }
.et-tb td.et-yt { background: #161b23; font-weight: 800; }
.et-tb th:first-child { width: 46px; }
.bh2 { display: none; }

/* v0.86 — perfil com vida */
.et-h { position: relative; overflow: hidden; }
.et-live { position: absolute; left: 30%; right: 0; top: 0; height: 120px; width: 70%; pointer-events: none; opacity: .9; -webkit-mask: linear-gradient(90deg, transparent, #000 40%); mask: linear-gradient(90deg, transparent, #000 40%); }
.et-top, .et-kpi { position: relative; }
.et-h::before { content: ""; position: absolute; inset: 0; background: radial-gradient(40% 140% at 0% 0%, rgba(var(--gl), .14), transparent 70%); animation: etBreath 6s ease-in-out infinite; }
@keyframes etBreath { 50% { opacity: .55; } }
.et-av { box-shadow: 0 0 0 2px #0b0e12, 0 0 0 4px rgba(var(--gl), .8); animation: etRing 3s ease-in-out infinite; }
@keyframes etRing { 50% { box-shadow: 0 0 0 2px #0b0e12, 0 0 0 4px rgba(var(--gl), .8), 0 0 24px 2px rgba(var(--gl), .45); } }
.rk-fx { position: absolute; inset: -20px; width: calc(100% + 40px); height: calc(100% + 40px); pointer-events: none; }
.rk-stage { overflow: visible; }
.rk-stage .rk-crest { position: relative; z-index: 2; }
.rk-shine { position: absolute; z-index: 3; inset: 10px 30px; pointer-events: none; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.55) 50%, transparent 60%); background-size: 250% 100%; mix-blend-mode: overlay;
  -webkit-mask: radial-gradient(closest-side, #000 70%, transparent); mask: radial-gradient(closest-side, #000 70%, transparent); animation: rkShine 4.5s ease-in-out infinite; }
@keyframes rkShine { 0%, 55% { background-position: 150% 0; } 100% { background-position: -100% 0; } }
.rk-bar em { position: relative; overflow: hidden; animation: rkFill 1.2s cubic-bezier(.2,.8,.2,1) both; transform-origin: left; }
@keyframes rkFill { from { transform: scaleX(0); } }
.rk-bar em::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent); animation: rkRun 2.2s linear infinite; }
@keyframes rkRun { from { transform: translateX(-100%); } to { transform: translateX(200%); } }
.et-risk span.on { animation: etRisk 2s ease-in-out infinite; } @keyframes etRisk { 50% { box-shadow: 0 0 20px 0 var(--rc); } }
.et-kpi > div, .rk-pos > div, .et-tb td, .rk-tier, .bx-card { animation: etIn .6s cubic-bezier(.2,.8,.2,1) both; }
.et-kpi > div:nth-child(2) { animation-delay: .06s; } .et-kpi > div:nth-child(3) { animation-delay: .12s; } .et-kpi > div:nth-child(4) { animation-delay: .18s; }
.rk-tier:nth-child(2) { animation-delay: .05s; } .rk-tier:nth-child(3) { animation-delay: .1s; } .rk-tier:nth-child(4) { animation-delay: .15s; } .rk-tier:nth-child(5) { animation-delay: .2s; } .rk-tier:nth-child(6) { animation-delay: .25s; } .rk-tier:nth-child(7) { animation-delay: .3s; }
@keyframes etIn { from { opacity: 0; transform: translateY(8px); } }
.rk-tier.cur { box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 0 24px -8px rgba(255,255,255,.25); }
.rk-tier:hover { opacity: .9; filter: none; transform: translateY(-2px); transition: transform .15s, opacity .15s; }
.et-tb td:not(.et-e):not(.et-y):hover { filter: brightness(1.35); }
.et-kpi, .et-mr { display: none !important; } .et-h { border-bottom: 0; } .et-top { padding-bottom: 26px; }

/* v0.87 — cartões do perfil com vida */
.bx-card { position: relative; overflow: hidden; background: linear-gradient(180deg, #121821, #0e1218); border-color: #1e2530; transition: border-color .2s, transform .2s, box-shadow .2s; }
.bx-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(91,147,255,.55), transparent); opacity: .6; }
.bx-card:hover { border-color: #2a3442; box-shadow: 0 18px 40px -26px rgba(0,0,0,.9); }
.bx-live { display: inline-flex; align-items: center; gap: 7px; } .bx-live i { width: 7px; height: 7px; border-radius: 50%; background: #2ebd85; animation: mdPulse 1.6s infinite; }
.ov-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.bx-ov .bx-bal div { align-items: baseline; gap: 6px; } .ov-sym { font-size: 18px !important; font-weight: 600 !important; color: #8b95a7 !important; }
.bx-ov .bx-bal div b { font-size: 38px; letter-spacing: -.02em; background: linear-gradient(180deg, #fff, #b9c3d0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ov-mkt { text-align: right; padding: 10px 14px; border-radius: 10px; background: #0b0f15; box-shadow: inset 0 0 0 1px #1e2530; min-width: 190px; }
.ov-mkt small { display: block; font-size: 11px; color: #6b7585; } .ov-mkt b { font-size: 20px; font-weight: 700; font-feature-settings: "tnum" 1; color: #e6ebf1; transition: color .2s; } .ov-mkt b.g { color: #2ebd85; } .ov-mkt b.r { color: #f6465d; } .ov-mkt em { display: block; font-style: normal; font-size: 11px; color: #6b7585; }
.ov-pnl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 16px; }
.ov-pnl > div { position: relative; padding: 11px 12px; border-radius: 10px; background: #0b0f15; box-shadow: inset 0 0 0 1px #1a212b; }
.ov-pnl > div.up { background: linear-gradient(180deg, rgba(46,189,133,.1), #0b0f15); box-shadow: inset 0 0 0 1px rgba(46,189,133,.25); } .ov-pnl > div.dn { background: linear-gradient(180deg, rgba(246,70,93,.1), #0b0f15); box-shadow: inset 0 0 0 1px rgba(246,70,93,.25); }
.ov-pnl small { display: block; font-size: 11.5px; color: #8b95a7; margin-bottom: 4px; } .ov-pnl b { font-size: 15px; font-weight: 700; color: #e6ebf1; font-feature-settings: "tnum" 1; }
.ov-ar { position: absolute; right: 10px; top: 10px; font-style: normal; font-size: 10px; color: #4d5767; } .up .ov-ar { color: #2ebd85; } .dn .ov-ar { color: #f6465d; }
.ov-chart { position: relative; margin-top: 14px; border-radius: 10px; background: #0a0d12; box-shadow: inset 0 0 0 1px #1a212b; padding: 8px 8px 4px; }
.ov-chart .bx-cv { margin: 0; height: 150px; }
.ov-tag { position: absolute; left: 14px; top: 10px; font-size: 11px; color: #6b7585; }
.op-l { display: flex; flex-direction: column; }
.op-r { display: flex; align-items: center; gap: 12px; padding: 10px 6px; border-radius: 8px; border-bottom: 1px solid #171d26; transition: background .15s; } .op-r:hover { background: #151b24; } .op-r:last-child { border-bottom: 0; }
.op-th { flex: 0 0 42px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: #0b0f15; box-shadow: inset 0 0 0 1px #1f2836; } .op-th svg { width: 30px; height: 22px; }
.op-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; } .op-tx b { font-size: 13.5px; color: #e6ebf1; font-weight: 600; } .op-tx small { font-size: 11.5px; color: #6b7585; }
.op-v { display: flex; flex-direction: column; align-items: flex-end; } .op-v b { font-size: 14px; } .op-v small { font-size: 10.5px; color: #5d6676; }
.op-r.w { box-shadow: inset 2px 0 0 #2ebd85; } .op-r.l { box-shadow: inset 2px 0 0 #f6465d; }
.op-empty p { margin: 0 0 12px; font-size: 13px; color: #8b95a7; }
.op-gm { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.op-go { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 8px 12px; border-radius: 12px; text-decoration: none; background: linear-gradient(180deg, #151b25, #0f141c); box-shadow: inset 0 0 0 1px #222b38; transition: transform .15s, box-shadow .15s; }
.op-go:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px #3a6fd8, 0 12px 24px -14px rgba(47,111,237,.9); }
.op-go svg { width: 46px; height: 34px; } .op-go b { font-size: 12.5px; color: #fff; } .op-go small { font-size: 10.5px; color: #6b7585; }
.bx-dl.ic dt { display: inline-flex; align-items: center; gap: 9px; }
.bx-dl.ic dt svg { width: 16px; height: 16px; fill: none; stroke: #5b93ff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.bx-dl.ic dd { display: inline-flex; align-items: center; gap: 4px; }
.bx-dl.ic div { padding: 11px 6px; border-radius: 6px; } .bx-dl.ic div:hover { background: #151b24; }
.sec-top { position: relative; display: flex; align-items: center; gap: 14px; padding: 4px 0 12px; border-bottom: 1px solid #191d24; }
.sec-ring { width: 54px; height: 54px; transform: rotate(-90deg); } .sec-ring circle { fill: none; stroke-width: 4.5; } .sec-ring .bg { stroke: #1f2630; } .sec-ring .fg { stroke: #2ebd85; stroke-linecap: round; filter: drop-shadow(0 0 4px rgba(46,189,133,.6)); transition: stroke-dasharray 1s; }
.sec-n { position: absolute; left: 0; width: 54px; text-align: center; font-size: 12.5px; color: #fff; }
.sec-top div b { display: block; font-size: 14px; color: #fff; } .sec-top div small { font-size: 12px; color: #8b95a7; }
.bx-sec li { position: relative; } .bx-sec li span { flex: 1; }
.sec-st { font-style: normal; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 5px; color: #f0b90b; background: rgba(240,185,11,.1); }
.sec-st.ok { color: #2ebd85; background: rgba(46,189,133,.12); } .sec-st.soon { color: #8b95a7; background: #1a2029; }
.ov-wl { display: inline-flex; align-items: center; gap: 7px; margin-top: 8px; padding: 0; border: 0; background: none; cursor: pointer; font: 600 12.5px inherit; color: #8b95a7; transition: color .15s; }
.ov-wl svg { width: 15px; height: 15px; fill: none; stroke: #d2b26a; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ov-wl span { transition: transform .15s; } .ov-wl:hover { color: #fff; } .ov-wl:hover span { transform: translateX(3px); }
#wallet.wl { z-index: 95; }
.rk-pt { max-width: 560px; line-height: 1.5; }
.rk-pos[hidden] { display: none; }

/* ===================== CELULAR (site/app) ===================== */
.mb-nav { display: none; }
@media (max-width: 760px) {
  :root { --top-h: 56px; --rail-w: 0px; }
  body { padding-bottom: 72px; }
  /* topo compacto */
  .top { height: 56px !important; padding: 0 12px !important; gap: 8px !important; }
  .top .topnav, #sound, #hdrCash, .top #account, .brand .wm small { display: none !important; }
  .brand .wm strong { font-size: 20px !important; }
  .top .controls { margin-left: auto; gap: 8px !important; }
  .wl-btn { width: 38px; padding: 0 !important; justify-content: center; } .wl-btn span { display: none; }
  .top .balance { padding: 0 !important; } .top .balance span#balLabel { font-size: 10px !important; } .top .balance strong { font-size: 15px !important; }
  .pf-btn { width: 34px; height: 34px; } .pf-avi.sm { width: 32px; height: 32px; font-size: 12px; }
  /* jogos viram uma faixa horizontal embaixo do topo */
  .rail { top: var(--top-h) !important; bottom: auto !important; left: 0 !important; right: 0 !important; width: auto !important; height: 64px;
    flex-direction: row !important; align-items: center; gap: 8px !important; padding: 8px 10px !important; overflow-x: auto; overflow-y: hidden;
    background: #0a0d14 !important; border-right: 0 !important; border-bottom: 1px solid #1a212c !important; z-index: 30; scrollbar-width: none; }
  .rail::-webkit-scrollbar { display: none; }
  .rail .mkt, .rail .rail-cap, .rail .rail-help, .rail .rail-foot { display: none !important; }
  .rail .rail-item.gm { flex: 0 0 auto; height: 46px !important; padding: 0 12px 0 6px !important; margin: 0 !important; gap: 8px !important; border-radius: 12px !important; background: #10151e !important; box-shadow: inset 0 0 0 1px #1f2836 !important; }
  .rail .rail-item.gm.active { background: rgba(47,111,237,.16) !important; box-shadow: inset 0 0 0 1.5px #2f6fed !important; }
  .rail .rail-item.gm .gm-th { width: 36px !important; height: 30px !important; }
  .rail .rail-item.gm .ri-tx small { display: none; } .rail .rail-item.gm .ri-tx b { font-size: 13px; }
  .rail .ri-live { margin-left: 4px; font-size: 11px; }
  /* conteúdo */
  .shell { margin: 0 !important; padding: calc(var(--top-h) + 64px + 10px) 10px 16px !important; gap: 10px !important; }
  body.chat-open .shell { margin-right: 0 !important; }
  .play { display: flex !important; flex-direction: column; gap: 10px; }
  .stage-wrap { padding: 10px !important; }
  .stage-top { flex-wrap: wrap; gap: 4px; } .round-no { font-size: 11px; }
  .sd-stage, .dg-stage { min-height: 300px; } #sdStage { height: 320px !important; }
  .felt3d { height: 240px !important; }
  .g-pi .pi-tape { display: none; }
  .sides.ticket { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .sides.ticket .oc { grid-column: 1 / -1; order: -1; }
  .opanel { padding: 10px !important; } .opanel .op-last, .opanel .op-digits, .opanel .op-art, .opanel .op-ring { display: none !important; }
  .market, .market2 { display: none; }
  /* chat em tela cheia */
  .lc { top: 0 !important; width: 100vw !important; z-index: 85; box-shadow: none; }
  .lc-tab { display: none !important; }
  /* janelas (histórico, mídia, perfil) em tela cheia */
  .lab { padding: 0 !important; } .lab .lab-win { width: 100% !important; height: 100% !important; border-radius: 0 !important; border: 0 !important; }
  .md-grid { grid-template-columns: 1fr !important; } .md-nav { flex-direction: row; overflow-x: auto; } .md-note, .md-side { display: none !important; }
  .bx-grid, .pf-grid { grid-template-columns: 1fr !important; padding: 14px !important; }
  .rk-hero { flex-direction: column; padding: 20px !important; text-align: center; } .rk-info { align-items: center; } .rk-info h2 { font-size: 34px; } .rk-pos { justify-content: center; flex-wrap: wrap; }
  .rk-road { grid-template-columns: repeat(4, 1fr) !important; padding: 12px !important; }
  .et-top, .bh2 { flex-wrap: wrap; padding: 18px 16px !important; } .et-sub { font-size: 12px; }
  .ov-top { flex-direction: column; align-items: stretch; } .ov-pnl { grid-template-columns: 1fr 1fr !important; }
  .wl-pan { width: 100% !important; }
  /* abas de baixo */
  .mb-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: grid; grid-template-columns: repeat(5, 1fr); height: 64px; padding-bottom: env(safe-area-inset-bottom);
    background: rgba(9,12,18,.96); backdrop-filter: blur(10px); border-top: 1px solid #1a212c; }
  .mb-nav button { border: 0; background: none; color: #7f8a97; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font: 600 10.5px "Segoe UI", Roboto, Arial, sans-serif; }
  .mb-nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .mb-nav button.on { color: #fff; } .mb-nav button.on svg { stroke: #5b93ff; }
}
@media (max-width: 760px) {
  .rail { display: flex !important; }
  .felt3, #felt { min-height: 0 !important; height: auto !important; }
  .stage-wrap { min-height: 0 !important; }
  .opanel { display: flex !important; flex-direction: column; gap: 8px; min-height: 0 !important; }
  .opanel .op-die, .opanel .op-arrow, .opanel .oq-ring, .opanel .op-pos:not(.on) { display: none !important; }
  .opanel .op-head { margin: 0 !important; } .opanel .op-quote { display: block !important; padding: 0 !important; border: 0 !important; }
  .opanel .oq-mult b { font-size: 26px !important; }
  .obtn { height: 48px !important; padding: 0 12px !important; justify-content: center !important; margin-top: auto; }
  .obtn .ob-amt { display: none !important; } .obtn .ob-lbl { white-space: nowrap; font-size: 15px !important; }
  .oc { padding: 12px !important; }
}
/* v0.90.1 mobile games strip: force contents visible */
@media (max-width:760px){
  .rail .rail-item.gm { width: auto !important; min-width: 0 !important; justify-content: flex-start !important; }
  .rail .rail-item.gm .gm-th { display: block !important; flex: 0 0 36px; }
  .rail .rail-item.gm .ri-tx { display: flex !important; flex-direction: column; }
  .rail .rail-item.gm .ri-tx small { display: none !important; }
  .rail .rail-item.gm .ri-live { display: inline-flex !important; align-items: center; gap: 4px; position: static !important; }
}
/* v0.90.2 mobile: telas abertas sempre opacas e acima da barra de abas */
@media (max-width:760px){
  .lab .lab-win { background: #0b0e13 !important; }
  .lab, #wallet.wl { bottom: 64px !important; }
}

/* ===== v0.91 conta ZUPX: cadastro e login (auth.js) ===== */
.ag-hdr { display: none; gap: 8px; }
body.z-gate .ag-hdr { display: flex; }
body.z-user .ag-hdr { display: none; }
body.z-guest #hdrCash, body.z-guest #account { display: none !important; }
.ag-hb { height: 38px; padding: 0 16px; border-radius: 9px; border: 1px solid #263044; background: #0f1420; color: #fff; font: 600 13.5px/1 inherit; cursor: pointer; white-space: nowrap; }
.ag-hb:hover { background: #141b29; border-color: #334059; }
.ag-hb.pri { background: #2f6fed; border-color: #2f6fed; }
.ag-hb.pri:hover { background: #4280f5; border-color: #4280f5; }
body.ag-open { overflow: hidden; }

.ag { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(4,6,9,.78); backdrop-filter: blur(4px); }
.ag[hidden] { display: none; }
.ag-win { width: min(1040px, 100%); height: min(760px, 100%); display: grid; grid-template-columns: 420px 1fr; background: #0b0e13; border: 1px solid #1c222c; border-radius: 14px; overflow: hidden; box-shadow: 0 40px 120px rgba(0,0,0,.65); animation: agIn .22s cubic-bezier(.2,.9,.3,1); }
@keyframes agIn { from { opacity: 0; transform: translateY(8px) scale(.99); } to { opacity: 1; transform: none; } }

.ag-side { position: relative; display: flex; flex-direction: column; gap: 22px; padding: 30px 30px 24px; background: linear-gradient(180deg, #0f141c 0%, #0a0d12 100%); border-right: 1px solid #1a202a; overflow: hidden; }
.ag-side::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(#ffffff06 1px, transparent 1px), linear-gradient(90deg, #ffffff06 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(180deg, #000 0%, transparent 70%); pointer-events: none; }
.ag-side > * { position: relative; }
.ag-brand { display: flex; align-items: center; gap: 10px; color: #fff; }
.ag-zm { width: 34px; height: 34px; flex: 0 0 34px; }
.ag-brand span { display: flex; flex-direction: column; line-height: 1; }
.ag-brand b { font-size: 19px; font-weight: 800; font-style: italic; letter-spacing: .02em; }
.ag-brand small { font-size: 10.5px; color: #7f8a99; letter-spacing: .32em; margin-top: 3px; padding-left: 1px; }
.ag-pitch h2 { margin: 6px 0 10px; font-size: 26px; line-height: 1.18; font-weight: 750; color: #fff; letter-spacing: -.01em; }
.ag-pitch p { margin: 0; font-size: 13.5px; line-height: 1.55; color: #98a2b1; }
.ag-live { border: 1px solid #1d2430; border-radius: 12px; background: #0b0f15; padding: 12px 14px 10px; }
.ag-lv-h { display: flex; align-items: baseline; justify-content: space-between; font-size: 12.5px; color: #9aa4b2; }
.ag-lv-h em { font-style: normal; color: #6b7686; margin-left: 4px; }
.ag-lv-h b { font-size: 18px; color: #fff; font-weight: 700; font-feature-settings: "tnum" 1; }
#agSpark { display: block; width: 100%; height: 92px; margin: 6px 0 4px; }
.ag-lv-f { display: flex; justify-content: space-between; font-size: 11.5px; color: #7d8796; }
.ag-lv-f .up { color: #5b95ff; } .ag-lv-f .dn { color: #ff6b71; }
.ag-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #3ddc97; margin-right: 6px; vertical-align: 1px; box-shadow: 0 0 0 3px rgba(61,220,151,.15); }
.ag-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ag-facts li { display: grid; gap: 2px; padding-left: 14px; border-left: 2px solid #233046; }
.ag-facts b { font-size: 13.5px; color: #e9edf3; font-weight: 650; }
.ag-facts span { font-size: 12.5px; color: #828c9b; }
.ag-risk { margin: auto 0 0; font-size: 11.5px; line-height: 1.5; color: #687383; }

.ag-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.ag-top { display: flex; align-items: center; justify-content: flex-end; padding: 14px 16px 0; }
.ag-top .ag-brand.sm { display: none; margin-right: auto; }
.ag-x { width: 36px; height: 36px; border-radius: 9px; border: 1px solid #222a36; background: #10151d; color: #aeb7c4; display: grid; place-items: center; cursor: pointer; }
.ag-x:hover { color: #fff; border-color: #334059; }
.ag-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.ag-body { flex: 1 1 auto; overflow-y: auto; padding: 4px 56px 18px; scrollbar-width: thin; }
.ag-body h1 { margin: 6px 0 6px; font-size: 25px; font-weight: 750; color: #fff; letter-spacing: -.01em; }
.ag-lead { margin: 0 0 18px; font-size: 14px; color: #8e98a7; }
.ag-why { margin: 0 0 14px; padding: 10px 12px; border-radius: 9px; background: #101a2c; border: 1px solid #1f3359; color: #c9d8f5; font-size: 13px; }
.ag-tabs { display: grid; grid-template-columns: 1fr 1fr; height: 40px; padding: 3px; margin-bottom: 18px; border-radius: 10px; background: #0f131a; border: 1px solid #1d2430; }
.ag-tabs button { border: 0; border-radius: 7px; background: transparent; color: #8f99a8; font: 600 13.5px/1 inherit; cursor: pointer; }
.ag-tabs button.on { background: #1a212c; color: #fff; box-shadow: 0 1px 0 rgba(255,255,255,.04) inset; }

.ag-form { display: grid; gap: 12px; }
.ag-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ag-f { display: grid; gap: 6px; min-width: 0; align-content: start; }
.ag-l { font-size: 12.5px; font-weight: 600; color: #b7c0cc; }
.ag-l em { font-style: normal; font-weight: 500; color: #6c7787; margin-left: 4px; }
.ag-f input, .ag-f select { width: 100%; height: 44px; padding: 0 13px; border-radius: 9px; border: 1px solid #252d39; background: #0e1219; color: #fff; font: 500 14.5px/1 inherit; outline: none; transition: border-color .15s, background .15s; color-scheme: dark; }
.ag-f select { padding-right: 30px; appearance: none; background-image: linear-gradient(45deg, transparent 50%, #7f8a99 50%), linear-gradient(135deg, #7f8a99 50%, transparent 50%); background-position: calc(100% - 17px) 19px, calc(100% - 12px) 19px; background-size: 5px 5px; background-repeat: no-repeat; }
.ag-f input::placeholder { color: #566171; }
.ag-f input:hover, .ag-f select:hover { border-color: #2f3948; }
.ag-f input:focus, .ag-f select:focus { border-color: #2f6fed; background: #0f1520; }
.ag-f.bad input, .ag-f.bad select { border-color: #c4434a; }
.ag-e { min-height: 0; font-size: 12px; color: #ff7a80; }
.ag-e:empty { display: none; }
.ag-phone { display: grid; grid-template-columns: 112px 1fr; gap: 8px; }
.ag-pw { position: relative; }
.ag-pw input { padding-right: 46px; }
.ag-eye { position: absolute; right: 6px; top: 6px; width: 32px; height: 32px; border: 0; border-radius: 7px; background: transparent; color: #7c8796; display: grid; place-items: center; cursor: pointer; }
.ag-eye:hover, .ag-eye.on { color: #fff; background: #19202b; }
.ag-eye svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.ag-meter { display: grid; grid-template-columns: repeat(4, 1fr) auto; gap: 5px; align-items: center; margin-top: 2px; }
.ag-meter i { height: 3px; border-radius: 2px; background: #1e2530; }
.ag-meter span { font-size: 11.5px; color: #7c8796; min-width: 56px; text-align: right; }
.ag-meter[data-s="1"] i:nth-child(-n+1) { background: #e5484f; }
.ag-meter[data-s="2"] i:nth-child(-n+2) { background: #f0a43a; }
.ag-meter[data-s="3"] i:nth-child(-n+3) { background: #3b7cf0; }
.ag-meter[data-s="4"] i:nth-child(-n+4) { background: #3ddc97; }
.ag-check { display: flex; gap: 10px; align-items: flex-start; font-size: 12.5px; line-height: 1.5; color: #9aa4b2; cursor: pointer; margin-top: 2px; }
.ag-check input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: #2f6fed; flex: 0 0 17px; }
.ag-check.bad span { color: #ffb3b6; }
.ag-check a, .ag-alt a, .ag-line a, .ag-foot a { color: #6fa0ff; text-decoration: none; }
.ag-check a:hover, .ag-alt a:hover, .ag-line a:hover, .ag-foot a:hover { text-decoration: underline; }
.ag-line { display: flex; justify-content: flex-end; font-size: 13px; margin-top: -2px; }
.ag-btn { height: 46px; margin-top: 4px; border: 0; border-radius: 10px; background: #2f6fed; color: #fff; font: 650 15px/1 inherit; cursor: pointer; transition: background .15s; }
.ag-btn:hover { background: #4280f5; }
.ag-btn:disabled { opacity: .65; cursor: default; }
.ag-btn.ghost { background: #121823; border: 1px solid #263044; }
.ag-btn.ghost:hover { background: #172031; }
.ag-alt { margin: 4px 0 0; text-align: center; font-size: 13.5px; color: #8b95a4; }
.ag-sub { margin: 0 0 4px; font-size: 13.5px; line-height: 1.55; color: #98a2b1; }
.ag-msg { margin: 0 0 14px; padding: 10px 12px; border-radius: 9px; font-size: 13px; line-height: 1.45; border: 1px solid; }
.ag-msg.err { background: #1f0f12; border-color: #4a1c22; color: #ffb3b6; }
.ag-msg.ok { background: #0d1d16; border-color: #1c4a35; color: #9fe8c4; }
.ag-msg.warn { background: #1d170c; border-color: #4a3a1a; color: #f3d39a; }
.ag-sent { display: grid; justify-items: center; text-align: center; gap: 10px; padding: 40px 10px 10px; }
.ag-mail { width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center; background: #101a2c; border: 1px solid #1f3359; color: #6fa0ff; }
.ag-mail svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.ag-sent h3 { margin: 6px 0 0; font-size: 21px; color: #fff; }
.ag-sent p { margin: 0; max-width: 380px; font-size: 14px; line-height: 1.55; color: #9aa4b2; }
.ag-sent p b { color: #fff; }
.ag-sent .ag-mini { font-size: 12.5px; color: #717c8c; }
.ag-sent .ag-btn { width: 100%; max-width: 320px; margin-top: 10px; }
.ag-foot { display: flex; gap: 8px; justify-content: center; padding: 12px 16px 16px; border-top: 1px solid #151b24; font-size: 12px; color: #6b7686; }
.ag-out { height: 32px; padding: 0 12px; margin-right: 8px; border-radius: 8px; border: 1px solid #3a2026; background: #160d10; color: #ff9da2; font: 600 12.5px/1 inherit; cursor: pointer; }
.ag-out:hover { background: #22121a; }

@media (max-width: 980px) {
  .ag-win { grid-template-columns: 1fr; width: min(560px, 100%); }
  .ag-side { display: none; }
  .ag-top .ag-brand.sm { display: flex; }
  .ag-body { padding: 4px 32px 18px; }
}
@media (max-width: 760px) {
  .ag { padding: 0; }
  .ag-win { width: 100%; height: 100%; border-radius: 0; border: 0; }
  .ag-body { padding: 4px 18px 22px; }
  .ag-body h1 { font-size: 22px; }
  .ag-f input, .ag-f select { font-size: 16px; }
  .ag-hdr .ag-hb { height: 34px; padding: 0 12px; font-size: 13px; }
  body.z-guest .top .balance, body.z-guest #walletBtn, body.z-guest #profileBtn { display: none !important; }
}
@media (max-width: 420px) {
  .ag-row2 { grid-template-columns: 1fr; }
}
/* v0.91.2 tela de entrada em página cheia (visitante vê só cadastro/login) */
body.z-guest > *:not(.ag):not(script) { visibility: hidden !important; }
.ag.full { padding: 0; background: #07090d; backdrop-filter: none; }
.ag.full .ag-win { width: 100%; height: 100%; max-width: none; border: 0; border-radius: 0; grid-template-columns: minmax(440px, 46%) 1fr; box-shadow: none; animation: none; }
.ag.full .ag-side { padding: 44px 56px 34px; gap: 28px; }
.ag.full .ag-pitch { max-width: 520px; }
.ag.full .ag-pitch h2 { font-size: 40px; line-height: 1.12; letter-spacing: -.02em; }
.ag.full .ag-pitch p { font-size: 15px; max-width: 460px; }
.ag.full .ag-live { max-width: 560px; padding: 16px 18px 12px; }
.ag.full #agSpark { height: 150px; }
.ag.full .ag-facts { max-width: 520px; }
.ag.full .ag-main { justify-content: flex-start; }
.ag.full .ag-top { justify-content: flex-start; padding: 22px 28px 0; }
.ag.full .ag-body { flex: 0 1 auto; width: min(460px, 100%); margin: auto; padding: 16px 0 24px; overflow: visible; }
.ag.full .ag-main { overflow-y: auto; }
.ag.full .ag-foot { border-top: 0; }
@media (max-width: 980px) {
  .ag.full .ag-win { grid-template-columns: 1fr; }
  .ag.full .ag-top .ag-brand.sm { display: flex; }
  .ag.full .ag-body { padding: 8px 24px 24px; }
}
@media (max-width: 760px) {
  .ag.full .ag-top { padding: 16px 18px 0; }
  .ag.full .ag-body { padding: 8px 18px 24px; margin: 0 auto; }
}