.loot-root { --lt0:#A7ADB8; --lt1:#FFC9A6; --lt2:#FF6B63; --lt3:#FFA24D; --lt4:#FFE38F; --ltz:linear-gradient(90deg,#FFB3C7,#FFE38F,#8EF5D9,#FFB3C7);
  --lgrey:#9A9A9A; --link:#cfd3dc; --lok:#3ddc84; --lred:#FF4433; margin: 8px 0 40px; font-family: var(--mono); }
.loot-root * { box-sizing: border-box; }
.loot-root .l-term { background: #050505; border: 1px solid rgba(255,68,51,.25); border-radius: 18px; overflow: hidden; box-shadow: 0 0 50px rgba(255,68,51,.06); margin-bottom: 18px; }
.loot-root .l-bar { display: flex; align-items: center; gap: 8px; padding: 11px 16px; background: rgba(255,255,255,.03); border-bottom: 1px solid rgba(255,255,255,.08); font-size: 12px; color: var(--lgrey); flex-wrap: wrap; }
.loot-root .l-bar .t { margin-left: 8px; } .loot-root .l-bar .r { margin-left: auto; color: #fff; display: flex; gap: 14px; flex-wrap: wrap; }
.loot-root .l-dot { width: 10px; height: 10px; border-radius: 50%; } .loot-root .l-dot.rd { background: #FF4433; } .loot-root .l-dot.yl { background: #F0DC2E; } .loot-root .l-dot.gr { background: #3ddc84; }
.loot-root .l-body { padding: 18px 20px; }
.loot-root h3.l-h { font-size: 15px; font-weight: 800; margin: 0 0 10px; color: #fff; }
.loot-root p.l-p { color: var(--link); font-size: 13.5px; font-family: var(--body, 'Golos Text', system-ui, sans-serif); margin: 0 0 10px; max-width: 70ch; line-height: 1.55; }
.loot-root .l-muted { color: var(--lgrey); font-size: 12px; }
.loot-root .l-btn { font-family: var(--mono); font-weight: 700; font-size: 13px; padding: 10px 16px; border-radius: 11px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #fff; cursor: pointer; }
.loot-root .l-btn.pri { background: var(--hero-gradient); border-color: transparent; } .loot-root .l-btn.ok { background: rgba(61,220,132,.14); border-color: rgba(61,220,132,.4); color: var(--lok); }
.loot-root .l-btn.sm { padding: 7px 12px; font-size: 12px; border-radius: 9px; }
.loot-root .l-btn:disabled { opacity: .4; cursor: default; } .loot-root .l-btn:focus-visible { outline: 2px solid var(--lred); outline-offset: 2px; }
.loot-root .l-seg { display: inline-flex; gap: 4px; padding: 4px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 999px; flex-wrap: wrap; }
.loot-root .l-seg button { font-family: var(--mono); font-size: 12px; font-weight: 700; padding: 6px 12px; border-radius: 999px; border: none; background: none; color: var(--lgrey); cursor: pointer; } .loot-root .l-seg button.on { background: var(--hero-gradient); color: #fff; }
.loot-root input.l-in { width: 110px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.14); color: #fff; border-radius: 9px; padding: 8px 10px; font: 13px var(--mono); }
.loot-root .l-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } @media (max-width: 760px) { .loot-root .l-grid2 { grid-template-columns: 1fr; } }
.loot-root .l-card { background: #0b0b0d; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; padding: 16px 18px; }
.loot-root .l-kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 12.5px; align-items: center; } .loot-root .l-kv .k { color: var(--lgrey); } .loot-root .l-kv .v { color: #fff; font-weight: 700; }
.loot-root .l-msg { font-size: 12.5px; margin-top: 8px; min-height: 18px; } .loot-root .l-msg.err { color: var(--lred); } .loot-root .l-msg.ok { color: var(--lok); }
.loot-root .l-empty { color: var(--lgrey); font-size: 13px; padding: 14px 0; font-family: var(--body, system-ui, sans-serif); }
.loot-root .l-empty a { color: var(--lred); }

.loot-root .l-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; padding: 4px 0 6px; }
.loot-root .l-case { --line: rgba(255,255,255,.12); position: relative; display: flex; flex-direction: column; min-height: 186px; padding: 16px; border-radius: 14px; background: #0d0d0f; border: 1px solid var(--line); text-align: start; transition: border-color .15s, transform .15s; }
@media (hover: hover) and (pointer: fine) { .loot-root .l-case:hover { border-color: var(--c); transform: translateY(-2px); } }
.loot-root .l-case.zd { border-color: transparent; background: linear-gradient(#0d0d0f, #0d0d0f) padding-box, var(--ltz) border-box; }
.loot-root .l-case .num { font-size: 44px; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--c); }
.loot-root .l-case .num small { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; vertical-align: top; margin-inline-start: 6px; color: var(--c); }
.loot-root .l-case.zd .num { background: var(--ltz); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: lzd 3s linear infinite; } .loot-root .l-case.zd .num small { -webkit-text-fill-color: #fff; color: #fff; }
.loot-root .l-case .st { position: absolute; top: 14px; inset-inline-end: 14px; width: 10px; height: 10px; border-radius: 50%; background: var(--lgrey); }
.loot-root .l-case .st.ok { background: var(--lok); box-shadow: 0 0 0 4px rgba(61,220,132,.2); animation: lpulse 2s infinite; } .loot-root .l-case .st.open { background: var(--c); }
@keyframes lpulse { 50% { box-shadow: 0 0 0 8px rgba(61,220,132,.05); } }
.loot-root .l-case .slot { margin-top: 12px; height: 74px; border-radius: 10px; border: 1px solid var(--line); background: #09090b; display: grid; place-items: center; position: relative; overflow: hidden; padding: 0 10px; text-align: center; }
.loot-root .l-case .slot.sealed { background: repeating-linear-gradient(-45deg, #0c0c0e 0 6px, #101013 6px 12px); } .loot-root .l-case .slot.sealed span { font-size: 18px; letter-spacing: .3em; color: #3a3a3f; filter: blur(1px); }
.loot-root .l-case .slot.sealed i { position: absolute; width: 14px; height: 18px; border: 2px solid var(--c); border-radius: 3px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.loot-root .l-case .slot.sealed i::before { content: ''; position: absolute; left: 2px; right: 2px; top: -8px; height: 8px; border: 2px solid var(--c); border-bottom: 0; border-radius: 6px 6px 0 0; }
.loot-root .l-case .slot.unl { border-color: var(--lok); box-shadow: inset 0 0 0 1px var(--lok), 0 0 18px rgba(61,220,132,.2); } .loot-root .l-case .slot.unl span { color: var(--lok); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.loot-root .l-case .slot.open { border-color: var(--c); } .loot-root .l-case .slot.open span { font-family: var(--body, 'Golos Text', system-ui, sans-serif); font-size: 20px; font-weight: 800; color: #fff; line-height: 1.15; overflow-wrap: break-word; }
.loot-root .l-case .slot.gone span { color: var(--lgrey); font-size: 12px; text-decoration: line-through; }
.loot-root .l-case.expired { opacity: .5; filter: grayscale(1); }
.loot-root .l-case .t { margin-top: 12px; font-family: var(--body, 'Golos Text', system-ui, sans-serif); font-weight: 700; font-size: 15px; color: #fff; }
.loot-root .l-case .s { font-size: 11px; color: var(--lgrey); margin-top: 3px; line-height: 1.45; }
.loot-root .l-case .inside { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 8px; } .loot-root .l-case .inside span { font-size: 10px; padding: 2px 7px; border-radius: 6px; border: 1px dashed rgba(255,255,255,.2); color: #c9c9c9; }
.loot-root .l-case .act { margin-top: auto; padding-top: 12px; } .loot-root .l-case .act .l-btn { width: 100%; display: block; text-align: center; }
.loot-root .l-btn.acc { background: var(--c); border-color: var(--c); color: #111; } .loot-root .l-btn.acc:hover { filter: brightness(1.08); }
.loot-root .l-btn.ghost { background: none; color: var(--lgrey); cursor: default; }
@keyframes lzd { to { background-position: 300% 0; } }

.loot-root .l-streak { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; }
.loot-root .l-streak i { width: 18px; height: 8px; border-radius: 4px; background: rgba(255,255,255,.1); } .loot-root .l-streak i.on { background: var(--lred); box-shadow: 0 0 8px rgba(255,68,51,.7); } .loot-root .l-streak i.next { background: rgba(255,68,51,.25); border: 1px dashed rgba(255,68,51,.6); } .loot-root .l-streak i.mark { outline: 1px solid rgba(255,227,143,.7); }

.loot-root .l-inv { display: flex; gap: 8px; flex-wrap: wrap; }
.loot-root .l-chip { font-size: 12px; padding: 6px 10px; border-radius: 9px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.1); color: #fff; }
.loot-root .l-chip i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; background: var(--c); margin-right: 6px; vertical-align: 0; }
.loot-root .l-chip.used { opacity: .5; text-decoration: line-through; }

.loot-root .l-reelwrap { position: relative; padding: 22px 0; overflow: hidden; background: radial-gradient(ellipse at center, rgba(255,68,51,.08), transparent 60%); }
.loot-root .l-reelwrap::before, .loot-root .l-reelwrap::after { content: ''; position: absolute; top: 0; bottom: 0; width: 90px; z-index: 2; pointer-events: none; } .loot-root .l-reelwrap::before { left: 0; background: linear-gradient(90deg, #050505, transparent); } .loot-root .l-reelwrap::after { right: 0; background: linear-gradient(-90deg, #050505, transparent); }
.loot-root .l-marker { position: absolute; left: 50%; top: 12px; bottom: 12px; width: 2px; background: var(--lred); transform: translateX(-50%); z-index: 3; box-shadow: 0 0 12px rgba(255,68,51,.9); }
.loot-root .l-reel { display: flex; gap: 10px; will-change: transform; padding-left: 50%; direction: ltr; }
.loot-root .l-reel.spin { transition: transform 5.2s cubic-bezier(.12,.82,.16,1); }
.loot-root .l-item { width: 140px; height: 140px; flex: 0 0 140px; border-radius: 12px; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.45)); border: 1px solid rgba(255,255,255,.1); position: relative; overflow: hidden; }
.loot-root .l-item::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--c); } .loot-root .l-item::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--c) 22%, transparent), transparent 62%); pointer-events: none; }
.loot-root .l-item .ic { position: absolute; left: 50%; top: 22px; transform: translateX(-50%); width: 40px; height: 40px; color: var(--c); filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c) 60%, transparent)); } .loot-root .l-item .ic svg { width: 100%; height: 100%; }
.loot-root .l-item .nm { position: absolute; left: 10px; right: 10px; bottom: 24px; font-size: 12px; font-weight: 800; color: #fff; line-height: 1.25; word-break: break-word; } .loot-root .l-item .nm.enc { font-size: 10.5px; color: rgba(255,255,255,.55); word-break: break-all; }
.loot-root .l-item .tp { position: absolute; left: 10px; right: 10px; bottom: 9px; font-size: 9.5px; color: var(--c); letter-spacing: .06em; text-transform: uppercase; }
.loot-root .l-item.zd::before, .loot-root .l-item.zd .tp { background: var(--ltz); background-size: 300% 100%; animation: lzd 3s linear infinite; } .loot-root .l-item.zd .tp { -webkit-background-clip: text; background-clip: text; color: transparent; }
.loot-root .l-result { display: flex; gap: 16px; align-items: center; padding: 14px 20px; border-top: 1px solid rgba(255,255,255,.06); min-height: 70px; flex-wrap: wrap; }
.loot-root .l-result .big { font-size: 18px; font-weight: 800; } .loot-root .l-result .sub { font-size: 12px; color: var(--lgrey); margin-top: 2px; word-break: break-all; }

.loot-root .l-ginv { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.loot-root .l-gcard { position: relative; display: flex; flex-direction: column; text-align: start; padding: 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); background: #0a0a0c; color: #fff; font: inherit; font-family: var(--mono); cursor: pointer; transition: border-color .15s, transform .15s; }
@media (hover: hover) and (pointer: fine) { .loot-root .l-gcard:hover { border-color: rgba(255,255,255,.35); transform: translateY(-2px); } } .loot-root .l-gcard:focus-visible { outline: 2px solid var(--lred); outline-offset: 2px; }
.loot-root .l-gcard.on { border-color: var(--lred); } .loot-root .l-gcard.on .num { color: var(--lred); }
.loot-root .l-gcard .num { font-size: 26px; font-weight: 800; letter-spacing: -.04em; line-height: 1; } .loot-root .l-gcard .num small { display: block; font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--lgrey); margin-top: 4px; font-weight: 400; }
.loot-root .l-gcard .mini { margin: 10px 0 8px; height: 54px; border-radius: 8px; border: 1px solid rgba(255,255,255,.12); background: #09090b; display: grid; gap: 3px; padding: 6px; align-content: center; justify-content: center; direction: ltr; }
.loot-root .l-gcard .mini.m5 { grid-template-columns: repeat(5, 8px); } .loot-root .l-gcard .mini.m6 { grid-template-columns: repeat(6, 8px); } .loot-root .l-gcard .mini.m3 { grid-template-columns: repeat(3, 12px); } .loot-root .l-gcard .mini.mk { grid-template-columns: repeat(var(--n, 4), 12px); }
.loot-root .l-gcard .mini.mt { grid-template-columns: repeat(4, 12px); gap: 2px; padding: 4px 6px; } .loot-root .l-gcard .mini.mt i { aspect-ratio: auto; height: 4px; }
.loot-root .l-gcard .mini i { display: block; width: 100%; aspect-ratio: 1; border-radius: 2px; background: #1c1c20; } .loot-root .l-gcard .mini.mk i { aspect-ratio: 1.4; }
.loot-root .l-gcard .mini i.ok { background: var(--lok); } .loot-root .l-gcard .mini i.cur { background: rgba(255,68,51,.55); } .loot-root .l-gcard .mini i.pk { background: #fff; } .loot-root .l-gcard .mini i.x { background: var(--lred); }
.loot-root .l-gcard .mini.byte { display: flex; align-items: center; font-size: 16px; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.loot-root .l-gcard .t { font-family: var(--body, 'Golos Text', system-ui, sans-serif); font-weight: 700; font-size: 13px; line-height: 1.15; } .loot-root .l-gcard .s { font-size: 10px; color: var(--lgrey); margin-top: 3px; line-height: 1.4; }
.loot-root .l-gcard .st { position: absolute; top: 12px; inset-inline-end: 12px; width: 8px; height: 8px; border-radius: 50%; background: var(--lok); box-shadow: 0 0 0 3px rgba(61,220,132,.2); }
@media (max-width: 760px) { .loot-root .l-ginv { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .loot-root .l-gcard { padding: 10px; } .loot-root .l-gcard .num { font-size: 22px; } .loot-root .l-gcard .t { font-size: 12px; } }
.loot-root .l-gp { display: grid; grid-template-columns: minmax(0, 1fr) 280px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; overflow: hidden; background: #0a0a0c; }
.loot-root .l-canvas { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 460px; padding: 58px 22px 44px; background: radial-gradient(ellipse at 50% 40%, rgba(255,68,51,.06), transparent 60%), #08080a; }
.loot-root .l-ctop { position: absolute; top: 14px; inset-inline-start: 18px; display: flex; flex-direction: column; gap: 2px; } .loot-root .l-ctop b { font-family: var(--body, 'Golos Text', system-ui, sans-serif); font-size: 15px; font-weight: 700; color: #fff; } .loot-root .l-ctop span { font-size: 11px; color: var(--lgrey); }
.loot-root .l-cbot { position: absolute; bottom: 12px; inset-inline-start: 18px; font-size: 11px; color: #5a5a5a; }
.loot-root .l-cpanel { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-inline-start: 1px solid rgba(255,255,255,.12); background: #0d0d0f; }
.loot-root .l-f { display: flex; flex-direction: column; gap: 6px; } .loot-root .l-lbl { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--lgrey); } .loot-root .l-sub { font-size: 10.5px; color: #5a5a5a; }
.loot-root .l-inrow { display: flex; gap: 6px; } .loot-root .l-inrow .l-in { flex: 1; width: auto; min-width: 0; font-size: 15px; font-weight: 700; padding: 9px 12px; }
.loot-root .l-mb { font: 700 12px var(--mono); padding: 0 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: none; color: var(--lgrey); cursor: pointer; } .loot-root .l-mb:hover { color: #fff; border-color: rgba(255,255,255,.35); } .loot-root .l-mb:disabled { opacity: .4; cursor: default; }
.loot-root .l-seg3 { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; } .loot-root .l-seg3 button { font: 700 12px var(--mono); padding: 8px 0; border: none; border-radius: 7px; background: none; color: var(--lgrey); cursor: pointer; } .loot-root .l-seg3 button.on { background: var(--lred); color: #fff; } .loot-root .l-seg3 button:disabled { cursor: default; }
.loot-root .l-ro { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .loot-root .l-ro > div { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; min-width: 0; } .loot-root .l-ro b { font-size: 20px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: #fff; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; } .loot-root .l-ro b.hi { color: var(--lok); } .loot-root .l-ro small { font-size: 10.5px; color: var(--lgrey); }
.loot-root .l-btn.main { padding: 15px; font-size: 15px; background: var(--lred); border-color: var(--lred); color: #fff; } .loot-root .l-btn.main.ok { background: var(--lok); border-color: var(--lok); color: #06110a; }
.loot-root .l-hl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .loot-root .l-hl .l-btn { display: flex; flex-direction: column; gap: 2px; padding: 10px 8px; } .loot-root .l-hl .l-btn small { font-size: 10.5px; color: var(--lgrey); font-weight: 400; }
.loot-root .l-cpanel .l-msg { margin-top: 0; }
.loot-root .l-tiles, .loot-root .l-tower, .loot-root .l-dec, .loot-root .l-weekly { display: grid; gap: 8px; direction: ltr; }
.loot-root .l-tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 400px; width: 100%; gap: 10px; }
.loot-root .l-tower { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 360px; width: 100%; gap: 6px; }
.loot-root .l-dec { grid-template-columns: repeat(6, minmax(0, 1fr)); max-width: 440px; width: 100%; }
.loot-root .l-weekly { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 320px; width: 100%; }
.loot-root .l-tile { width: auto; height: auto; min-width: 0; aspect-ratio: 1; padding: 0; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); background: #121215; font: 12px var(--mono); color: #5a5a5a; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: border-color .12s, transform .12s, color .12s; }
@media (hover: hover) and (pointer: fine) { .loot-root .l-tile:hover:not(.done):not(:disabled) { transform: translateY(-2px); border-color: #fff; color: #fff; } }
.loot-root .l-tile.safe { background: rgba(61,220,132,.06); border-color: var(--lok); color: var(--lok); font-size: 13px; font-weight: 800; }
.loot-root .l-tile.mine { background: var(--lred); border-color: var(--lred); color: #fff; font-size: 18px; font-weight: 800; }
.loot-root .l-tile.dim { opacity: .35; } .loot-root .l-tile.done { cursor: default; }
.loot-root .l-tile.pick { border-color: #fff; color: #fff; background: rgba(255,255,255,.06); } .loot-root .l-tile.hit { background: rgba(61,220,132,.06); border-color: var(--lok); color: var(--lok); font-weight: 800; }
.loot-root .l-tile.cur { border-color: var(--lred); box-shadow: inset 0 0 0 1px var(--lred); color: #9a9a9a; }
.loot-root .l-tower .l-tile { aspect-ratio: 2.2 / 1; }
.loot-root .l-dec .l-tile { aspect-ratio: 1 / 1.15; font-size: 14px; font-weight: 800; color: #8a8a8f; }
.loot-root .l-weekly .l-tile { font-size: 14px; } .loot-root .l-key .l-tile { font-size: 24px; font-weight: 800; color: #8a8a8f; }
.loot-root .l-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.loot-root .l-recent { font-size: 12px; color: var(--lgrey); margin-top: 12px; line-height: 1.7; } .loot-root .l-recent b { color: #fff; } .loot-root .l-recent .w { color: var(--lok); } .loot-root .l-recent .x { color: var(--lred); }
.loot-root table.l-odds { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 8px; } .loot-root table.l-odds th, .loot-root table.l-odds td { text-align: left; padding: 6px 8px; border-bottom: 1px solid rgba(255,255,255,.07); } .loot-root table.l-odds th { color: var(--lgrey); font-weight: 600; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; }
.loot-root details.l-rules summary { cursor: pointer; color: var(--lgrey); font-size: 12.5px; margin-top: 6px; } .loot-root details.l-rules .l-p { margin-top: 10px; }
.loot-root .l-toggle { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--link); cursor: pointer; font-family: var(--body, system-ui, sans-serif); }
.loot-root .l-toggle input { width: auto; }
[dir="rtl"] .loot-root .l-bar .r { margin-left: 0; margin-right: auto; } [dir="rtl"] .loot-root .l-bar .t { margin-left: 0; margin-right: 8px; }
@media (prefers-reduced-motion: reduce) { .loot-root .l-reel.spin { transition-duration: .01s; } .loot-root .l-case.zd .num, .loot-root .l-case .st.ok, .loot-root .l-item.zd::before, .loot-root .l-item.zd .tp { animation: none; } }

.loot-root .l-banner { display: flex; align-items: center; gap: 16px; padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, rgba(255,68,51,.14), rgba(0,0,0,.35)); border: 1px solid rgba(255,68,51,.35); color: inherit; text-decoration: none; margin: 4px 0 24px; transition: border-color .2s, transform .2s; }
.loot-root .l-banner:hover { border-color: rgba(255,68,51,.7); transform: translateY(-2px); }
.loot-root .l-banner-ic { width: 44px; height: 44px; flex: 0 0 44px; color: var(--lred); filter: drop-shadow(0 0 8px rgba(255,68,51,.7)); } .loot-root .l-banner-ic svg { width: 100%; height: 100%; }
.loot-root .l-banner-t { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; } .loot-root .l-banner-t b { font-size: 15px; color: #fff; } .loot-root .l-banner-t span { font-size: 13px; color: var(--link); font-family: var(--body, system-ui, sans-serif); line-height: 1.45; }
.loot-root .l-banner .l-btn { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 640px) { .loot-root .l-banner { flex-wrap: wrap; } .loot-root .l-banner .l-btn { width: 100%; text-align: center; } }

.loot-root .l-topup { border: 1px solid rgba(255,68,51,.4); background: linear-gradient(160deg, rgba(255,68,51,.1), rgba(0,0,0,.3)); border-radius: 16px; padding: 18px 20px; box-shadow: 0 0 40px rgba(255,68,51,.08); }
.loot-root .l-topup-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.loot-root .l-topup-head #lTopupTitleHours { color: var(--lred); }
.loot-root .l-presets { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin: 12px 0; }
.loot-root .l-presets button { font-family: var(--mono); background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 10px 8px; color: #fff; cursor: pointer; display: flex; flex-direction: column; gap: 2px; align-items: center; transition: border-color .15s, transform .15s; }
.loot-root .l-presets button b { font-size: 15px; } .loot-root .l-presets button span { font-size: 11px; color: var(--lgrey); }
.loot-root .l-presets button:hover { transform: translateY(-2px); border-color: rgba(255,68,51,.5); } .loot-root .l-presets button.on { border-color: var(--lred); background: rgba(255,68,51,.14); box-shadow: 0 0 14px rgba(255,68,51,.25); }

.cases-page .dash-hint, .cases-page .dash-picker, .cases-page #pickerLoading, .cases-page #pickerError, .cases-page #serverGrid, .cases-page #serverGridEmpty, .cases-page .dash-sub-panel, .cases-page .dash-guide-panel { display: none !important; }

.loot-root .l-big { display: flex; align-items: baseline; gap: 10px; margin: 6px 0 8px; } .loot-root .l-big b { font-size: 44px; font-weight: 800; letter-spacing: -1px; line-height: 1; } .loot-root .l-big span { color: var(--lgrey); font-size: 13px; }
.loot-root .l-hist { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.loot-root .l-hrow { display: grid; grid-template-columns: 96px 1fr 1fr auto; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.06); } .loot-root .l-hrow > span:first-child { color: var(--lgrey); } .loot-root .l-hrow .w { color: var(--lok); } .loot-root .l-hrow .x { color: var(--lred); } .loot-root .l-hrow a { color: var(--lred); }
@media (max-width: 560px) { .loot-root .l-hrow { grid-template-columns: 1fr 1fr; } }
.loot-root .l-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-radius: 12px; background: rgba(255,68,51,.07); border: 1px solid rgba(255,68,51,.3); font-size: 13px; } .loot-root .l-strip b { color: #fff; } .loot-root .l-strip a { text-decoration: none; }

.loot-root .l-bytebox { display: flex; flex-direction: column; align-items: center; gap: 12px; width: 100%; }
.loot-root .l-byte-cur { min-width: 240px; font-size: 72px; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: #fff; text-align: center; padding: 28px 30px; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; background: #121215; }
.loot-root .l-byte-hist { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; direction: ltr; } .loot-root .l-byte-hist span { font-size: 11px; padding: 4px 8px; border-radius: 6px; border: 1px solid rgba(255,255,255,.12); color: #c9c9c9; } .loot-root .l-byte-hist span.cur { color: #fff; border-color: rgba(255,255,255,.4); } .loot-root .l-byte-hist span.x { color: var(--lred); border-color: rgba(255,68,51,.4); }

.loot-root .l-topup-cta { display: flex; align-items: center; gap: 14px; width: 100%; margin: 0 0 14px; padding: 16px 20px; border: 1px solid rgba(255,68,51,.55); border-radius: 14px; background: linear-gradient(120deg, #e2362a, #ff4433 55%, #ff6a5b); color: #fff; font: inherit; text-align: start; cursor: pointer; box-shadow: 0 10px 30px rgba(255,68,51,.28), inset 0 1px 0 rgba(255,255,255,.18); transition: transform .12s, box-shadow .12s; }
.loot-root .l-topup-cta:hover { transform: translateY(-1px); box-shadow: 0 14px 36px rgba(255,68,51,.38), inset 0 1px 0 rgba(255,255,255,.18); }
.loot-root .l-topup-cta .ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px; background: rgba(0,0,0,.28); display: grid; place-items: center; font-size: 24px; font-weight: 800; line-height: 1; }
.loot-root .l-topup-cta .tx { font-size: 20px; font-weight: 800; letter-spacing: -.2px; }
.loot-root .l-topup-cta .sub { margin-inline-start: auto; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; opacity: .9; white-space: nowrap; }
@media (max-width: 640px) { .loot-root .l-topup-cta { flex-wrap: wrap; padding: 14px 16px; } .loot-root .l-topup-cta .sub { margin-inline-start: 0; flex-basis: 100%; white-space: normal; } }
.loot-root #lTopupSec.flash .l-topup { animation: l-flash 1.2s ease-out; }
@keyframes l-flash { 0% { box-shadow: 0 0 0 3px rgba(255,68,51,.7); } 100% { box-shadow: 0 0 0 0 rgba(255,68,51,0); } }

.loot-root .pf { display: grid; grid-template-columns: 250px 1fr; }
.loot-root .pf-id { padding: 20px; border-inline-end: 1px solid rgba(255,255,255,.07); background: radial-gradient(circle at 20% 0%, rgba(255,68,51,.16), transparent 60%); }
.loot-root .pf-emblem { width: 72px; height: 72px; border-radius: 18px; display: grid; place-items: center; font-size: 24px; font-weight: 800; color: #06110a; position: relative; margin-bottom: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.5); letter-spacing: -.5px; }
.loot-root .pf-emblem::after { content: ''; position: absolute; inset: -5px; border-radius: 22px; border: 1px dashed rgba(255,255,255,.25); }
.loot-root .pf-handle { font-size: 18px; font-weight: 800; word-break: break-all; } .loot-root .pf-handle em { font-style: normal; color: #6d6a6a; font-weight: 400; }
.loot-root .pf-rank { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; font-weight: 700; } .loot-root .pf-rank i { width: 8px; height: 8px; border-radius: 2px; flex: 0 0 auto; } .loot-root .pf-rank span { color: #6d6a6a; font-weight: 400; }
.loot-root .pf-edit { margin-top: 16px; font: inherit; font-size: 11.5px; color: var(--lred); background: none; border: 1px dashed rgba(255,68,51,.35); border-radius: 7px; padding: 6px 9px; cursor: pointer; text-align: start; direction: ltr; } .loot-root .pf-edit span { color: #6d6a6a; }
.loot-root .pf-form { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; } .loot-root .pf-form .l-row { gap: 6px; } .loot-root .pf-form input { width: 150px; direction: ltr; }
.loot-root .pf-body { padding: 16px 20px 18px; display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.loot-root .pf-row { display: grid; grid-template-columns: 70px 1fr; gap: 12px; align-items: baseline; } .loot-root .pf-row .k { color: #6d6a6a; font-size: 11.5px; } .loot-root .pf-row .v { color: #ddd; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.loot-root .pf-ascii { font-size: 12px; letter-spacing: -1px; color: #3a3535; direction: ltr; unicode-bidi: isolate; } .loot-root .pf-ascii b { color: var(--lred); font-weight: 400; text-shadow: 0 0 8px rgba(255,68,51,.6); } .loot-root .pf-ascii.sm { font-size: 10px; }
.loot-root .pf-num { color: #fff; font-weight: 800; font-size: 15px; } .loot-root .pf-dim { color: #6d6a6a; } .loot-root .pf-g { color: var(--lgreen, #3ddc84); } .loot-root .pf-a { color: #ffa24d; }
.loot-root .pf-sep { height: 1px; background: rgba(255,255,255,.07); margin: 4px 0; }
.loot-root .pf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 18px; }
.loot-root .pf-cell { display: flex; flex-direction: column; gap: 2px; } .loot-root .pf-cell .k { color: #6d6a6a; font-size: 11px; } .loot-root .pf-cell .big { font-size: 20px; font-weight: 800; letter-spacing: -.5px; line-height: 1.15; color: #fff; } .loot-root .pf-cell .big.g { color: var(--lgreen, #3ddc84); } .loot-root .pf-cell .sub { color: var(--lgrey); font-size: 11px; }
.loot-root .pf-bd { font-size: 11px; padding: 3px 8px; border-radius: 6px; border: 1px solid rgba(255,255,255,.12); color: #ddd; } .loot-root .pf-bd i { display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-inline-end: 6px; } .loot-root .pf-bd.lock { color: #6d6a6a; border-style: dashed; }
.loot-root .pf-src { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; color: var(--lgrey); } .loot-root .pf-src b { color: #fff; font-weight: 700; }
@media (max-width: 760px) { .loot-root .pf { grid-template-columns: 1fr; } .loot-root .pf-id { border-inline-end: 0; border-bottom: 1px solid rgba(255,255,255,.07); } .loot-root .pf-grid { grid-template-columns: repeat(2, 1fr); } .loot-root .pf-row { grid-template-columns: 56px 1fr; } }

.loot-root .pf-emblem.av { background: radial-gradient(circle at 50% 30%, #2a2223, #0d0b0c 70%); overflow: hidden; }
.loot-root .pf-emblem.av svg { transform: translateY(3px); }

.loot-root .pf-form[hidden] { display: none; }

@media (max-width: 760px) { .loot-root .l-gp { grid-template-columns: 1fr; } .loot-root .l-cpanel { border-inline-start: 0; border-top: 1px solid rgba(255,255,255,.12); } .loot-root .l-canvas { min-height: 0; padding: 62px 14px 44px; } }
@media (max-width: 560px) {
  .loot-root .l-tiles { gap: 6px; } .loot-root .l-dec { gap: 5px; } .loot-root .l-dec .l-tile { font-size: 12px; }
  .loot-root .l-byte-cur { font-size: 48px; min-width: 0; padding: 20px 24px; }
  .loot-root .l-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .loot-root .l-case { padding: 12px; min-height: 0; } .loot-root .l-case .num { font-size: 36px; } .loot-root .l-case .num small { display: block; margin: 5px 0 0; } .loot-root .l-case .slot { height: 64px; } .loot-root .l-case .slot.open span { font-size: 15px; } .loot-root .l-case .t { font-size: 14px; } .loot-root .l-case .slot.sealed span { font-size: 15px; letter-spacing: .2em; }
}

.loot-root .l-pinfo, .loot-root .l-dock, .loot-root .l-drow, .loot-root .l-drow2 { display: contents; }
.loot-root .l-cpanel .l-p { order: 0; } .loot-root .l-stake { order: 1; } .loot-root .l-param { order: 2; } .loot-root .l-cpanel .l-ro { order: 3; } .loot-root .l-cpanel .l-hl { order: 4; } .loot-root .l-cpanel #lMain { order: 5; } .loot-root .l-alt { order: 6; } .loot-root .l-cpanel .l-msg { order: 7; }
.loot-root .l-stp { display: none; } .loot-root .l-alt svg { display: none; }
@media (max-width: 760px) {
  .loot-root .l-term.l-cases { border: 0; border-radius: 0; box-shadow: none; background: none; overflow: visible; }
  .loot-root .l-cases > .l-bar { padding: 0 0 4px; background: none; border: 0; }
  .loot-root .l-cases > .l-bar .l-dot, .loot-root .l-cases > .l-bar .r { display: none; }
  .loot-root .l-cases > .l-bar .t { margin: 0; font-size: 11.5px; color: #5d5a5b; }
  .loot-root .l-cases > .l-body { padding: 0; }
  .loot-root .l-cases .l-strip { padding: 0; border: 0; border-radius: 0; background: none; }
  .loot-root .l-cases .l-card { border: 0; border-radius: 0; background: none; padding: 16px 0 0; border-top: 1px solid rgba(255,255,255,.08); }
  .loot-root .l-cases #lGames.l-card { border-top: 0; padding-top: 8px; }

  .loot-root .l-ginv { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; margin: 0 calc(50% - 50vw) 10px; padding: 0 calc(50vw - 50%); }
  .loot-root .l-ginv::-webkit-scrollbar { display: none; }
  .loot-root .l-gcard { flex: 0 0 auto; flex-direction: row; align-items: center; gap: 7px; height: 44px; padding: 0 14px; border: 0; border-radius: 22px; background: none; }
  .loot-root .l-gcard:hover { transform: none; }
  .loot-root .l-gcard .num { font-size: 11px; font-weight: 700; letter-spacing: 0; color: #6d6a6a; }
  .loot-root .l-gcard .num small, .loot-root .l-gcard .mini, .loot-root .l-gcard .s { display: none; }
  .loot-root .l-gcard .t { font-size: 14px; font-weight: 600; color: var(--lgrey); white-space: nowrap; }
  .loot-root .l-gcard.on { background: #1b181a; } .loot-root .l-gcard.on .t { color: #fff; } .loot-root .l-gcard.on .num { color: var(--lred); }
  .loot-root .l-gcard .st { position: static; width: 6px; height: 6px; box-shadow: none; }

  .loot-root .l-gp { border: 0; border-radius: 0; overflow: visible; background: none; }
  .loot-root .l-canvas { min-height: 0; padding: 0; background: none; align-items: stretch; }
  .loot-root .l-ctop { position: static; flex-direction: row; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
  .loot-root .l-cbot { position: static; margin-top: 10px; }
  .loot-root .l-tiles, .loot-root .l-tower, .loot-root .l-dec { max-width: none; margin-inline: auto; }
  .loot-root .l-tiles { gap: 8px; }
  .loot-root .l-dec { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .loot-root .l-dec .l-tile { font-size: 14px; }
  .loot-root .l-tower .l-tile { aspect-ratio: auto; height: 44px; }
  .loot-root .l-byte-cur { border: 0; background: none; padding: 12px 0; }

  .loot-root .l-cpanel { padding: 0; border: 0; background: none; gap: 0; }
  .loot-root .l-pinfo { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
  .loot-root .l-pinfo .l-p { margin: 0; }
  .loot-root .l-ro { gap: 12px; } .loot-root .l-ro > div { border: 0; border-radius: 0; padding: 0; } .loot-root .l-ro b { font-size: 22px; }

  .loot-root .l-dock { display: flex; flex-direction: column; gap: 10px; position: sticky; bottom: 0; z-index: 6; margin: 12px calc(50% - 50vw) 0; padding: 10px calc(50vw - 50%) calc(12px + env(safe-area-inset-bottom)); background: rgba(5,5,5,.94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid rgba(255,255,255,.1); }
  .loot-root .l-drow { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
  .loot-root .l-drow2 { display: flex; gap: 8px; }
  .loot-root .l-dock .l-f { gap: 4px; }
  .loot-root .l-stake .l-lbl, .loot-root .l-stake .l-inrow, .loot-root .l-stake .l-sub { display: none; }
  .loot-root .l-stp { display: flex; align-items: center; gap: 6px; }
  .loot-root .l-sq { width: 48px; height: 48px; padding: 0; font-size: 22px; border-radius: 12px; color: #fff; border-color: rgba(255,255,255,.18); background: #141215; }
  .loot-root .l-sv { display: flex; flex-direction: column; align-items: center; min-width: 64px; }
  .loot-root .l-sv small { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--lgrey); }
  .loot-root .l-sv b { font-size: 17px; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .loot-root .l-param .l-seg3 { padding: 0; border: 0; gap: 4px; }
  .loot-root .l-param .l-seg3 button { min-width: 44px; height: 44px; padding: 0 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; }
  .loot-root .l-param .l-seg3 button.on { border-color: var(--lred); }
  .loot-root .l-dock .l-hl .l-btn { min-height: 56px; }
  .loot-root .l-dock #lMain { flex: 1; min-width: 0; min-height: 56px; border-radius: 14px; }
  .loot-root .l-alt { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 56px; min-height: 56px; padding: 0; border-radius: 14px; background: #141215; border: 1px solid rgba(255,255,255,.14); color: #fff; cursor: pointer; }
  .loot-root .l-alt svg { display: block; width: 22px; height: 22px; } .loot-root .l-alt span { display: none; }
  .loot-root .l-alt:disabled { opacity: .35; cursor: default; }

  .loot-root .l-cpanel .l-dock .l-param, .loot-root .l-cpanel .l-dock .l-hl, .loot-root .l-cpanel .l-dock .l-alt { order: 0; }
  .loot-root .l-cpanel .l-dock .l-stake, .loot-root .l-cpanel .l-dock #lMain { order: 1; }
  .loot-root .l-cpanel .l-dock .l-stake { margin-inline-start: auto; }

  .loot-root .l-gp { display: block; }
  .loot-root .l-cpanel { display: contents; }
}

.loot-root .l-canvas { position: relative; }
.loot-root .l-gp.is-idle .l-tiles, .loot-root .l-gp.is-idle .l-tower, .loot-root .l-gp.is-idle .l-bytebox { opacity: .32; filter: saturate(.5); }
.loot-root .l-gp.is-idle .l-tile { color: transparent; }
.loot-root .l-startover { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3; display: inline-flex; align-items: center; gap: 8px; padding: 15px 24px; border-radius: 999px; border: 1px solid var(--lred); background: rgba(10,10,12,.92); color: #fff; font: 800 15px var(--mono); white-space: nowrap; cursor: pointer; box-shadow: 0 0 0 6px rgba(255,68,51,.12), 0 12px 30px rgba(0,0,0,.5); }
.loot-root .l-startover:active { transform: translate(-50%, -50%) scale(.97); }
.loot-root .l-startover:focus-visible { outline: 2px solid var(--lred); outline-offset: 3px; }
.loot-root .l-gp.is-live .l-ctop b::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-inline-end: 8px; border-radius: 50%; background: var(--lok); vertical-align: 2px; animation: lpulse 2s infinite; }
.loot-root .l-gp.just-started .l-tiles, .loot-root .l-gp.just-started .l-tower, .loot-root .l-gp.just-started .l-bytebox { animation: llive .35s ease-out; }
@keyframes llive { from { opacity: .32; } to { opacity: 1; } }
.loot-root .l-tile:active:not(.done) { transform: scale(.95); }
.loot-root .l-tile.pend:not(.safe):not(.mine) { border-color: #fff; color: #fff; animation: lpend .7s ease-in-out infinite; }
.loot-root .l-btn.pend { animation: lpendb .7s ease-in-out infinite; cursor: progress; }
@keyframes lpend { 50% { border-color: rgba(255,255,255,.3); } }
@keyframes lpendb { 50% { filter: brightness(.8); } }
@media (prefers-reduced-motion: reduce) { .loot-root .l-gp.is-live .l-ctop b::before, .loot-root .l-gp.just-started .l-tiles, .loot-root .l-gp.just-started .l-tower, .loot-root .l-gp.just-started .l-bytebox, .loot-root .l-tile.pend, .loot-root .l-btn.pend { animation: none; } }
.loot-root .pf2 { --p2-card: #141213; --p2-line: rgba(255,255,255,.10); --p2-text: #F2F0F0; --p2-muted: #A8A2A2; --p2-soft: rgba(255,255,255,.04); --p2-off: rgba(255,255,255,.12); --p2-red: #FF4433; --p2-green: #3DDC84;
  display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; padding: 28px; border-radius: 18px; background: var(--p2-card); border: 1px solid var(--p2-line); color: var(--p2-text); font-family: var(--sans, inherit); }
html[data-theme="light"] .loot-root .pf2 { --p2-card: #FFFFFF; --p2-line: #E6E2E2; --p2-text: #141212; --p2-muted: #6A6464; --p2-soft: #F6F5F5; --p2-off: #E3DFDF; --p2-red: #E5231B; --p2-green: #12803F; box-shadow: 0 20px 50px rgba(60,20,20,.07); }
.loot-root .pf2-id { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; min-width: 0; }
.loot-root .pf2-av { width: 104px; height: 104px; border-radius: 24px; background: var(--p2-soft); border: 1px solid var(--p2-line); display: grid; place-items: center; }
.loot-root .pf2-av svg { width: 56px; height: auto; }
.loot-root .pf2-nm { font: 700 18px var(--mono); overflow-wrap: anywhere; }
.loot-root .pf2-lv { display: flex; align-items: center; gap: 10px; }
.loot-root .pf2-lv b { font: 800 30px var(--mono); line-height: 1; }
.loot-root .pf2-steps { display: flex; gap: 4px; flex-wrap: wrap; }
.loot-root .pf2-steps i, .loot-root .pf2-next i { width: 14px; height: 14px; background: var(--p2-off); display: inline-block; }
.loot-root .pf2-steps i.on, .loot-root .pf2-next i.on { background: var(--p2-red); }
.loot-root .pf2-edit { margin-top: 4px; font: 600 12.5px var(--sans, inherit); color: var(--p2-muted); background: none; border: 1px solid var(--p2-line); border-radius: 10px; padding: 8px 12px; cursor: pointer; }
.loot-root .pf2-edit:hover { color: var(--p2-text); border-color: var(--p2-text); }
.loot-root .pf2 .pf-form { width: 100%; }
.loot-root .pf2-main { min-width: 0; }
.loot-root .pf2-xp { display: flex; flex-direction: column; gap: 10px; }
.loot-root .pf2-xprow { display: flex; justify-content: space-between; align-items: center; font: 600 13px var(--mono); color: var(--p2-muted); }
.loot-root .pf2-xprow b { color: var(--p2-text); font-size: 15px; }
.loot-root .pf2-next { display: inline-flex; align-items: center; gap: 6px; }
.loot-root .pf2-next svg { width: 16px; height: 16px; color: var(--p2-red); }
.loot-root .pf2-bar { height: 12px; border-radius: 6px; background: var(--p2-off); overflow: hidden; }
.loot-root .pf2-bar i { display: block; height: 100%; background: var(--p2-red); border-radius: 6px; }
.loot-root .pf2-how { display: flex; gap: 8px; flex-wrap: wrap; }
.loot-root .pf2-how span { padding: 7px 12px; border-radius: 999px; background: var(--p2-soft); font: 600 13px var(--sans, inherit); }
.loot-root .pf2-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.loot-root .pf2-t { border: 1px solid var(--p2-line); border-radius: 14px; padding: 14px 16px; display: flex; gap: 12px; align-items: center; min-width: 0; }
.loot-root .pf2-ic { width: 28px; height: 28px; flex: none; }
.loot-root .pf2-t .v { font: 800 22px var(--mono); line-height: 1.15; overflow-wrap: anywhere; }
.loot-root .pf2-t .s { font: 500 12.5px var(--sans, inherit); color: var(--p2-muted); }
.loot-root .pf2-t.g .v, .loot-root .pf2-t.g .pf2-ic { color: var(--p2-green); }
.loot-root .pf2-dots { display: flex; gap: 4px; margin-top: 5px; }
.loot-root .pf2-dots i { width: 10px; height: 10px; border-radius: 3px; background: var(--p2-off); }
.loot-root .pf2-dots i.on { background: var(--p2-red); }
.loot-root .pf2-badges { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.loot-root .pf2-bd { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; border: 1px solid var(--p2-line); background: var(--p2-soft); color: var(--p2-off); }
.loot-root .pf2-bd svg { width: 22px; height: 22px; }
.loot-root .pf2-bd.on { border-color: currentColor; }
.pf2-mini svg { width: 18px; height: auto; }
.cab-rank .rk.pf2-mini { background: transparent !important; }
.cab-rank .pf2-lvn { min-width: 20px; height: 20px; padding: 0 5px; display: inline-grid; place-items: center; background: #FF4433; color: #fff; font: 700 11px var(--mono); }
@media (max-width: 720px) {
  .loot-root .pf2 { grid-template-columns: 1fr; padding: 20px; gap: 22px; }
  .loot-root .pf2-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-term { --white: #141212; --grey: #5F5959; --lt-l10: #E6E2E2; --lt-l12: #E2DEDE; --lt-l14: #DEDADA; --lt-l35: #BDB7B7; background: #FFFFFF !important; color: #141212 !important; border-color: #E6E2E2 !important; box-shadow: 0 20px 50px rgba(60,20,20,.07) !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-bar { background: #F6F5F5 !important; color: #5F5959 !important; border-color: #E6E2E2 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-bar .r, html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-bar .r * { color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-card { background: #FFFFFF !important; border-color: #E6E2E2 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-term input:not([type="checkbox"]):not([type="radio"]) { background: #F7F6F6 !important; border-color: #DEDADA !important; color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root a.l-btn:not(.pri):not(.ok), html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root button.l-btn:not(.pri):not(.ok):not(.main) { background: #FFFFFF !important; color: #141212 !important; border-color: #CFC9C9 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-btn.ok { background: #E8F6EE !important; color: #12803F !important; border-color: #9ED8B6 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup { background: linear-gradient(160deg, #FFF4F2, #FFFFFF) !important; border-color: #F2B8B3 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-presets button { background: #FFFFFF !important; color: #141212 !important; border-color: #DEDADA !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root :is(.l-empty, .l-muted, .l-big span, .l-note) { color: #6A6464 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-h, html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-term [style*="color:#fff"] { color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-p { color: #4F4A4A !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-presets span:not([class]), html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup .l-row span:not([class]) { color: #5F5959 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-strip { background: #FFF4F2 !important; border-color: #F2B8B3 !important; color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-gp { background: #FFFFFF !important; border-color: #E6E2E2 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-cpanel { background: #FAFAFA !important; border-color: #E6E2E2 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .slot { background: #F6F5F5 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .mark { background: rgba(0,0,0,.06) !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root details.l-rules { border-color: #E6E2E2 !important; color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-term { --lok: #12803F; --lgrey: #6A6464; }
.loot-root .l-hist2 { gap: 0; font-size: 13.5px; }
.loot-root .l-hrow.l-hrow2 { grid-template-columns: 70px minmax(0, 1fr) auto; padding: 10px 0; }
.loot-root .l-hrow2 .d { color: var(--lgrey, #9A9A9A); font-family: var(--mono); font-size: 12.5px; }
.loot-root .l-hrow2 b { font-family: var(--mono); text-align: end; white-space: nowrap; }
.loot-root .l-hmore { margin-top: 10px; }
@media (max-width: 560px) { .loot-root .l-hrow.l-hrow2 { grid-template-columns: 58px minmax(0, 1fr) auto; } }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-hrow { border-bottom-color: #EEEAEA !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-term { --lred: #C81E17; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup-cta { background: #141212 !important; border-color: #141212 !important; color: #FFFFFF !important; box-shadow: 0 10px 26px rgba(0,0,0,.12) !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup-cta .ic { background: #FF4433 !important; color: #FFFFFF !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup-cta .sub { color: #D9D4D4 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-strip .l-btn.pri, html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root #lTopupGo, html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-topup .l-btn.pri { background: #141212 !important; background-image: none !important; color: #FFFFFF !important; border-color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-streak i { background: #E3DFDF !important; box-shadow: none !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-streak i.on { background: #E5231B !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-streak i.next { background: #FFD9D4 !important; outline: 1px dashed #E5231B; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-gcard { background: #FFFFFF !important; border: 1.5px solid #A9A3A3 !important; color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-gcard.on { border-color: #E5231B !important; box-shadow: 0 0 0 1px #E5231B inset !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .mini { background: #F3F1F1 !important; border-color: #CFC9C9 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .mini i { background: #B9B3B3 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-gp { border: 1.5px solid #A9A3A3 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-canvas { background: #F6F5F5 !important; background-image: none !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-tile:not(.hit):not(.mine):not(.safe):not(.pick):not(.cur) { background: #FFFFFF !important; border: 1.5px solid #B9B3B3 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-startover { background: rgba(255,255,255,.88) !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-cpanel { border-color: #CFC9C9 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case { background: #FFFFFF !important; border: 1.5px solid #A9A3A3 !important; color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .t { color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .s, html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .num small { color: #5F5959 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot { background: #F3F1F1 !important; border: 1.5px solid #CFC9C9; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot.sealed { background: repeating-linear-gradient(-45deg, #F3F1F1 0 6px, #E9E6E6 6px 12px) !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot span { color: #3A3535; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot.open span { color: #141212; font-size: 17px !important; line-height: 1.2; text-align: center; padding: 0 8px; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot.unl { border-color: #12803F !important; box-shadow: inset 0 0 0 1px #12803F !important; background: #EEF8F2 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .slot.unl span { color: #12803F !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .inside span { color: #3A3535 !important; border-color: #BDB7B7 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-case .act .l-btn { background: #141212 !important; color: #FFFFFF !important; border-color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-item { background: #FFFFFF !important; border: 1.5px solid #A9A3A3 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-item .nm { color: #141212 !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-inv > * { background: #FFFFFF !important; border: 1.5px solid #A9A3A3 !important; color: #141212 !important; } html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-inv > * * { color: inherit !important; }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-tile:not(.hit):not(.mine):not(.safe):not(.pick):not(.cur) { background: linear-gradient(150deg, #FFFFFF 0%, #FBEDEB 45%, #F2CFCB 100%) !important; border-color: #D9B5B1 !important; box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 2px 6px rgba(60,20,20,.06) !important; }
@media (hover: hover) and (pointer: fine) { html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .l-tile:not(.hit):not(.mine):not(.safe):not(.pick):not(.cur):not(.done):hover { background: linear-gradient(160deg, #FFFFFF 0%, #FFE9E6 60%, #FFD3CD 100%) !important; border-color: #E5231B !important; } }
html[data-theme="light"] body:has(.cab-tabs a.on:is([href="balance.html"], [href="cases.html"])) .loot-root .mini i { background: linear-gradient(160deg, #D9D2D2, #B9AFAF) !important; }