/* Desenho C: janelas do jogo. A loja e o baú como as janelas do MU; os itens saem da grade da loja e caem no baú. */
.lc-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 4px 16px; }
.lc-mesa { display: grid; grid-template-columns: minmax(0, 1fr) 356px; gap: 16px; align-items: start; margin: 0 4px 14px; padding: 16px; background: #0b0f13;
  background-image: radial-gradient(ellipse at 30% 0%, rgba(211, 18, 44, .16), transparent 60%), radial-gradient(ellipse at 100% 100%, rgba(240, 199, 107, .07), transparent 55%); }
.lc-win { position: relative; color: #e9edf1; background: linear-gradient(180deg, #161c22, #0f1419); border: 1px solid #5a4a2c; box-shadow: inset 0 0 0 1px #000, inset 0 0 0 2px rgba(240, 199, 107, .12), 0 20px 40px -20px #000; }
.lc-wh { display: flex; align-items: center; justify-content: center; gap: 12px; height: 38px; font: 600 16px var(--f-disp); letter-spacing: .3em; text-transform: uppercase; color: #f0c76b;
  background: linear-gradient(180deg, #221b12, #15110c); border-bottom: 1px solid #5a4a2c; }
.lc-wh::before, .lc-wh::after { content: ""; width: 60px; height: 1px; background: linear-gradient(90deg, transparent, #8a7344); }
.lc-wh::after { transform: scaleX(-1); }
.lc-tabs { display: flex; gap: 2px; padding: 10px 12px 0; }
.lc-tabs button { flex: 1; height: 34px; cursor: pointer; font: 600 14px var(--f-disp); letter-spacing: .12em; text-transform: uppercase; color: #8f9ba6; background: #12181e; border: 1px solid #2c3640; border-bottom: 0; }
.lc-tabs button.on { color: #fff; background: #1d252d; box-shadow: inset 0 2px 0 var(--red); }
.lc-in { display: grid; grid-template-columns: 206px minmax(0, 1fr); gap: 14px; padding: 12px; border-top: 1px solid #2c3640; margin: 0 12px; padding-left: 0; padding-right: 0; }
.lc-lista [data-pane] { display: grid; gap: 3px; }
.lc-lista [data-pane][hidden] { display: none; }
.lc-i { display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 9px; align-items: center; padding: 5px 8px 5px 5px; cursor: pointer; text-align: left;
  font: inherit; color: #e9edf1; background: rgba(255, 255, 255, .03); border: 1px solid transparent; }
.lc-i:hover { background: rgba(255, 255, 255, .07); }
.lc-i.on { background: rgba(240, 199, 107, .1); border-color: rgba(240, 199, 107, .55); }
.lc-ic { grid-row: span 2; position: relative; display: grid; place-items: center; width: 34px; height: 34px; background: #0b0f13; box-shadow: inset 0 0 0 1px #2c3640; }
.lc-ic img { width: 28px; height: 28px; object-fit: contain; }
.lc-ic i { position: absolute; right: 1px; bottom: -1px; font: 700 10.5px var(--f-disp); font-style: normal; color: #f0c76b; text-shadow: 0 1px 1px #000; }
.lc-i.tw .lc-ic img { filter: grayscale(1) brightness(1.7); }
.lc-i.tb .lc-ic img { filter: grayscale(1) brightness(.45) drop-shadow(0 0 3px #a24bf0); }
.lc-n { font: 600 15px/1.1 var(--f-disp); letter-spacing: .03em; text-transform: uppercase; }
.lc-p { font: 600 10.5px var(--f-disp); letter-spacing: .08em; text-transform: uppercase; color: #8f9ba6; }
.lc-p b { font-size: 14px; letter-spacing: 0; color: #f0c76b; }
.lc-kit { display: grid; justify-items: center; align-content: start; gap: 10px; }
.lc-kit h2 { margin: 0; font: 600 22px var(--f-disp); letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.lc-kit .kgrid { --c: 30px; }
.lc-kit [data-show][hidden] { display: none; }
.lc-kit .qt button { color: #c4ccd4; background: #12181e; border-color: #2c3640; }
.lc-kit .qt button.on { color: #0b0f13; background: #f0c76b; border-color: #f0c76b; }
.lc-kit .rs-l { width: 100%; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
.lc-kit .rs { background: rgba(255, 255, 255, .04); border-color: #2c3640; }
.lc-kit .rs b { color: #fff; }
.lc-kit .rs > span:last-child { color: #8f9ba6; }
.lc-wf { display: flex; align-items: center; gap: 16px; padding: 12px; margin-top: 4px; background: #0b0f13; border-top: 1px solid #5a4a2c; }
.lc-pr { font: 600 12px var(--f-disp); letter-spacing: .1em; text-transform: uppercase; color: #8f9ba6; }
.lc-pr b { font-size: 30px; letter-spacing: 0; color: #f0c76b; }
.lc-es { font-size: 12px; color: #8f9ba6; }
.lc-es b { color: #fff; }
.lc-wf .btn { margin-left: auto; min-width: 180px; }
.lc-bau { position: sticky; top: 12px; }
.lc-bin { padding: 12px 10px 14px; }
.lc-bin .bx-tt h2 { font-size: 20px; }
.lc-bin.js-bx { --c: 41px; }
.lc .lj-nota { margin: 0 4px; }
.lc-bin .bx-tt h2 { display: none; }
.lc-bin .bx-sub { margin-top: 0; }
.lc-top p { margin: 6px 0 0; max-width: 480px; font-size: 13px; color: var(--ink-2); }
.lc-mais { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 4px 12px; }
.lc-pe { display: flex; align-items: stretch; gap: 0; margin: 0 4px; }
.lc-pe .lj-nota { flex: 1; margin: 0; }
.lc-pe a { display: grid; place-items: center; padding: 0 18px; font: 600 14px var(--f-disp); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); background: var(--plate); border: 1px solid var(--line); border-left: 0; }
.lc-pe a:hover { color: var(--red); }