:root{
  /* === Sweden Code paletė (swedencode.lt) === */
  --void:#060A12;
  --panel:rgba(11,18,32,.80);     /* #0B1220 */
  --panel2:rgba(14,23,41,.72);    /* #0E1729 */
  --stroke:rgba(140,170,255,.10);
  --stroke2:rgba(140,170,255,.20);
  --text:#EAF0F7;
  --muted:#8295AC;

  --accent:#ffd24a;     /* SWGC auksas (Sweden Code paletėje) */
  --accent2:#f0b323;
  --money:#F4C45F;
  --cyan:#56E6FF;       /* interaktyvus akcentas (nav/links) */
  --discord:#5865F2;

  /* rarities (CS2 unbox) */
  --paprastas:#4b69ff;
  --retas:#8847ff;
  --epikas:#d32ce6;
  --legendinis:#eb4b4b;
  --auksinis:#ffd700;

  /* Sweden Code node spalvos */
  --samp:#4DA3FF;    /* SFG (SA-MP) — mėlyna */
  --cs16:#35E0A1;    /* CS 1.6 ZM — žalia (sukeista 2026-06-23) */

  --radius:2px;
  --clip-panel: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);

  --font-display:'Chakra Petch','Segoe UI',system-ui,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono','Cascadia Code',Consolas,ui-monospace,monospace;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family: var(--font-body);
  color:var(--text);
  background-color:var(--void);
  background-image:
    radial-gradient(1100px 560px at 72% 8%, rgba(75,105,255,.10), transparent 55%),
    radial-gradient(900px 520px at 18% 92%, rgba(255,210,74,.07), transparent 55%),
    linear-gradient(180deg, #0b0e14, #0a0c12);
  min-height:100vh;
  overflow-x:hidden;
}
/* backgroundunboxing.png kaip viso puslapio fonas */
.bgFx{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:url("/assets/background.jpg") center center / cover no-repeat;
  filter: saturate(1.03);
}
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    linear-gradient(180deg, rgba(6,10,18,.46), rgba(3,6,12,.66)),
    radial-gradient(120% 90% at 50% 40%, transparent 52%, rgba(2,4,9,.6) 100%);
}

.wrap{ position:relative; z-index:1; width:min(1180px, 94vw); margin:0 auto; padding:26px 0 48px; }
.mt16{ margin-top:16px; }
.hideSm{ }

header{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
.brand{ display:flex; gap:12px; align-items:center; }
.logo{
  width:46px;height:46px;border-radius:10px;
  border:1px solid var(--stroke2);
  box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 0 1px rgba(255,210,74,.12) inset;
  background: radial-gradient(circle at 50% 30%, rgba(255,210,74,.12), transparent 60%), #141a24;
  background-image: url("icons/swgc.svg");
  background-size: 78%; background-position:center; background-repeat:no-repeat;
}
h1{ font-size:19px; margin:0; letter-spacing:1.2px; font-weight:800; text-transform:uppercase; }
.badge-pro{ font-size:10px; vertical-align:middle; background:linear-gradient(180deg,#ffe27a,#f0b323); color:#1a1407; padding:2px 7px; border-radius:6px; letter-spacing:1.5px; margin-left:6px; box-shadow:0 4px 12px rgba(240,179,35,.3); }
.sub{ font-size:12.5px; color:var(--muted); margin-top:3px; letter-spacing:.3px; }

.top-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.pill{ padding:8px 12px; border-radius:8px; background: var(--panel2); border:1px solid var(--stroke); color:var(--muted); font-size:12px; letter-spacing:.2px; display:flex; align-items:center; gap:6px; }
.pill.wallet{ color:var(--money); border-color:rgba(255,210,74,.30); font-weight:700; }
.pill.wallet .cur{ font-size:10px; opacity:.85; }
.pill.key{ color:var(--accent); border-color:rgba(255,210,74,.28); }
.pill.key .mono{ color:var(--accent); font-weight:700; }

.coin{ display:inline-block; width:16px; height:16px; vertical-align:-3px; background:url("icons/swgc.svg") center/contain no-repeat; }
.coin.sm{ width:13px; height:13px; vertical-align:-2px; }

.buykey{
  padding:6px 10px; border-radius:7px; cursor:pointer; font-weight:800; letter-spacing:.3px; font-size:10.5px; text-transform:uppercase;
  background:linear-gradient(180deg, rgba(255,210,74,.95), rgba(240,179,35,.95)); color:#1a1407; border:1px solid rgba(255,210,74,.6);
  transition: background .15s ease, transform .08s ease, opacity .15s ease; display:inline-flex; align-items:center; gap:5px;
}
.buykey:hover{ background:linear-gradient(180deg,#ffdd6a,#f6bd35); }
.buykey:active{ transform: translateY(1px); }
.buykey:disabled{ opacity:.4; cursor:not-allowed; }

/* Panels */
.card{ background: var(--panel); border:1px solid var(--stroke); border-radius: var(--radius); box-shadow: 0 22px 70px rgba(0,0,0,.45); overflow:hidden; backdrop-filter: blur(6px); }
.card-h{ padding:13px 16px; border-bottom:1px solid var(--stroke); display:flex; align-items:center; justify-content:space-between; gap:10px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)); }
.card-h b{ font-size:13px; letter-spacing:1.2px; text-transform:uppercase; }
.card-h-right{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.card-b{ padding:16px; }

.mini{ padding:6px 10px; border-radius:7px; cursor:pointer; font-size:11px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; background: rgba(255,255,255,.08); color:var(--text); border:1px solid var(--stroke2); transition: background .15s ease; }
.mini:hover{ background: rgba(255,255,255,.14); }
.mini.ghost{ background:transparent; color:var(--muted); }
.mini.ghost:hover{ color:var(--text); background:rgba(255,255,255,.06); }

/* ====== BOX STORE ====== */
.boxStore{ display:grid; grid-template-columns:repeat(auto-fit, minmax(190px,1fr)); gap:12px; }
.boxCard{ position:relative; border:1px solid var(--baFaint, var(--stroke2)); border-radius:12px; background:radial-gradient(120% 90% at 50% 0%, #1b2230, #0d1119 85%); padding:14px; cursor:pointer; transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease; overflow:hidden; }
.boxCard:hover{ transform:translateY(-3px); border-color:rgba(255,255,255,.22); box-shadow:0 16px 36px rgba(0,0,0,.5); }
.boxCard.active{ border-color:var(--ba, var(--accent)); box-shadow:0 0 0 1px var(--ba, var(--accent)), 0 18px 44px var(--baSoft, rgba(0,0,0,.5)), 0 14px 32px rgba(0,0,0,.42); }
.boxCard.active .boxTag{ display:block; }
.boxTag{ display:none; position:absolute; top:8px; right:8px; font-size:9px; font-weight:800; letter-spacing:1px; color:#0b0e14; background:var(--ba, var(--accent)); padding:3px 7px; border-radius:6px; z-index:3; }
.boxCard-glow{ position:absolute; left:50%; top:6px; width:140px; height:96px; transform:translateX(-50%); z-index:1; pointer-events:none; opacity:.26; mix-blend-mode:screen; filter:blur(7px);
  background: radial-gradient(closest-side, var(--ba, #ffd24a), transparent); }
.boxCard-art{ position:relative; z-index:2; height:90px; background:center/contain no-repeat; filter: drop-shadow(0 0 4px var(--ba, transparent)) drop-shadow(0 0 13px var(--baSoft, transparent)) drop-shadow(0 9px 12px rgba(0,0,0,.6)); margin-bottom:8px; }
.boxCard-name{ position:relative; z-index:2; font-weight:800; font-size:14px; letter-spacing:.3px; color:var(--ba, var(--text)); text-shadow:0 1px 10px var(--baSoft, transparent); }
.boxCard-sub{ position:relative; z-index:2; font-size:11px; color:var(--muted); margin-top:2px; }
.boxCard-badges{ position:relative; z-index:2; display:flex; gap:5px; margin:9px 0; flex-wrap:wrap; }
.boxCard-foot{ position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; }
.boxCard-price{ font-weight:800; color:var(--accent); font-size:13px; display:flex; align-items:center; gap:4px; }
.boxCard-own{ font-size:11px; color:var(--muted); }
.boxBuy{ padding:7px 11px; border-radius:7px; font-size:11px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; cursor:pointer; background:linear-gradient(180deg, rgba(255,210,74,.95), rgba(240,179,35,.95)); color:#1a1407; border:1px solid rgba(255,210,74,.6); }
.boxBuy:hover{ background:linear-gradient(180deg,#ffdd6a,#f6bd35); }
.boxBuy:disabled{ opacity:.45; cursor:not-allowed; }

/* server badges */
.serverBadges{ display:flex; gap:6px; flex-wrap:wrap; margin:7px 0; }
.srvBadge{ font-size:10px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; padding:2px 8px; border-radius:5px; border:1px solid currentColor; }
.srvBadge.big{ font-size:12px; padding:4px 12px; border-radius:7px; }

/* Box stage */
.box3d{ border-radius: 12px; background: radial-gradient(700px 260px at 30% 0%, rgba(75,105,255,.10), transparent 55%), radial-gradient(520px 240px at 85% 100%, rgba(255,210,74,.08), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); border:1px solid var(--baSoft, var(--stroke)); box-shadow:0 22px 60px -14px var(--baSoft, transparent); position:relative; overflow:hidden; padding:18px; }
.box3d .shine{ position:absolute; inset:-40% -10%; background: linear-gradient(120deg, transparent 42%, rgba(255,255,255,.10) 50%, transparent 58%); transform: rotate(15deg); animation: shine 5s ease-in-out infinite; pointer-events:none; }
@keyframes shine{ 0%{ transform: translateX(-22%) rotate(15deg); opacity:.20;} 50%{ transform: translateX(22%) rotate(15deg); opacity:.45;} 100%{ transform: translateX(-22%) rotate(15deg); opacity:.20;} }

.caseHead{ display:flex; align-items:center; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.caseArt{ position:relative; width:120px; height:90px; flex:0 0 auto; overflow:visible; background:transparent; border:0; box-shadow:none; }
.caseArt-img{ position:absolute; inset:0; z-index:2; background: center/contain no-repeat; filter: drop-shadow(0 0 4px var(--ba, transparent)) drop-shadow(0 0 13px var(--baSoft, transparent)) drop-shadow(0 9px 12px rgba(0,0,0,.6)); }
.caseArt-glow{ position:absolute; left:50%; top:6px; width:140px; height:96px; transform:translateX(-50%); z-index:1; pointer-events:none; opacity:.26; mix-blend-mode:screen; filter:blur(7px);
  background: radial-gradient(closest-side, var(--ba, #ffd24a), transparent); }
#activeBoxName{ color:var(--ba, var(--text)); text-shadow:0 1px 16px var(--baSoft, transparent); transition:color .15s ease; }
.caseInfo{ flex:1 1 240px; min-width:200px; }
.caseSeries{ color:var(--accent); letter-spacing:1.4px; font-size:11px; }
.caseInfo h2{ margin:4px 0 6px; font-size:18px; letter-spacing:.4px; font-weight:800; }
.caseInfo .hint{ font-size:12.5px; color:var(--muted); line-height:1.4; margin-top:4px; }
.caseInfo .hint b{ color:var(--accent); }

/* Buttons */
.btnRow{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; align-items:center; }
button{ appearance:none; border:0; cursor:pointer; border-radius: 8px; padding:12px 16px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; font-size:12.5px; background: rgba(255,255,255,.08); color:var(--text); border:1px solid var(--stroke2); transition: transform .08s ease, background .18s ease, opacity .18s ease, box-shadow .18s ease; user-select:none; }
button:hover{ background: rgba(255,255,255,.13); }
button:active{ transform: translateY(1px) scale(.99); }
button:disabled{ opacity:.45; cursor:not-allowed; }
.primary{ background: linear-gradient(180deg, rgba(255,210,74,.95), rgba(240,179,35,.95)); color:#1a1407; border:1px solid rgba(255,210,74,.65); box-shadow: 0 10px 26px rgba(240,179,35,.28), 0 0 0 1px rgba(255,255,255,.10) inset; }
.primary:hover{ background: linear-gradient(180deg, #ffdd6a, #f6bd35); }
.toggle.on{ border-color: rgba(98,210,140,.4); color:#bff3d2; }

/* ====== ROLLER ====== */
.rollerWrap{ margin-top:6px; border-radius: 12px; background: linear-gradient(180deg, rgba(0,0,0,.30), rgba(0,0,0,.45)), radial-gradient(120% 100% at 50% 0%, rgba(75,105,255,.06), transparent 60%); border:1px solid var(--stroke2); padding:18px 0; overflow:hidden; position:relative; box-shadow: inset 0 2px 24px rgba(0,0,0,.5); }
.rollerWrap::before, .rollerWrap::after{ content:""; position:absolute; top:0; bottom:0; width:120px; z-index:5; pointer-events:none; }
.rollerWrap::before{ left:0;  background: linear-gradient(90deg, rgba(8,10,15,.95), transparent); }
.rollerWrap::after{  right:0; background: linear-gradient(270deg, rgba(8,10,15,.95), transparent); }
.ticker{ position:absolute; top:6px; bottom:6px; left:50%; width:3px; z-index:6; background: linear-gradient(180deg, transparent, var(--accent) 12%, var(--accent) 88%, transparent); box-shadow: 0 0 16px rgba(255,210,74,.85), 0 0 40px rgba(255,210,74,.4); transform: translateX(-50%); pointer-events:none; }
.ticker::before, .ticker::after{ content:""; position:absolute; left:50%; width:0; height:0; border-left:9px solid transparent; border-right:9px solid transparent; filter: drop-shadow(0 0 6px rgba(255,210,74,.8)); }
.ticker::before{ top:-2px; transform: translate(-50%,-100%); border-top:13px solid var(--accent); }
.ticker::after{ bottom:-2px; transform: translate(-50%, 100%); border-bottom:13px solid var(--accent); }
.roller{ display:flex; gap:10px; align-items:center; will-change: transform; transform: translate3d(0,0,0); padding:0 10px; }

.csItem{ flex:0 0 158px; height:150px; position:relative; overflow:hidden; border-radius:7px; background:#15181f; border:1px solid rgba(255,255,255,.06); box-shadow:0 8px 20px rgba(0,0,0,.45); display:flex; align-items:flex-end; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; cursor:pointer; }
.csItem-bg{ position:absolute; inset:0; background: radial-gradient(120% 100% at 50% 0%, #1d2533, #0d1119 82%); }
.csItem-glow{ position:absolute; left:0; right:0; bottom:0; height:80%; z-index:1; pointer-events:none; }
.csItem-icon{ position:absolute; left:10px; right:10px; top:12px; bottom:34px; z-index:2; background-position:center; background-repeat:no-repeat; background-size:contain; filter: drop-shadow(0 6px 9px rgba(0,0,0,.55)); }
.csItem-srv{ position:absolute; top:8px; left:8px; z-index:3; font-size:9px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; padding:1px 6px; border-radius:4px; border:1px solid currentColor; background:rgba(0,0,0,.35); }
.csItem-name{ position:relative; z-index:3; width:100%; padding:0 9px 12px; font-size:11px; font-weight:700; letter-spacing:.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow: 0 1px 3px rgba(0,0,0,.9); }
.csItem-sub{ display:block; font-size:9.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; margin-bottom:1px; }
.csItem-bar{ position:absolute; left:0; right:0; bottom:0; height:5px; z-index:4; }
.csItem:hover{ transform: translateY(-3px); border-color: rgba(255,255,255,.16); box-shadow: 0 14px 30px rgba(0,0,0,.5); }

/* ====== Inline result ====== */
.result{ display:none; margin-top:16px; border-radius: 10px; background: rgba(0,0,0,.28); border:1px solid var(--stroke); padding:14px; }
.result.show{ display:block; animation: resultPop 480ms cubic-bezier(.12,.88,.12,1) both; }
@keyframes resultPop{ 0%{ opacity:0; transform: translateY(8px) scale(.99);} 100%{ opacity:1; transform: translateY(0) scale(1);} }
.resLabel{ color:var(--muted); letter-spacing:1.4px; font-size:11px; margin-bottom:10px; }
.resSlot{ display:flex; gap:14px; align-items:center; }
.resThumb{ position:relative; width:88px; height:66px; flex:0 0 auto; border-radius:8px; overflow:hidden; border:1px solid var(--stroke2); background: radial-gradient(120% 100% at 50% 0%, #1d2533, #0d1119 82%); }
.resIcon{ position:absolute; left:8px; right:8px; top:7px; bottom:12px; background:center/contain no-repeat; filter: drop-shadow(0 4px 6px rgba(0,0,0,.5)); }
.resBar{ position:absolute; left:0; right:0; bottom:0; height:5px; }
.resText{ min-width:0; }
.resName{ font-size:15px; font-weight:800; letter-spacing:.2px; }
.resMeta{ display:flex; align-items:center; gap:8px; margin-top:6px; flex-wrap:wrap; }
.resRarity{ font-weight:800; letter-spacing:.4px; text-transform:uppercase; font-size:12px; }
.dotSep{ color:var(--muted); }
.resWear{ color:var(--muted); }
.stTag{ display:none; color:#e6a23c; font-weight:800; font-size:11px; letter-spacing:.4px; border:1px solid rgba(230,162,60,.4); border-radius:6px; padding:2px 7px; }
.stTag.show{ display:inline-block; }

/* ====== Chances + odds ====== */
.oddsBar{ display:flex; height:26px; border-radius:8px; overflow:hidden; border:1px solid var(--stroke2); margin-bottom:14px; box-shadow: inset 0 1px 6px rgba(0,0,0,.45); }
.oddsSeg{ display:flex; align-items:center; justify-content:center; min-width:0; position:relative; transition: filter .15s ease; }
.oddsSeg:hover{ filter: brightness(1.15); }
.oddsSeg span{ font-size:10.5px; font-weight:800; color:rgba(0,0,0,.78); letter-spacing:.2px; text-shadow:0 1px 1px rgba(255,255,255,.25); white-space:nowrap; overflow:hidden; }
.chances{ display:grid; gap:10px; }
.chance{ position:relative; padding:12px 14px 12px 18px; border-radius: 8px; border:1px solid var(--stroke); background: rgba(0,0,0,.20); display:flex; align-items:center; justify-content:space-between; gap:10px; overflow:hidden; }
.chance::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background: var(--rc, transparent); box-shadow: 0 0 12px var(--rc, transparent); }
.tag{ display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.3px; }
.tag .cs{ font-size:11px; color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.6px; }
.dot{ width:11px;height:11px;border-radius:3px; }
.rarityClick{ cursor:pointer; }
.rarityClick:hover{ text-decoration:underline; }
.pct{ color:var(--text); font-size:13px; font-weight:800; }
.footerNote{ margin-top:12px; font-size:12px; color:var(--muted); line-height:1.45; }

/* ====== Stats ====== */
.statGrid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap:10px; }
.statTile{ background: rgba(0,0,0,.22); border:1px solid var(--stroke); border-radius:10px; padding:12px 14px; transition: border-color .2s ease, transform .12s ease; }
.statTile:hover{ border-color: var(--stroke2); transform: translateY(-2px); }
.statTile.wide{ grid-column: span 2; }
.statLabel{ font-size:11px; color:var(--muted); letter-spacing:.4px; text-transform:uppercase; margin-bottom:6px; }
.statNum{ font-size:19px; font-weight:800; letter-spacing:.3px; }
.statNum.money{ color:var(--money); }
.statNum.best{ font-size:14px; line-height:1.3; font-weight:800; }
.pityStat-warn{ color:var(--accent); }
.rarityCounts{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.rcChip{ display:flex; align-items:center; gap:7px; padding:6px 11px; border-radius:999px; background:rgba(0,0,0,.22); border:1px solid var(--stroke); font-size:12px; font-weight:700; }
.rcChip .dot{ width:9px; height:9px; border-radius:3px; }
.rcChip .c{ color:var(--text); font-weight:800; }

/* ====== flash/confetti/toast ====== */
.flash{ position:fixed; inset:0; z-index:1500; background: radial-gradient(900px 420px at 50% 45%, rgba(255,255,255,.22), transparent 60%), linear-gradient(180deg, rgba(255,210,74,.14), transparent); opacity:0; pointer-events:none; transition: opacity .22s ease; }
.flash.on{ opacity:1; }
.confetti{ position:fixed; inset:0; z-index:1600; pointer-events:none; overflow:hidden; opacity:0; transition: opacity .18s ease; }
.confetti.on{ opacity:1; }
.particle{ position:absolute; width:8px;height:14px; border-radius:3px; background: rgba(255,255,255,.6); opacity:.85; animation: fall 1.1s ease-out forwards; }
@keyframes fall{ 0%{ transform: translateY(-30px) rotate(0deg); opacity:0;} 10%{ opacity:.95;} 100%{ transform: translateY(110vh) rotate(260deg); opacity:0;} }
.toast{ position:fixed; left:50%; bottom:28px; transform: translateX(-50%) translateY(20px); z-index:2200; padding:12px 20px; border-radius:10px; background: rgba(20,25,35,.96); border:1px solid var(--stroke2); color:var(--text); font-size:13px; font-weight:700; letter-spacing:.3px; box-shadow:0 16px 40px rgba(0,0,0,.5); opacity:0; pointer-events:none; transition: opacity .25s ease, transform .25s ease; }
.toast.show{ opacity:1; transform: translateX(-50%) translateY(0); }
.mono{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size:12px; color:var(--muted); }

/* ====== Inventory ====== */
.history{ display:flex; flex-direction:column; gap:8px; max-height:360px; overflow-y:auto; padding-right:4px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.18) rgba(0,0,0,.2); }
.history::-webkit-scrollbar{ width:8px; }
.history::-webkit-scrollbar-track{ background:rgba(0,0,0,.2); border-radius:8px; }
.history::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); border-radius:8px; }
.history::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,.24); }
.emptyInv{ color:var(--muted); text-align:center; padding:18px; font-size:13px; }
.historyItem{ position:relative; padding:9px 12px 9px 16px; border-radius:8px; border:1px solid var(--stroke); background:rgba(0,0,0,.2); display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13px; }
.historyItem::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background: var(--rc, transparent); }
.historyItem .hLeft{ display:flex; align-items:center; gap:10px; min-width:0; }
.hThumb{ width:34px; height:26px; flex:0 0 auto; border-radius:5px; background:#0e131b center/contain no-repeat; border:1px solid var(--stroke); }
.historyItem .hName{ font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.historyItem .hRight{ display:flex; align-items:center; gap:9px; flex:0 0 auto; }
.historyItem .hWear{ font-size:11px; color:var(--muted); }
.historyItem .hSt{ color:#e6a23c; font-weight:800; font-size:10px; border:1px solid rgba(230,162,60,.4); border-radius:5px; padding:1px 5px; }
.delivered{ font-size:10px; font-weight:800; letter-spacing:.3px; color:var(--cs16); border:1px solid rgba(126,217,87,.4); border-radius:5px; padding:2px 7px; }
.claimBtn{ padding:5px 9px; border-radius:6px; font-size:10.5px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; background: rgba(255,210,74,.12); color:var(--accent); border:1px solid rgba(255,210,74,.35); cursor:pointer; }
.claimBtn:hover{ background: rgba(255,210,74,.22); }

/* ====== info modal ====== */
.infoModal{ position:fixed; inset:0; z-index:2000; background:rgba(0,0,0,.7); backdrop-filter: blur(4px); display:none; align-items:center; justify-content:center; }
.infoModal.show{ display:flex; }
.infoBox{ width:auto; min-width:520px; max-width:95vw; padding:30px; border-radius:14px; background: linear-gradient(180deg, rgba(26,31,42,.98), rgba(16,20,28,.98)); border:1px solid var(--stroke2); text-align:center; box-shadow: 0 40px 110px rgba(0,0,0,.75); }
.infoBox h3{ margin-top:0; letter-spacing:.6px; text-transform:uppercase; }
.infoBox p{ font-size:13px; color:var(--muted); line-height:1.55; }
.infoBox button{ margin-top:16px; }
#infoDesc{ overflow:visible; }

/* ====== REVEAL ====== */
.revealOverlay{ position:fixed; inset:0; z-index:1800; display:none; overflow-y:auto; -webkit-overflow-scrolling:touch; align-items:center; justify-content:center; background: radial-gradient(120% 90% at 50% 45%, rgba(10,12,18,.82), rgba(4,5,8,.96)); backdrop-filter: blur(8px); }
.revealOverlay.show{ display:flex; animation: overlayIn .25s ease both; }
@keyframes overlayIn{ from{opacity:0} to{opacity:1} }
.revealInner{ position:relative; display:flex; flex-direction:column; align-items:center; padding:28px 20px; max-width:92vw; margin:auto; }
.revealRays{ position:absolute; top:50%; left:50%; width:760px; height:760px; max-width:120vw; max-height:120vw; transform: translate(-50%,-56%); background: conic-gradient(from 0deg, rgba(255,210,74,0) 0deg, rgba(255,210,74,.22) 6deg, rgba(255,210,74,0) 12deg, rgba(255,210,74,0) 18deg, rgba(255,210,74,.18) 24deg, rgba(255,210,74,0) 30deg); filter: blur(2px); opacity:0; pointer-events:none; animation: spinRays 9s linear infinite; }
.revealOverlay.gold .revealRays{ opacity:.9; }
.revealOverlay.covert .revealRays{ opacity:.5; }
@keyframes spinRays{ to{ transform: translate(-50%,-56%) rotate(360deg); } }
.revealGlow{ position:absolute; top:50%; left:50%; width:520px; height:520px; max-width:90vw; max-height:90vw; transform: translate(-50%,-56%); border-radius:50%; pointer-events:none; animation: glowPulse 2.4s ease-in-out infinite; }
@keyframes glowPulse{ 0%,100%{ opacity:.7; } 50%{ opacity:1; } }
.revealHeadline{ position:relative; z-index:2; font-size:14px; letter-spacing:5px; font-weight:800; color:var(--muted); text-transform:uppercase; margin-bottom:6px; animation: dropIn .5s ease both; }
.specialBanner{ position:relative; z-index:2; display:none; font-size:20px; font-weight:900; letter-spacing:3px; background: linear-gradient(180deg,#fff4b3,#ffd24a,#ffb300); -webkit-background-clip:text; -webkit-text-fill-color:transparent; text-shadow:0 0 30px rgba(255,210,74,.55); margin-bottom:10px; animation: bannerPop .6s cubic-bezier(.12,.88,.12,1) both; }
.revealOverlay.gold .specialBanner{ display:block; }
@keyframes bannerPop{ 0%{opacity:0; transform:scale(.8)} 100%{opacity:1; transform:scale(1)} }
.revealCard{ position:relative; z-index:2; width:300px; height:264px; border-radius:12px; overflow:hidden; border:1px solid rgba(255,255,255,.14); box-shadow: 0 30px 90px rgba(0,0,0,.7); animation: cardReveal .7s cubic-bezier(.12,.88,.12,1) both; }
@keyframes cardReveal{ 0%{ opacity:0; transform: scale(.6) translateY(20px);} 60%{ opacity:1; transform: scale(1.05) translateY(0);} 100%{ opacity:1; transform: scale(1) translateY(0);} }
.revealCard-bg{ position:absolute; inset:0; background: radial-gradient(120% 100% at 50% 0%, #1d2533, #0c1018 85%); }
.revealCard-icon{ position:absolute; left:34px; right:34px; top:30px; bottom:46px; background:center/contain no-repeat; filter: drop-shadow(0 12px 18px rgba(0,0,0,.55)); z-index:2; }
.revealCard-bar{ position:absolute; left:0; right:0; bottom:0; height:7px; z-index:3; }
.revealCard-shine{ position:absolute; inset:-60% -80%; z-index:4; background: linear-gradient(120deg, transparent 45%, rgba(255,255,255,.28) 50%, transparent 55%); transform: translateX(-40%) rotate(18deg); animation: sweep 1s ease-out .35s both; pointer-events:none; }
@keyframes sweep{ 0%{ opacity:0; transform: translateX(-45%) rotate(18deg);} 25%{ opacity:1;} 100%{ opacity:0; transform: translateX(45%) rotate(18deg);} }
.revealRarity{ position:relative; z-index:2; margin-top:16px; font-size:14px; font-weight:900; letter-spacing:2px; text-transform:uppercase; text-shadow:0 0 18px currentColor; animation: dropIn .5s ease .12s both; }
.revealName{ position:relative; z-index:2; margin-top:6px; font-size:20px; font-weight:800; text-align:center; max-width:520px; line-height:1.25; animation: dropIn .5s ease .18s both; }
.revealServerWrap{ position:relative; z-index:2; margin-top:10px; animation: dropIn .5s ease .2s both; }
@keyframes dropIn{ 0%{opacity:0; transform:translateY(8px)} 100%{opacity:1; transform:translateY(0)} }
.stBadge{ position:relative; z-index:2; display:none; margin-top:10px; color:#e6a23c; font-weight:900; letter-spacing:1px; border:1px solid rgba(230,162,60,.5); border-radius:8px; padding:4px 12px; background: rgba(230,162,60,.08); text-shadow:0 0 12px rgba(230,162,60,.5); }
.stBadge.show{ display:inline-block; animation: dropIn .5s ease .22s both; }
.floatWrap{ position:relative; z-index:2; margin-top:18px; width:min(420px, 86vw); animation: dropIn .5s ease .26s both; }
.wbHead{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:9px; }
.wbTier{ font-size:12px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:#fff; text-shadow:0 0 12px currentColor; }
.wbVal{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13px; font-weight:700; letter-spacing:.5px; color:rgba(255,255,255,.82); }
.wbTrack{ position:relative; height:14px; border-radius:8px; overflow:hidden; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); box-shadow: inset 0 1px 3px rgba(0,0,0,.5); }
.wbTrack::after{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background: linear-gradient(90deg, transparent 0 calc(7% - 1px), rgba(0,0,0,.30) calc(7% - 1px) calc(7% + 1px), transparent calc(7% + 1px) calc(15% - 1px), rgba(0,0,0,.30) calc(15% - 1px) calc(15% + 1px), transparent calc(15% + 1px) calc(38% - 1px), rgba(0,0,0,.30) calc(38% - 1px) calc(38% + 1px), transparent calc(38% + 1px) calc(45% - 1px), rgba(0,0,0,.30) calc(45% - 1px) calc(45% + 1px), transparent calc(45% + 1px)); }
.wbFill{ position:absolute; left:0; top:0; height:100%; width:0%; border-radius:8px; z-index:1; background-image: linear-gradient(90deg, #2ee6a6 0%, #86ef3e 7%, #c6e636 15%, #ffd24a 30%, #ff9f3a 38%, #ff6a3d 45%, #ff4757 70%, #f5314f 100%); background-repeat:no-repeat; background-position:left center; background-size:200% 100%; box-shadow: 0 0 16px -2px var(--tip, #ffd24a), inset 0 1px 0 rgba(255,255,255,.25); transition: width .85s cubic-bezier(.16,1,.3,1); }
.wbFill::after{ content:""; position:absolute; right:0; top:-1px; bottom:-1px; width:2px; background:rgba(255,255,255,.92); box-shadow:0 0 12px 2px var(--tip, #fff); border-radius:2px; }
@media (prefers-reduced-motion: reduce){ .wbFill{ transition:none; } }
.floatBar{ position:relative; height:11px; border-radius:7px; border:1px solid rgba(255,255,255,.1); box-shadow: inset 0 1px 3px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.04); }
.floatTrack{ position:absolute; inset:0; border-radius:inherit; background: linear-gradient(90deg, #46d869 0%, #8fe23a 7%, #e8cf36 15%, #e9a52a 30%, #e87b28 38%, #e85a2a 45%, #e23636 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -2px 4px rgba(0,0,0,.3); }
.floatBar::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:2; background: linear-gradient(90deg, transparent calc(7% - 0.8px), rgba(0,0,0,.4) calc(7% - 0.8px), rgba(0,0,0,.4) calc(7% + 0.8px), transparent calc(7% + 0.8px), transparent calc(15% - 0.8px), rgba(0,0,0,.4) calc(15% - 0.8px), rgba(0,0,0,.4) calc(15% + 0.8px), transparent calc(15% + 0.8px), transparent calc(38% - 0.8px), rgba(0,0,0,.4) calc(38% - 0.8px), rgba(0,0,0,.4) calc(38% + 0.8px), transparent calc(38% + 0.8px), transparent calc(45% - 0.8px), rgba(0,0,0,.4) calc(45% - 0.8px), rgba(0,0,0,.4) calc(45% + 0.8px), transparent calc(45% + 0.8px)); }
.floatMarker{ position:absolute; top:-7px; width:2px; height:18px; background:linear-gradient(180deg,#fff,rgba(255,255,255,.82)); border-radius:2px; box-shadow:0 0 10px rgba(255,255,255,.95); transform: translateX(-50%); left:0%; z-index:3; transition: left .8s cubic-bezier(.12,.88,.12,1); }
.floatMarker::before{ content:""; position:absolute; top:-6px; left:50%; width:8px; height:8px; background:#fff; border-radius:2px; transform:translateX(-50%) rotate(45deg); box-shadow:0 0 8px rgba(255,255,255,.95); }
.floatMeta{ display:flex; align-items:center; justify-content:space-between; margin-top:11px; font-size:12px; color:var(--muted); }
.floatMeta .mono{ font-size:11.5px; color:var(--text); background:rgba(255,255,255,.05); border:1px solid var(--stroke); padding:2px 8px; border-radius:6px; letter-spacing:.3px; }
.floatMeta #revealWear{ color:var(--text); font-weight:700; }
.revealDeliver{ position:relative; z-index:2; margin-top:16px; font-size:12px; color:var(--cs16); letter-spacing:.4px; animation: dropIn .5s ease .28s both; }
.revealBtns{ position:relative; z-index:2; display:flex; gap:12px; margin-top:20px; flex-wrap:wrap; justify-content:center; animation: dropIn .5s ease .3s both; }

/* ====== button sheen + focus ====== */
.primary, .boxBuy{ position:relative; overflow:hidden; }
.primary::before, .boxBuy::before{ content:""; position:absolute; top:0; left:-65%; width:42%; height:100%; background: linear-gradient(120deg, transparent, rgba(255,255,255,.5), transparent); transform: skewX(-20deg); transition: left .55s ease; pointer-events:none; }
.primary:hover::before, .boxBuy:hover::before{ left:130%; }
button:focus-visible, .rarityClick:focus-visible, .boxCard:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }

/* ====== case shake ====== */
@keyframes caseShake{ 0%,100%{ transform: translateX(0) rotate(0);} 15%{ transform: translateX(-3px) rotate(-1.5deg);} 30%{ transform: translateX(3px) rotate(1.5deg);} 45%{ transform: translateX(-3px) rotate(-1deg);} 60%{ transform: translateX(2px) rotate(1deg);} 75%{ transform: translateX(-1px) rotate(0);} }
.caseArt.shake{ animation: caseShake .55s ease; }
@keyframes caseGlow{ 0%,100%{ opacity:.6; } 50%{ opacity:1; filter: brightness(1.7); } }
.caseArt.shake .caseArt-glow{ animation: caseGlow .55s ease; }

/* ====== reduced motion ====== */
@media (prefers-reduced-motion: reduce){
  .box3d .shine, .revealRays, .revealGlow{ animation: none !important; }
  .caseArt.shake{ animation: none !important; }
  .result.show, .revealCard, .revealRarity, .revealName, .stBadge, .floatWrap, .revealServerWrap, .revealDeliver, .revealBtns, .specialBanner, .revealHeadline, .revealCard-shine{ animation-duration: .01ms !important; }
  .csItem, button, .floatMarker, .statTile, .boxCard{ transition-duration: .01ms !important; }
}

/* ====== responsive ====== */
@media (max-width: 760px){
  .wrap{ padding:18px 0 36px; }
  h1{ font-size:15px; letter-spacing:.6px; }
  .sub{ font-size:11px; }
  .hideSm{ display:none; }
  .top-actions{ width:100%; justify-content:flex-start; }
  .statTile.wide{ grid-column: span 1; }
  .infoBox{ min-width:auto; width:92vw; padding:22px; }
  .revealCard{ width:236px; height:210px; }
  .revealCard-icon{ left:26px; right:26px; top:24px; bottom:38px; }
  .revealName{ font-size:17px; }
  .csItem{ flex:0 0 132px; height:128px; }
  .rollerWrap::before, .rollerWrap::after{ width:64px; }
  .revealBtns button{ padding:11px 13px; font-size:11.5px; }
  .siteNav{ gap:10px; }
  .navLinks a{ padding:7px 9px; font-size:11px; }
}

/* ============ SWEDEN CODE TEMA (swedencode.lt) ============ */
h1, h2, .card-h b, .caseInfo h2, .statNum, .revealName, .revealRarity, .revealHeadline,
.specialBanner, .boxCard-name, .resName, .badge-pro, .navLogo, .navLinks a, .navDiscord,
.tagline, button, .buykey, .mini, .boxBuy, .claimBtn, .invSell, .primary{
  font-family: var(--font-display);
}
.mono{ font-family: var(--font-mono); }
h1{ letter-spacing:1.6px; }
.card-h b{ letter-spacing:1.6px; }

/* aštrūs HUD kampai */
.card, .statTile, .chance, .historyItem, .result, .rollerWrap, .csItem, .infoBox, button,
.pill, .mini, .buykey, .boxBuy, .srvBadge, .stTag, .oddsBar, .revealCard, .toast, .delivered,
.claimBtn, .hThumb, .resThumb, .navDiscord{ border-radius:2px !important; }
/* nukirptas kampas — Sweden Code signature */
.siteNav, .boxCard, .caseArt{ border-radius:2px; clip-path: var(--clip-panel); }

/* NAV */
.siteNav{ display:flex; align-items:center; gap:16px; padding:11px 16px; margin-bottom:12px;
  background:rgba(6,10,18,.62); border:1px solid var(--stroke); backdrop-filter:blur(8px); flex-wrap:wrap; }
.navLogo{ font-weight:700; letter-spacing:2px; color:var(--text); text-decoration:none; font-size:16px; white-space:nowrap; }
.navLogo b{ color:var(--cyan); }
.navLinks{ display:flex; gap:2px; flex:1; flex-wrap:wrap; min-width:0; }
.navLinks a{ color:var(--muted); text-decoration:none; font-size:12px; letter-spacing:1.2px; text-transform:uppercase;
  font-weight:600; padding:8px 12px; transition:color .15s ease, background .15s ease; }
.navLinks a:hover{ color:var(--text); background:rgba(140,170,255,.08); }
.navRight{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.navDiscord{ font-size:12px; letter-spacing:1px; text-transform:uppercase; font-weight:700; color:#fff;
  background:var(--discord); border:1px solid rgba(120,130,255,.55); padding:9px 14px; text-decoration:none; transition:filter .15s ease; }
.navDiscord:hover{ filter:brightness(1.12); }
.tagline{ text-align:center; letter-spacing:6px; color:var(--muted); font-size:12px; font-weight:600; margin:0 0 16px; text-transform:uppercase; }
/* poster header banner - clean framed picture, flush with nav above + cards below */
.siteNav{ margin-bottom:0; }                 /* kill gap between nav and banner */
.hdrBanner{ position:relative; box-sizing:border-box; width:100%; margin:0 0 4px; overflow:hidden; line-height:0;
  border:1px solid var(--stroke); border-radius:var(--radius); box-shadow:0 30px 80px -14px rgba(0,0,0,.62), 0 0 0 1px rgba(86,230,255,.10), 0 1px 0 rgba(255,255,255,.04) inset; }
.hdrBanner img{ display:block; width:100%; height:auto; }
/* keep banner clean: hide grid/scan/corners + status; terminal code stays (moved up) */
.hdrStat, .hdrHud .grid, .hdrHud .scan, .hdrHud .c{ display:none; }
/* ===== datamosh / RGB-split slice glitch on the banner picture ===== */
.hdrBanner .glx-l{ position:absolute; inset:-3px -14px; z-index:2; background-position:50% 50%; background-size:cover; background-repeat:no-repeat; opacity:0; pointer-events:none; will-change:transform,clip-path,opacity; }
.hdrBanner.imgglx .glx-l{ opacity:.95; }
.hdrBanner.imgglx .g1{ mix-blend-mode:screen; filter:brightness(.82) sepia(1) saturate(8) hue-rotate(70deg); animation:glSlice1 .52s steps(1) both; }
.hdrBanner.imgglx .g2{ mix-blend-mode:screen; filter:brightness(.82) sepia(1) saturate(8) hue-rotate(285deg); animation:glSlice2 .52s steps(1) both; }
.hdrBanner.imgglx img{ animation:imgFlick .52s steps(1) both; }
@keyframes glSlice1{ 0%{transform:translate(16px,0);clip-path:inset(8% 0 78% 0)} 15%{transform:translate(-20px,0);clip-path:inset(38% 0 42% 0)} 30%{transform:translate(13px,0);clip-path:inset(66% 0 14% 0)} 45%{transform:translate(-16px,0);clip-path:inset(22% 0 60% 0)} 60%{transform:translate(22px,0);clip-path:inset(50% 0 30% 0)} 75%{transform:translate(-12px,0);clip-path:inset(80% 0 6% 0)} 90%{transform:translate(15px,0);clip-path:inset(14% 0 70% 0)} 100%{transform:none;clip-path:inset(0 0 100% 0)} }
@keyframes glSlice2{ 0%{transform:translate(-18px,0);clip-path:inset(60% 0 28% 0)} 15%{transform:translate(16px,0);clip-path:inset(18% 0 64% 0)} 30%{transform:translate(-13px,0);clip-path:inset(46% 0 36% 0)} 45%{transform:translate(18px,0);clip-path:inset(74% 0 10% 0)} 60%{transform:translate(-22px,0);clip-path:inset(30% 0 54% 0)} 75%{transform:translate(14px,0);clip-path:inset(6% 0 84% 0)} 90%{transform:translate(-16px,0);clip-path:inset(54% 0 28% 0)} 100%{transform:none;clip-path:inset(0 0 100% 0)} }
@keyframes imgFlick{ 0%{filter:none;transform:none} 20%{filter:brightness(1.28) contrast(1.4);transform:scale(1.04) translate(-5px,0)} 40%{filter:brightness(.9) saturate(1.7);transform:scale(1.04) translate(5px,0)} 60%{filter:contrast(1.5) hue-rotate(-14deg);transform:scale(1.04) translate(-3px,1px)} 80%{filter:brightness(1.16);transform:scale(1.04) translate(3px,0)} 100%{filter:none;transform:none} }
@media (prefers-reduced-motion: reduce){ .hdrBanner.imgglx .glx-l, .hdrBanner.imgglx img{ animation:none; } .hdrBanner.imgglx .glx-l{ opacity:0; } }
/* frozen glitch (debug/preview only, ?glxfreeze) */
.hdrBanner.glxfreeze .glx-l{ opacity:.92; }
.hdrBanner.glxfreeze .g1{ mix-blend-mode:screen; filter:brightness(.82) sepia(1) saturate(8) hue-rotate(70deg); transform:translate(20px,0); clip-path:inset(18% 0 52% 0); }
.hdrBanner.glxfreeze .g2{ mix-blend-mode:screen; filter:brightness(.82) sepia(1) saturate(8) hue-rotate(285deg); transform:translate(-20px,0); clip-path:inset(56% 0 20% 0); }
/* ===== Header futuristic HUD overlay ===== */
.hdrBanner::after{ content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    linear-gradient(to top, rgba(4,6,12,.55) 0%, rgba(4,6,12,0) 13%),
    radial-gradient(130% 130% at 50% 42%, transparent 64%, rgba(2,4,9,.4) 100%); }
.hdrHud{ position:absolute; inset:0; z-index:4; pointer-events:none; overflow:hidden; }
.hdrHud .grid{ position:absolute; inset:0; opacity:.14; mix-blend-mode:screen;
  background-image:
    repeating-linear-gradient(0deg, rgba(86,230,255,.55) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(86,230,255,.55) 0 1px, transparent 1px 32px);
  -webkit-mask-image: radial-gradient(135% 130% at 50% 42%, transparent 24%, #000 82%);
          mask-image: radial-gradient(135% 130% at 50% 42%, transparent 24%, #000 82%); }
.hdrHud .scan{ position:absolute; left:0; right:0; top:0; height:130px; transform:translateY(-130px);
  background: linear-gradient(to bottom, rgba(86,230,255,0), rgba(86,230,255,.15) 62%, rgba(190,248,255,.5) 84%, rgba(86,230,255,0) 100%);
  box-shadow:0 0 26px rgba(86,230,255,.4); mix-blend-mode:screen; opacity:.7;
  animation: hdrScan 5.5s cubic-bezier(.45,0,.55,1) infinite; }
@keyframes hdrScan{ 0%{ transform:translateY(-130px); } 40%{ transform:translateY(338px); } 100%{ transform:translateY(338px); } }
.hdrHud .c{ position:absolute; width:20px; height:20px; border:2px solid rgba(150,242,255,.85); filter:drop-shadow(0 0 6px rgba(86,230,255,.6)); }
.hdrHud .tl{ top:10px; left:10px; border-right:0; border-bottom:0; }
.hdrHud .tr{ top:10px; right:10px; border-left:0; border-bottom:0; }
.hdrHud .bl{ bottom:10px; left:10px; border-right:0; border-top:0; }
.hdrHud .br{ bottom:10px; right:10px; border-left:0; border-top:0; }
@media (prefers-reduced-motion: reduce){ .hdrHud .scan{ animation:none; opacity:0; } }
/* ===== Header hacker terminal feed + sizzle (v2) ===== */
.hdrTerm{ position:absolute; left:16px; bottom:12px; z-index:5; width:min(56%,520px); max-height:300px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end; pointer-events:none;
  font:600 13.5px/1.5 "JetBrains Mono", ui-monospace, monospace; mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(to top, #000 70%, transparent); mask-image:linear-gradient(to top, #000 70%, transparent); }
.hdrTerm .feed{ display:flex; flex-direction:column; justify-content:flex-end; gap:1px; }
.hdrTerm .tln{ white-space:nowrap; overflow:hidden; opacity:0; transform:translateY(5px); animation:tlnIn .16s ease forwards;
  color:rgba(125,238,255,.9); text-shadow:0 0 7px rgba(86,230,255,.4); }
@keyframes tlnIn{ to{ opacity:1; transform:none; } }
.hdrTerm .tln.out{ opacity:0 !important; transition:opacity .55s ease; }
.hdrTerm .p{ color:#5BE6A0; } .hdrTerm .dim{ color:rgba(155,232,255,.6); } .hdrTerm .cmd{ color:#8FEFFF; }
.hdrTerm .val{ color:#EAFBFF; } .hdrTerm .ok{ color:#5BE6A0; } .hdrTerm .warn{ color:#FFC24A; }
.hdrTerm .hex{ color:rgba(120,236,255,.66); letter-spacing:.4px; }
.hdrTerm .grant{ color:#7BFFA8; font-weight:800; text-shadow:0 0 10px rgba(91,230,160,.6); }
.hdrTerm .prompt{ margin-top:1px; white-space:nowrap; color:#5BE6A0; }
.hdrTerm .prompt b{ color:#8FEFFF; font-weight:800; animation:cblink 1.05s steps(1) infinite; }
@keyframes cblink{ 50%{ opacity:0; } }
.hdrTerm.glx{ animation:hdrGlx .22s steps(2,end); }
.hdrTerm.glx .feed{ text-shadow:1.6px 0 rgba(255,40,90,.7), -1.6px 0 rgba(40,220,255,.7); }
@keyframes hdrGlx{ 0%{transform:none} 25%{transform:translate(-2px,1px)} 50%{transform:translate(2px,-1px)} 75%{transform:translate(-1px,0)} 100%{transform:none} }
.hdrStat{ position:absolute; left:40px; top:13px; z-index:5; display:flex; align-items:center; gap:7px; pointer-events:none;
  font:700 10px/1 "JetBrains Mono", ui-monospace, monospace; letter-spacing:1.6px; color:rgba(150,230,255,.72); text-transform:uppercase; mix-blend-mode:screen; }
.hdrStat .dot{ width:7px; height:7px; border-radius:50%; background:#5BE6A0; box-shadow:0 0 9px #5BE6A0; animation:statpulse 1.6s ease-in-out infinite; }
.hdrStat em{ color:#5BE6A0; font-style:normal; }
@keyframes statpulse{ 0%,100%{ opacity:.5; transform:scale(.82);} 50%{ opacity:1; transform:scale(1.15);} }
@media (prefers-reduced-motion: reduce){ .hdrTerm .tln{ animation:none; opacity:.92; transform:none; } .hdrStat .dot, .hdrTerm .prompt b{ animation:none; } }

/* FOOTER */
.siteFooter{ margin-top:22px; padding-top:16px; border-top:1px solid var(--stroke); text-align:center;
  color:var(--muted); font-family:var(--font-mono); font-size:12px; letter-spacing:.5px; }
.siteFooter b{ color:var(--text); }

/* CLAIM modal */
.claimBox{ min-width:auto; width:min(440px,94vw); }
.claimPrize{ font-size:15px; margin:6px 0 12px; }
.claimHint{ font-size:12.5px; color:var(--muted); line-height:1.5; }
.claimInput{ width:100%; padding:12px 14px; background:rgba(0,0,0,.35); border:1px solid var(--stroke2); color:var(--text); font-family:var(--font-mono); font-size:14px; letter-spacing:.5px; text-align:center; margin-top:10px; border-radius:2px; }
.claimInput:focus{ outline:none; border-color:var(--cyan); box-shadow:0 0 0 2px rgba(86,230,255,.25); }
.claimErr{ min-height:18px; color:#ff6a6a; font-size:12px; font-weight:700; margin-top:8px; }
.claimStatus{ min-height:18px; font-size:12px; font-weight:700; margin-top:8px; color:var(--muted); }
.claimStatus .on{ color:#46D6A0; }
.claimStatus .off{ color:var(--muted); }
.claimStatus .no{ color:#ff6a6a; }
.claimStatus .ok{ color:#46D6A0; }
.claimBtns{ display:flex; gap:10px; justify-content:center; margin-top:6px; }
.claimNote{ margin-top:14px; font-size:11px; color:var(--muted); }
.claimBtns button:disabled{ opacity:.5; cursor:wait; }

/* ====== Per-box KEYS (parduotuvės kortelėse) ====== */
.boxCard-foot.keyFoot{ margin-top:6px; }
.boxCard-price.keyPrice{ color:#cfe0ff; font-size:12px; font-weight:700; }
/* buy-key mygtukas = vienodo dydžio kaip „Pirkti dėžę", bet ŠVIESIAI MĖLYNAS */
.boxCard-foot .boxBuy{ min-width:104px; white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; text-align:center; }
.boxBuy.keyBuy{ background:linear-gradient(180deg,#a9d8ff,#6cb6f0); color:#06243d; border:1px solid rgba(150,200,255,.7); }
.boxBuy.keyBuy:hover{ background:linear-gradient(180deg,#c6e6ff,#7cc0f5); }
.boxCard-own b{ color:var(--text); }

/* Mystery Box — premium violetinis akcentas */
.boxCard.mystery{ background:radial-gradient(120% 90% at 50% 0%, #241a38, #0d0a16 85%); border-color:rgba(176,107,255,.35); }
.boxCard.mystery .boxCard-name{ color:#d9c2ff; }
/* mystery active border/shadow now handled per-box via --ba */
.boxCard.mystery .boxTag{ background:#b06bff; color:#fff; }

/* Inventoriaus „užsakyta, bet nepatikrinta" žyma (backend nepasiekiamas) */
.delivered.pend{ color:var(--accent); border-color:rgba(255,210,74,.4); }