:root {
  color-scheme:dark;
  --bg:#080e18;
  --side:#0a1320;
  --surface:#111d2b;
  --surface2:#152337;
  --border:#28384c;
  --bright:#b6f66b;
  --mint:#41d8b4;
  --text:#f2f6fb;
  --muted:#92a3bb;
  --amber:#f2c46b;
  --shadow:0 24px 70px rgba(0,0,0,.32)
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:radial-gradient(ellipse 70% 45% at 80% -10%,rgba(36,79,88,.14),transparent 70%),var(--bg);
  color:var(--text);
  font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif
}
button,input {
  font:inherit
}
button {
  cursor:pointer
}
button:focus-visible,input:focus-visible,a:focus-visible {
  outline:3px solid #b6f66b;
  outline-offset:3px
}
a {
  color:inherit;
  text-decoration:none
}
.demo {
  background:#1d2b28;
  border-bottom:1px solid #456042;
  color:#d1efc9;
  text-align:center;
  padding:7px 18px;
  font-size:11px;
  letter-spacing:.045em;
  font-weight:650
}
.top {
  height:80px;
  border-bottom:1px solid #243245;
  background:rgba(8,14,24,.94);
  position:sticky;
  top:0;
  z-index:30;
  backdrop-filter:blur(18px)
}
.topin {
  max-width:1440px;
  margin:auto;
  height:100%;
  padding:0 35px;
  display:flex;
  gap:32px;
  align-items:center
}
.brand {
  display:flex;
  align-items:center;
  gap:11px;
  flex-shrink:0
}
.brandicon {
  height:40px;
  width:40px;
  border-radius:13px;
  background:var(--bright);
  color:#0b1519;
  font-size:24px;
  font-weight:900;
  display:grid;
  place-items:center;
  transform:rotate(-6deg);
  box-shadow:0 6px 22px rgba(182,246,107,.17)
}
.brandname {
  font-weight:850;
  font-size:20px;
  line-height:1;
  letter-spacing:-.05em
}
.brandname span {
  color:var(--bright)
}
.brandtag {
  color:var(--muted);
  font-size:10px;
  margin-top:5px;
  letter-spacing:.02em
}
.mainnav {
  display:flex;
  gap:25px;
  align-items:center;
  margin-left:auto
}
.mainnav a {
  color:#a6b6cc;
  font-weight:600;
  font-size:13px
}
.mainnav a.active,.mainnav a:hover {
  color:var(--bright)
}
.topactions {
  display:flex;
  align-items:center;
  gap:10px
}
.iconbtn {
  width:41px;
  height:41px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  border-radius:12px;
  font-size:18px
}
.login {
  background:var(--bright);
  color:#0e1b18;
  border:0;
  border-radius:11px;
  padding:12px 19px;
  font-weight:800
}
.frame {
  max-width:1440px;
  min-height:100vh;
  display:grid;
  grid-template-columns:212px minmax(0,1fr);
  margin:auto
}
.side {
  border-right:1px solid #1d2b3d;
  padding:29px 19px;
  position:sticky;
  top:80px;
  align-self:start;
  height:calc(100vh - 80px)
}
.eyebrow {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:800;
  color:#6f849e;
  margin:0 0 15px 10px
}
.sidenav {
  display:grid;
  gap:4px;
  margin-bottom:35px
}
.sidenav a {
  padding:11px 13px;
  border-radius:11px;
  font-weight:650;
  color:#a9b9ce;
  font-size:13px;
  display:flex;
  align-items:center;
  gap:12px
}
.sidenav a.selected {
  background:#1b2b34;
  color:#c9faa0
}
.sidenav a:hover {
  background:#182537
}
.sidenav i {
  font-style:normal;
  font-size:17px;
  width:19px
}
.sidecard {
  padding:16px;
  background:linear-gradient(146deg,#172c2b,#172238);
  border:1px solid #2e4a48;
  border-radius:15px;
  margin-top:26px
}
.sidecard b {
  font-size:13px
}
.sidecard p {
  color:#a4b9c0;
  font-size:11px;
  margin:7px 0 12px
}
.sidecard a {
  font-weight:750;
  color:var(--bright);
  font-size:12px
}
.sidefooter {
  font-size:11px;
  color:#6e829d;
  margin-top:28px;
  line-height:1.9
}
.content {
  min-width:0;
  padding:36px 39px 80px
}
.micro {
  display:flex;
  align-items:center;
  gap:9px;
  color:#94a9be;
  font-size:11px;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase
}
.micro .light {
  width:7px;
  height:7px;
  background:var(--mint);
  border-radius:50%;
  box-shadow:0 0 10px rgba(65,216,180,.6)
}
.hero {
  position:relative;
  display:grid;
  grid-template-columns:55% 45%;
  border:1px solid #2e4050;
  border-radius:23px;
  overflow:hidden;
  min-height:358px;
  background:linear-gradient(120deg,#122236 9%,#16263b 55%,#10202a 100%);
  box-shadow:var(--shadow)
}
.herotxt {
  padding:41px 0 36px 39px;
  position:relative;
  z-index:2
}
.labelchip {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 11px;
  background:rgba(182,246,107,.1);
  border:1px solid rgba(182,246,107,.25);
  border-radius:50px;
  color:#c5fa93;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:10px
}
.hero h1 {
  font-size:clamp(28px,3.1vw,44px);
  line-height:1.12;
  letter-spacing:-.055em;
  margin:20px 0 12px;
  font-weight:850
}
.hero h1 em {
  font-style:normal;
  color:var(--bright)
}
.hero p {
  max-width:410px;
  font-size:13px;
  color:#b0c0d3;
  line-height:1.65;
  margin:0 0 21px
}
.search {
  height:51px;
  background:#f7f9fb;
  border-radius:13px;
  display:flex;
  align-items:center;
  color:#263343;
  max-width:505px;
  padding:5px 6px 5px 17px;
  box-shadow:0 6px 24px rgba(0,0,0,.18)
}
.search .magnify {
  font-size:18px;
  color:#536275
}
.search input {
  min-width:0;
  flex:1;
  background:transparent;
  border:0;
  outline:0;
  color:#101926;
  font-size:13px;
  padding:10px 11px
}
.search button {
  height:39px;
  border-radius:9px;
  border:0;
  background:var(--bright);
  font-weight:850;
  font-size:12px;
  padding:0 17px;
  white-space:nowrap;
  color:#101c1b
}
.herofoot {
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  margin-top:18px;
  color:#b7c9d6;
  font-size:11px
}
.herofoot strong {
  color:var(--mint)
}
.heroart {
  position:relative;
  min-height:355px;
  overflow:hidden;
  background:radial-gradient(circle at 52% 33%,#485b5c 0%,#26314a 23%,transparent 63%),radial-gradient(circle at 90% 20%,#97cc77 0%,transparent 14%),linear-gradient(132deg,#1d3440,#0a142a)
}
.heroart:before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#16263b 0%,transparent 34%),linear-gradient(0deg,#132238 0%,transparent 39%);
  z-index:2
}
.halo {
  position:absolute;
  width:245px;
  height:245px;
  border:17px solid rgba(198,253,161,.54);
  border-radius:50%;
  top:10px;
  left:calc(50% - 90px);
  filter:blur(2px);
  box-shadow:0 0 70px #9bc9817d, inset 0 0 30px #abd08744
}
.city {
  position:absolute;
  bottom:0;
  left:20%;
  right:0;
  height:78%;
  display:flex;
  align-items:end;
  gap:6px;
  filter:drop-shadow(0 0 9px #71a4a122)
}
.tower {
  background:linear-gradient(#304c51,#0b1427);
  width:16%;
  position:relative;
  clip-path:polygon(0 5%,30% 5%,30% 0,70% 0,70% 5%,100% 5%,100% 100%,0 100%)
}
.tower:after {
  content:"";
  position:absolute;
  left:23%;
  top:18%;
  width:3px;
  height:60%;
  background:repeating-linear-gradient(to bottom,#abf4e7 0 4px,transparent 4px 14px);
  box-shadow:16px 0 0 #4a8b88,30px 0 0 #abf4e7
}
.tower:nth-child(1) {
  height:54%
}
.tower:nth-child(2) {
  height:83%;
  width:24%
}
.tower:nth-child(3) {
  height:67%;
  width:17%
}
.tower:nth-child(4) {
  height:94%;
  width:20%
}
.tower:nth-child(5) {
  height:62%;
  width:18%
}
.herobrand {
  position:absolute;
  z-index:3;
  right:20px;
  bottom:19px;
  text-align:right
}
.herobrand span {
  display:block;
  color:#b6f66b;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px
}
.herobrand b {
  display:block;
  font-weight:900;
  font-size:26px;
  letter-spacing:-.05em;
  opacity:.88
}
.ticker {
  display:flex;
  align-items:center;
  gap:16px;
  border-bottom:1px solid #253346;
  padding:19px 5px 20px;
  flex-wrap:wrap;
  color:#95a9c0;
  font-size:11px
}
.ticker span {
  display:flex;
  align-items:center;
  gap:7px
}
.ticker b {
  color:#d7e7ef;
  font-weight:700
}
.tickdot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#547067
}
.section {
  margin-top:34px
}
.sectionhead {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px
}
.section h2 {
  font-weight:820;
  font-size:22px;
  letter-spacing:-.036em;
  line-height:1.2;
  margin:4px 0 0
}
.sectionhead p {
  font-size:12px;
  color:#8b9fb6;
  margin:5px 0 0
}
.viewall {
  color:#c0f98a;
  font-size:12px;
  font-weight:800
}
.tabs {
  display:flex;
  gap:7px;
  overflow:auto;
  padding:0 0 14px;
  scrollbar-width:none
}
.tab {
  border:1px solid #334154;
  border-radius:10px;
  background:transparent;
  color:#98acc3;
  padding:9px 13px;
  font-size:12px;
  font-weight:750;
  white-space:nowrap
}
.tab.active {
  background:#b6f66b;
  color:#0d1a13;
  border-color:#b6f66b
}
.cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:15px
}
.game {
  overflow:hidden;
  background:#131e2c;
  border:1px solid #29384b;
  border-radius:17px;
  transition:transform .2s ease,border-color .2s
}
.game:hover {
  transform:translateY(-3px);
  border-color:#78976c
}
.cover {
  height:142px;
  position:relative;
  overflow:hidden
}
.cover.elden {
  background:radial-gradient(circle at 52% 15%,#d3ba71ad,transparent 27%),linear-gradient(180deg,#243526,#111e23 77%)
}
.cover.cyber {
  background:radial-gradient(circle at 64% 36%,#e7d957b8,transparent 36%),linear-gradient(145deg,#526261,#172943 62%,#251d38)
}
.cover.witcher {
  background:radial-gradient(circle at 50% 20%,#aecbd29c,transparent 32%),linear-gradient(180deg,#3b5360,#142732 76%)
}
.cover.hollow {
  background:radial-gradient(circle at 50% 9%,#adc4f6a6,transparent 37%),linear-gradient(180deg,#22314d,#0b1429)
}
.cover.baldur {
  background:radial-gradient(circle at 53% 20%,#c8776ab7,transparent 32%),linear-gradient(140deg,#5a443f,#191e35)
}
.cover.hades {
  background:radial-gradient(circle at 50% 22%,#e2b953bd,transparent 28%),linear-gradient(140deg,#5c3428,#1b2630)
}
.cover:before {
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(98deg,transparent 0 42px,#a9e9ad12 43px 44px),linear-gradient(0deg,rgba(7,14,23,.9),transparent 75%)
}
.cover:after {
  content:"";
  position:absolute;
  width:110px;
  height:130px;
  bottom:-68px;
  left:calc(50% - 55px);
  border:2px solid rgba(222,241,229,.20);
  border-radius:55% 55% 20% 20%;
  box-shadow:0 0 100px 35px rgba(173,239,160,.17);
  background:linear-gradient(70deg,rgba(10,20,25,.9),rgba(255,255,255,.05),rgba(5,13,24,.9));
  transform:rotate(-7deg)
}
.coverTitle {
  position:absolute;
  z-index:2;
  bottom:14px;
  left:16px;
  font-size:23px;
  font-weight:900;
  letter-spacing:-.055em;
  max-width:90%;
  text-transform:uppercase;
  line-height:1;
  text-shadow:0 3px 12px #0009
}
.coverTitle small {
  font-size:12px;
  letter-spacing:.18em;
  color:#bfcfda;
  font-weight:700;
  display:block;
  margin-bottom:6px
}
.covBadge {
  position:absolute;
  top:13px;
  left:13px;
  z-index:3;
  background:#0f1b27dc;
  border:1px solid #5c7580;
  padding:5px 8px;
  font-size:10px;
  font-weight:800;
  border-radius:7px
}
.gamebody {
  padding:15px
}
.gameName {
  font-weight:760;
  font-size:14px;
  margin-bottom:4px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.gameMeta {
  font-size:10px;
  color:#879ab1;
  display:flex;
  gap:7px
}
.gamePriceRow {
  display:flex;
  align-items:end;
  justify-content:space-between;
  padding:12px 0 9px
}
.price {
  font-size:26px;
  letter-spacing:-.055em;
  font-weight:900;
  line-height:1
}
.price span {
  font-size:15px
}
.subprice {
  color:#90a3b7;
  font-size:11px;
  margin-top:4px
}
.discount {
  color:#b6f66b;
  background:#283928;
  padding:5px 8px;
  border-radius:7px;
  font-size:12px;
  font-weight:900
}
.verified {
  color:#7fd7bc;
  font-size:10px;
  display:flex;
  gap:6px;
  align-items:center
}
.verified:before {
  content:"";
  width:6px;
  height:6px;
  background:#66dfb4;
  border-radius:50%
}
.cardbtn {
  margin-top:12px;
  background:#243447;
  border:1px solid #3a5066;
  border-radius:9px;
  color:#eaf4fc;
  width:100%;
  padding:10px;
  font-size:12px;
  font-weight:800
}
.cardbtn:hover {
  background:#b6f66b;
  color:#12201c;
  border-color:#b6f66b
}
.compare {
  display:grid;
  grid-template-columns:1fr 1.28fr;
  gap:18px
}
.compareleft {
  min-height:279px;
  padding:24px;
  border:1px solid #34495c;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  background:radial-gradient(circle at 100% 15%,#4a7666,transparent 44%),linear-gradient(145deg,#21324a,#0d1627)
}
.compareleft:after {
  content:"";
  position:absolute;
  right:-30px;
  bottom:-95px;
  width:250px;
  height:250px;
  border:16px solid #b6f66b55;
  border-radius:50%;
  box-shadow:0 0 70px #b6f66b2b
}
.compareleft .tag {
  color:#b7f08d;
  font-size:10px;
  font-weight:750;
  letter-spacing:.11em
}
.compareleft h3 {
  font-size:27px;
  letter-spacing:-.05em;
  line-height:1.1;
  max-width:240px;
  margin:14px 0
}
.compareleft p {
  color:#b0c2d1;
  max-width:260px;
  font-size:12px
}
.compbottom {
  position:absolute;
  bottom:20px;
  left:24px;
  z-index:2
}
.compbottom strong {
  color:#b6f66b;
  font-size:29px;
  letter-spacing:-.06em
}
.compbottom small {
  display:block;
  color:#adbecf;
  font-size:11px
}
.offerlist {
  background:#121e2d;
  border:1px solid #293a4c;
  border-radius:17px;
  padding:16px
}
.offerlistHead {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #2a3b50;
  padding-bottom:13px
}
.offerlistHead b {
  font-size:14px
}
.offerlistHead span {
  color:#97aac0;
  font-size:10px
}
.offer {
  padding:14px 0;
  border-bottom:1px solid #273648;
  display:flex;
  align-items:center;
  gap:12px
}
.offer:last-child {
  border:0
}
.storeicon {
  height:35px;
  width:35px;
  flex:0 0 35px;
  background:#294537;
  color:#dcf8cc;
  border:1px solid #426750;
  border-radius:9px;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:900
}
.storeicon.ep {
  background:#29304b;
  border-color:#4c567e
}
.storeicon.ig {
  background:#3a2b4a;
  border-color:#755481
}
.storeName {
  font-weight:770;
  font-size:12px
}
.storeMeta {
  color:#8fa5ba;
  font-size:10px;
  margin-top:3px
}
.offerprice {
  margin-left:auto;
  min-width:70px;
  text-align:right;
  font-weight:840;
  font-size:14px
}
.offerprice small {
  display:block;
  font-weight:500;
  font-size:10px;
  color:#6fcfa6
}
.offerprice small.stale {
  color:#f1c57a
}
.buy {
  border:0;
  background:#b6f66b;
  color:#10201a;
  border-radius:8px;
  padding:9px 12px;
  font-size:11px;
  font-weight:850
}
.buy.secondary {
  background:#2c394b;
  color:#c1cada
}
.note {
  color:#758da9;
  font-size:11px;
  margin:14px 0 0
}
.benefits {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:13px;
  margin-top:33px
}
.benefit {
  padding:17px;
  background:#101c2a;
  border:1px solid #28394b;
  border-radius:14px;
  display:flex;
  gap:12px
}
.benefit .sign {
  font-size:22px;
  color:#b6f66b
}
.benefit strong {
  font-size:12px
}
.benefit p {
  font-size:11px;
  color:#93a7bd;
  line-height:1.5;
  margin:3px 0 0
}
.footer {
  border-top:1px solid #253548;
  margin-top:38px;
  padding-top:17px;
  font-size:11px;
  color:#7f93ab;
  display:flex;
  justify-content:space-between;
  gap:12px
}
.mobileBottom {
  display:none
}
.hidden {
  display:none!important
}
.modal {
  position:fixed;
  inset:0;
  z-index:100;
  background:#02060cce;
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px
}
.modal.show {
  display:flex
}
.dialog {
  width:min(440px,100%);
  background:#172436;
  border:1px solid #45607a;
  border-radius:20px;
  padding:26px;
  box-shadow:var(--shadow);
  position:relative
}
.dialog h3 {
  margin:0 0 10px;
  font-size:23px
}
.dialog p {
  color:#abbcd0;
  line-height:1.6
}
.close {
  position:absolute;
  top:15px;
  right:15px;
  background:#2a3b50;
  color:#f5f7fb;
  border:0;
  border-radius:9px;
  width:33px;
  height:33px
}
.modalPrimary {
  padding:12px 16px;
  background:#b6f66b;
  color:#10201a;
  border-radius:10px;
  border:0;
  font-weight:850
}
.mobileSearchIcon {
  display:none
}
@media(max-width:1180px) {
  .frame {
    grid-template-columns:175px 1fr
  }
  .side {
    padding:24px 11px
  }
  .content {
    padding:26px 24px
  }
  .topin {
    padding:0 23px;
    gap:15px
  }
  .mainnav {
    gap:15px
  }
  .hero h1 {
    font-size:34px
  }
  .hero {
    grid-template-columns:60% 40%
  }
  .herotxt {
    padding:30px 0 30px 26px
  }
  .compare {
    grid-template-columns:1fr 1.1fr
  }
}
@media(max-width:890px) {
  .mainnav {
    display:none
  }
  .side {
    display:none
  }
  .frame {
    display:block
  }
  .content {
    padding:23px 19px 100px
  }
  .top {
    height:70px
  }
  .topin {
    padding:0 19px
  }
  .hero {
    grid-template-columns:1.2fr .8fr;
    min-height:335px
  }
  .hero h1 {
    font-size:32px
  }
  .herotxt {
    padding:30px 0 30px 26px
  }
  .herofoot {
    gap:9px
  }
  .cards {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .game:nth-child(3) {
    display:none
  }
  .compare {
    grid-template-columns:1fr 1fr
  }
  .benefits {
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:650px) {
  .brandname {
    font-size:18px
  }
  .brandtag {
    font-size:9px
  }
  .brandicon {
    height:35px;
    width:35px;
    font-size:19px
  }
  .topin {
    justify-content:space-between
  }
  .topactions .iconbtn {
    display:none
  }
  .topactions .login {
    padding:10px 13px;
    font-size:12px
  }
  .top {
    height:63px
  }
  .content {
    padding:19px 13px 100px
  }
  .hero {
    display:block;
    min-height:0;
    border-radius:17px
  }
  .herotxt {
    padding:25px 19px 23px
  }
  .hero h1 {
    font-size:32px;
    margin:16px 0 11px
  }
  .hero p {
    font-size:12px
  }
  .heroart {
    position:absolute;
    inset:0;
    opacity:.32;
    z-index:0
  }
  .herotxt {
    position:relative;
    z-index:4;
    background:linear-gradient(90deg,#112137ec 0%,#1121379e 95%)
  }
  .herobrand {
    display:none
  }
  .herofoot {
    margin-top:14px
  }
  .herofoot span:nth-child(3) {
    display:none
  }
  .search {
    height:49px
  }
  .search button {
    padding:0 10px
  }
  .ticker {
    gap:11px;
    padding:14px 3px
  }
  .ticker span:nth-child(3) {
    display:none
  }
  .section {
    margin-top:27px
  }
  .section h2 {
    font-size:20px
  }
  .sectionhead {
    margin-bottom:12px
  }
  .sectionhead p {
    font-size:11px
  }
  .tabs {
    margin-right:-13px
  }
  .cards {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
  }
  .game {
    border-radius:13px
  }
  .cover {
    height:100px
  }
  .coverTitle {
    font-size:16px;
    left:10px;
    bottom:10px
  }
  .coverTitle small {
    font-size:9px
  }
  .covBadge {
    top:8px;
    left:8px;
    font-size:9px;
    padding:3px 5px
  }
  .gamebody {
    padding:11px
  }
  .gameName {
    font-size:12px
  }
  .gameMeta {
    font-size:9px
  }
  .gamePriceRow {
    padding:10px 0 8px
  }
  .price {
    font-size:21px
  }
  .price span {
    font-size:11px
  }
  .subprice {
    font-size:9px
  }
  .discount {
    font-size:10px;
    padding:4px 5px
  }
  .verified {
    font-size:9px
  }
  .cardbtn {
    font-size:11px;
    padding:9px 3px
  }
  .compare {
    grid-template-columns:1fr
  }
  .compareleft {
    min-height:276px
  }
  .compareleft h3 {
    font-size:25px
  }
  .offerlist {
    padding:13px
  }
  .benefits {
    grid-template-columns:1fr;
    gap:9px
  }
  .footer {
    flex-direction:column
  }
  .mobileBottom {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background:#101a27ee;
    border-top:1px solid #2d4259;
    backdrop-filter:blur(10px);
    z-index:50;
    height:69px;
    padding-bottom:env(safe-area-inset-bottom)
  }
  .mobileBottom a {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    color:#99aec6;
    font-size:10px;
    font-weight:650
  }
  .mobileBottom a span {
    font-size:18px
  }
  .mobileBottom a.selected {
    color:#b6f66b
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    scroll-behavior:auto!important;
    transition:none!important
  }
}
/* ========== Integration with live KupujPL mounts ========== */

body.price-radar {
  font-family: Inter, "Inter Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
body.price-radar .demo { display: none !important; }

/* Hide legacy chrome when Price Radar shell is active */
body.price-radar .header,
body.price-radar .m-drawer,
body.price-radar .layout-split > .split-left,
body.price-radar .cp-home-top,
body.price-radar #d3-hero,
body.price-radar #d3-cats,
body.price-radar #d3-discover,
body.price-radar .cp-panel-promo,
body.price-radar .mobile-bottom-nav:not(.pr-mobile-nav) {
  display: none !important;
}

body.price-radar .frame {
  display: grid;
  grid-template-columns: 264px minmax(0, 1fr);
  max-width: 1440px;
  margin: 0 auto;
  min-height: calc(100vh - 80px);
}
body.price-radar .content {
  min-width: 0;
  padding: 28px 32px 120px;
}

/* Map live game-card → Price Radar card look */
body.price-radar .game-card,
body.price-radar .pr-game {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
  transition: transform .15s ease, border-color .15s ease;
}
body.price-radar .game-card:hover,
body.price-radar .pr-game:hover {
  transform: translateY(-2px);
  border-color: #3a516b;
}
body.price-radar .game-card .card-cover,
body.price-radar .pr-game .cover {
  position: relative;
  aspect-ratio: 460 / 215;
  background: #0c1522;
  overflow: hidden;
}
body.price-radar .game-card .card-cover img,
body.price-radar .pr-game .cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
body.price-radar .game-card .card-body,
body.price-radar .pr-game .gamebody {
  padding: 14px 14px 16px;
  display: grid;
  gap: 8px;
}
body.price-radar .game-card .card-title,
body.price-radar .pr-game .gameName {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.25;
  margin: 0;
}
body.price-radar .game-card .card-title a { color: var(--text); }
body.price-radar .game-card .card-price,
body.price-radar .pr-game .price {
  font-size: 22px;
  font-weight: 850;
  letter-spacing: -.03em;
  color: var(--text);
}
body.price-radar .game-card .card-price.empty { color: var(--muted); font-size: 14px; font-weight: 600; }
body.price-radar .pr-discount,
body.price-radar .discount {
  background: rgba(182,246,107,.14);
  color: var(--bright);
  border: 1px solid rgba(182,246,107,.28);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
}
body.price-radar .pr-verified,
body.price-radar .verified {
  color: #9fddb8;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}
body.price-radar .pr-verified::before,
body.price-radar .verified::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 0 3px rgba(74,222,128,.15);
}
body.price-radar .pr-stale {
  color: var(--amber);
  font-size: 12px;
}
body.price-radar .pr-stale::before {
  content: "";
  display: inline-block;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--amber);
  margin-right: 6px;
}
body.price-radar .cardbtn,
body.price-radar .pr-cardbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  margin-top: 4px;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface2);
  color: var(--text);
  font-weight: 700;
  font-size: 13px;
}
body.price-radar .cardbtn:hover,
body.price-radar .pr-cardbtn:hover {
  border-color: rgba(182,246,107,.45);
  color: var(--bright);
}
body.price-radar #games-grid.grid,
body.price-radar .cards,
body.price-radar .pr-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
body.price-radar .home-section-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
body.price-radar .game-card-row { /* force vertical PR cards even for row mode */
  flex-direction: column;
}
body.price-radar .game-card .card-rank,
body.price-radar .game-card .btn-watch-card,
body.price-radar .game-card .card-shops,
body.price-radar .game-card .card-old-price,
body.price-radar .game-card .d3-card-badge { display: none; }

body.price-radar .tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 18px; }
body.price-radar .tab {
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  border-radius: 999px;
  padding: 9px 14px;
  font-weight: 700;
  font-size: 13px;
}
body.price-radar .tab.active,
body.price-radar .tab[aria-selected="true"] {
  background: var(--bright);
  color: #0b1519;
  border-color: var(--bright);
}

/* Sidebar sticky */
body.price-radar .side {
  position: sticky;
  top: 80px;
  align-self: start;
  height: calc(100vh - 80px);
  overflow: auto;
  background: var(--side);
  border-right: 1px solid var(--border);
  padding: 22px 16px 28px;
}
body.price-radar .sidenav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--muted);
  font-weight: 600;
  font-size: 13px;
}
body.price-radar .sidenav a.active,
body.price-radar .sidenav a:hover {
  background: rgba(182,246,107,.08);
  color: var(--bright);
}
body.price-radar .sidenav .navlabel {
  color: #6f829c;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 14px 12px 8px;
}

/* Mobile */
@media (max-width: 980px) {
  body.price-radar .frame { grid-template-columns: 1fr; }
  body.price-radar .side { display: none; }
  body.price-radar .mainnav { display: none; }
  body.price-radar .topin { padding: 0 16px; gap: 12px; }
  body.price-radar .content { padding: 18px 14px 110px; }
  body.price-radar #games-grid.grid,
  body.price-radar .cards,
  body.price-radar .pr-cards,
  body.price-radar .home-section-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  body.price-radar .hero {
    grid-template-columns: 1fr !important;
  }
  body.price-radar .heroart { display: none; }
  body.price-radar .pr-mobile-nav { display: grid !important; }
}
@media (max-width: 420px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards,
  body.price-radar .home-section-row {
    grid-template-columns: 1fr;
  }
}

body.price-radar .pr-mobile-nav {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 40;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  background: rgba(8,14,24,.94);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(16px);
}
body.price-radar .pr-mobile-nav a {
  display: grid;
  place-items: center;
  gap: 3px;
  padding: 8px 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
body.price-radar .pr-mobile-nav a.active { color: var(--bright); }

/* Catalog section visible on home in PR mode */
body.price-radar #catalog-section { display: block !important; }
body.price-radar #catalog-section[hidden] { display: block !important; }

/* Game page Price Radar shell */
body.pr-game-page {
  background: var(--bg, #080e18);
  color: var(--text, #f2f6fb);
  font-family: Inter, "Inter Fallback", ui-sans-serif, system-ui, sans-serif;
}

/* Inner pages (auth, panel, info) */
body.price-radar.pr-inner-page .header {
  display: block !important;
  background: rgba(8,14,24,.94);
  border-bottom: 1px solid #243245;
  position: sticky;
  top: 0;
  z-index: 30;
  backdrop-filter: blur(18px);
}
body.price-radar.pr-inner-page .header .brand-name { color: var(--text); font-weight: 850; }
body.price-radar.pr-inner-page .header .brand-accent { color: var(--bright); }
body.price-radar.pr-inner-page .auth-page,
body.price-radar.pr-inner-page .panel-cp-main,
body.price-radar.pr-inner-page .wrap.auth-page {
  max-width: 560px;
  margin: 32px auto 80px;
  padding: 0 16px;
}
body.price-radar.pr-inner-page .auth-card,
body.price-radar.pr-inner-page .panel-cp-hero {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 16px 40px rgba(0,0,0,.25);
}
body.price-radar.pr-inner-page input,
body.price-radar.pr-inner-page select,
body.price-radar.pr-inner-page textarea {
  background: var(--surface2);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 10px;
}
body.price-radar.pr-inner-page button[type="submit"],
body.price-radar.pr-inner-page .m-btn-primary,
body.price-radar.pr-inner-page .cp-btn {
  background: var(--bright);
  color: #0e1b18;
  border: 0;
  border-radius: 11px;
  font-weight: 800;
}

/* Watch heart on PR cards */
body.price-radar .game-card .btn-watch-card {
  display: grid !important;
  place-items: center;
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 4;
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(15,27,39,.88);
  color: var(--text);
  font-size: 15px;
  line-height: 1;
}
body.price-radar .game-card .btn-watch-card.active { color: var(--bright); border-color: rgba(182,246,107,.4); }
body.price-radar .gamePriceRow { display: flex; align-items: end; justify-content: space-between; padding: 10px 0 8px; gap: 8px; }
body.price-radar .gameName { font-weight: 760; font-size: 14px; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.price-radar .gameMeta { font-size: 10px; color: var(--muted); display: flex; gap: 7px; align-items: center; }
body.price-radar .price { font-size: 24px; letter-spacing: -.04em; font-weight: 900; line-height: 1; }
body.price-radar .price span { font-size: 14px; font-weight: 700; }
body.price-radar .subprice { color: var(--muted); font-size: 11px; margin-top: 4px; }
body.price-radar .covBadge {
  position: absolute; top: 12px; left: 12px; z-index: 3;
  background: rgba(15,27,39,.9); border: 1px solid #5c7580;
  padding: 5px 8px; font-size: 10px; font-weight: 800; border-radius: 7px;
}
body.price-radar .auth-nav[hidden] { display: none !important; }
body.price-radar .footer { border-top: 1px solid #253548; margin-top: 28px; padding: 18px 24px 90px; color: #7f93ab; font-size: 12px; }
body.price-radar .footer-nav { display: flex; flex-wrap: wrap; gap: 10px 14px; margin-bottom: 10px; }
body.price-radar .footer-nav a { color: var(--muted); }
body.price-radar .footer-nav a:hover { color: var(--bright); }

@media (max-width: 650px) {
  body.price-radar .topactions .iconbtn { display: none; }
  body.price-radar .brandtag { font-size: 9px; }
  body.price-radar .login { padding: 10px 13px; font-size: 12px; }
}

/* Keep Price Radar hero visible even if legacy JS toggles [hidden] briefly */
body.price-radar #hero-section.hero:not([hidden]) { display: grid; }
body.price-radar #hero-section.hero[hidden] { display: none !important; }
body.price-radar .cardbtn,
body.price-radar .pr-cardbtn { text-decoration: none; }

/* Visual fidelity: keep marketing copy mixed-case like the prototype */
body.price-radar .hero h1,
body.price-radar .hero p,
body.price-radar .section h2,
body.price-radar .sectionhead p,
body.price-radar .gameName,
body.price-radar .brandname,
body.price-radar .mainnav a,
body.price-radar .sidenav a,
body.price-radar .login,
body.price-radar .cardbtn {
  text-transform: none;
}
body.price-radar .hero .search {
  background: #f7f9fb !important;
  color: #263343 !important;
  border: 0;
}
body.price-radar .hero .search input {
  color: #101926 !important;
  background: transparent !important;
}
body.price-radar .hero .search input::placeholder {
  color: #536275 !important;
}
body.price-radar .hero .search button {
  background: var(--bright) !important;
  color: #101c1b !important;
}
/* Cookie CTA should match PR lime when possible */
body.price-radar .cc-accept,
body.price-radar [data-cc-accept],
body.price-radar .cookie-accept {
  background: var(--bright) !important;
  color: #0e1b18 !important;
}


/* === Audit visual parity fixes === */
body.price-radar .frame {
  grid-template-columns: 212px minmax(0, 1fr) !important;
}
body.price-radar .side {
  padding: 29px 19px;
}
body.price-radar .content {
  padding: 36px 39px 120px;
}
body.price-radar .sidenav a.active,
body.price-radar .sidenav a.selected {
  background: #1b2b34 !important;
  color: #c9faa0 !important;
}
body.price-radar .sidenav a:hover:not(.active):not(.selected) {
  background: #182537;
  color: #c9faa0;
}
body.price-radar .sidecard a {
  display: inline;
  background: none !important;
  color: var(--bright) !important;
  border: 0 !important;
  padding: 0 !important;
  font-weight: 750;
  font-size: 12px;
  border-radius: 0;
}
body.price-radar .sidecard a.buy {
  background: none !important;
  color: var(--bright) !important;
}
/* Merge catalog under PR tabs (reference has cards directly under tabs) */
body.price-radar .pr-catalog {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
body.price-radar:not(.is-searching):not(.is-catalog-browse) .pr-catalog > .catalog-head {
  display: none !important;
}
body.price-radar.is-catalog-browse .pr-catalog > .catalog-head,
body.price-radar.is-searching .pr-catalog > .catalog-head {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
body.price-radar #okazje {
  margin-bottom: 0;
}
body.price-radar #okazje .tabs {
  margin-bottom: 16px;
}
/* Card proportions closer to prototype */
body.price-radar .game-card .card-cover,
body.price-radar .pr-game .cover {
  aspect-ratio: auto;
  height: 142px;
}
body.price-radar #games-grid.grid,
body.price-radar .pr-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}
body.price-radar .game-card .card-body,
body.price-radar .pr-game .gamebody {
  padding: 15px;
}
body.price-radar .price {
  font-size: 26px;
}
/* Mobile: ambient hero art like prototype */
@media (max-width: 650px) {
  body.price-radar .hero {
    display: block !important;
    min-height: 0;
    border-radius: 17px;
    position: relative;
  }
  body.price-radar .heroart {
    display: block !important;
    position: absolute;
    inset: 0;
    opacity: .32;
    z-index: 0;
    min-height: 100%;
  }
  body.price-radar .herotxt {
    position: relative;
    z-index: 4;
    padding: 25px 19px 23px;
    background: linear-gradient(90deg, #112137ec 0%, #1121379e 95%);
  }
  body.price-radar .herobrand { display: none; }
  body.price-radar .topactions .login {
    padding: 10px 12px;
    font-size: 12px;
  }
  body.price-radar .brandtag { max-width: 110px; }
}
@media (max-width: 980px) and (min-width: 651px) {
  body.price-radar .heroart { display: none; }
}

/* More audit fixes: hero height, card overlays, mobile stack, focus */
body.price-radar .hero {
  min-height: 358px !important;
}
body.price-radar .game-card .card-cover::before,
body.price-radar .game-card .card-cover::after,
body.price-radar .pr-game .cover::before,
body.price-radar .pr-game .cover::after,
body.price-radar .cover:before,
body.price-radar .cover:after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}
body.price-radar .hero .search input:focus,
body.price-radar .hero .search input:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
body.price-radar .hero .search:focus-within {
  outline: 3px solid #b6f66b;
  outline-offset: 3px;
}

/* Force single-column mobile content (kill legacy split layouts) */
@media (max-width: 650px) {
  body.price-radar .frame,
  body.price-radar .content,
  body.price-radar #split-right {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body.price-radar .ticker {
    display: flex !important;
    flex-wrap: wrap;
    width: 100%;
  }
  body.price-radar .benefits {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
  }
  body.price-radar .section,
  body.price-radar #okazje,
  body.price-radar #catalog-section {
    width: 100% !important;
    max-width: 100% !important;
  }
  body.price-radar .topin {
    justify-content: space-between;
  }
  body.price-radar .brandtag {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* Game page: hide legacy blue promo alert chrome if injected */
body.pr-game-page .cp-price-alert-banner,
body.pr-game-page .header-alert-cta,
body.pr-game-page [class*="notify-banner"] {
  display: none !important;
}

/* Auth nav: keep compact on PR chrome (avoid i18n marketing register CTA) */
body.price-radar #auth-nav,
body.pr-game-page #auth-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
body.price-radar #auth-nav a,
body.pr-game-page #auth-nav a {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted, #92a3bb);
  text-decoration: none;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.price-radar #auth-nav a[href*="register"],
body.pr-game-page #auth-nav a[href*="register"],
body.price-radar #auth-nav a[href*="login"],
body.pr-game-page #auth-nav a[href*="login"] {
  background: var(--bright, #b6f66b);
  color: #0e1b18 !important;
  border-radius: 11px;
  padding: 10px 14px;
  max-width: none;
}
body.pr-game-page .header-info-btn { color: #92a3bb; }

/* Mobile search padding fix */
@media (max-width: 650px) {
  body.price-radar .hero .search {
    padding-left: 12px !important;
  }
  body.price-radar .hero .search .magnify {
    flex: 0 0 auto;
    margin-right: 2px;
  }
  body.price-radar .hero .search input {
    padding-left: 6px !important;
    min-width: 0;
  }
}
/* Sidecard link must stay text-style */
body.price-radar .sidecard a,
body.price-radar .sidecard a:visited {
  display: inline !important;
  width: auto !important;
  background: transparent !important;
  color: #b6f66b !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

/* Final authoritative mobile header (all Price Radar chrome: home, game, SEO pages).
   Brand tag stacks under the name and ellipsizes; account CTA never shrinks or wraps. */
@media (max-width: 650px) {
  body.price-radar .top .topin {
    padding: 0 12px;
    gap: 8px;
    justify-content: space-between;
    min-width: 0;
  }
  body.price-radar .top .topin .brand {
    flex: 1 1 auto;
    min-width: 0;
    gap: 9px;
  }
  body.price-radar .top .topin .brand > span:last-child {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
  body.price-radar .top .topin .brandname {
    font-size: 17px;
    white-space: nowrap;
  }
  body.price-radar .top .topin .brandtag {
    display: block;
    max-width: none;
    margin-top: 4px;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.price-radar .top .topin .topactions {
    flex: 0 0 auto;
    margin-left: auto;
  }
  body.price-radar .top .topin .login {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 9px 12px;
    font-size: 12px;
    white-space: nowrap;
  }
  body.price-radar .top .topin #auth-nav {
    flex: 0 0 auto;
    margin-left: auto;
    gap: 6px;
  }
  body.price-radar .top .topin #auth-nav a {
    padding: 9px 12px;
    font-size: 12px;
    max-width: 120px;
  }
  body.price-radar .top .topin .header-info,
  body.price-radar .top .topin .header-info-btn {
    display: none;
  }
}
@media (max-width: 359px) {
  body.price-radar .top .topin { padding: 0 10px; gap: 6px; }
  body.price-radar .top .topin .brand { gap: 7px; }
  body.price-radar .top .topin .brandicon { width: 32px; height: 32px; font-size: 17px; }
  body.price-radar .top .topin .brandname { font-size: 15px; }
  body.price-radar .top .topin .login { padding: 8px 10px; font-size: 11.5px; }
}

/* Neutralize legacy cyberpunk skin that leaks into Price Radar pages (all widths):
   global uppercase, scanline overlay, cut-corner brand/CTA chrome, sweep animations. */
body.price-radar { text-transform: none; background-image: none; }
body.price-radar::before { display: none; }
body.price-radar .brand,
body.price-radar .header .brand {
  background: none;
  clip-path: none;
  padding: 0;
  min-height: 0;
  overflow: visible;
  color: var(--text);
}
body.price-radar .brand::after,
body.price-radar .game-card::after { display: none; animation: none; }
body.price-radar .header .brand-sub {
  background: transparent;
  clip-path: none;
  color: var(--muted);
  padding: 0;
  letter-spacing: .04em;
}
body.price-radar #auth-nav .btn-nav,
body.price-radar #auth-nav a,
body.price-radar #auth-nav button,
body.price-radar .header-info-btn {
  clip-path: none;
  border-radius: 11px;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: none;
  font-weight: 800;
}
body.price-radar #auth-nav .btn-register-alert,
body.price-radar #auth-nav a.btn-register {
  background: var(--surface2);
  color: var(--bright) !important;
  border: 1px solid rgba(182,246,107,.4);
}
body.price-radar #auth-nav .btn-register-alert:focus-visible { outline-color: var(--bright); }
body.price-radar #auth-nav .btn-logout,
body.price-radar #auth-nav .btn-panel {
  background: var(--surface2);
  color: var(--text);
  border: 1px solid var(--border);
}
body.price-radar #auth-nav .nav-user {
  color: var(--muted);
  font-weight: 700;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.price-radar .header-info-btn {
  background: transparent;
  border: 0;
  color: var(--muted);
}
@media (max-width: 650px) {
  body.price-radar #auth-nav .btn-register,
  body.price-radar #auth-nav .nav-user { display: none; }
  body.price-radar .header .header-inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    min-width: 0;
  }
  body.price-radar .header .header-actions,
  body.price-radar .header #auth-nav { grid-column: auto; }
  body.price-radar .header .brand { flex: 0 1 auto; min-width: 0; }
  body.price-radar .header .brand-name { font-size: 18px; white-space: nowrap; }
  body.price-radar .header .brand-sub { display: none; }
  body.price-radar .header #auth-nav { flex: 0 0 auto; margin-left: auto; gap: 6px; }
  body.price-radar .header #auth-nav a,
  body.price-radar .header #auth-nav button { padding: 9px 12px; font-size: 12px; white-space: nowrap; }
}

/* Inner-page header: drop the legacy theme switcher and restyle the language switch */
body.price-radar .header .theme-switch-wrap { display: none !important; }
body.price-radar .header .header-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
body.price-radar .header .lang-switch {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 11px;
  clip-path: none;
}
body.price-radar .header .lang-btn {
  clip-path: none;
  background: transparent;
  color: var(--muted);
  border: 0;
  border-radius: 8px;
  padding: 6px 9px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: none;
  box-shadow: none;
}
body.price-radar .header .lang-btn.active { background: var(--surface2); color: var(--bright); }
body.price-radar.pr-inner-page .auth-sub,
body.price-radar.pr-inner-page .auth-legal,
body.price-radar.pr-inner-page .auth-switch { color: var(--muted); }
@media (max-width: 650px) {
  body.price-radar .header .header-actions { margin-left: auto; }
  body.price-radar .header .header-inner > .header-actions { order: 2; }
  body.price-radar .header .header-inner > #auth-nav { order: 3; margin-left: 0; }
  body.price-radar .header .lang-btn { padding: 6px 7px; font-size: 10.5px; }
}
body.price-radar.pr-inner-page .auth-form label,
body.price-radar.pr-inner-page .auth-form label span { color: var(--text); text-transform: none; }
body.price-radar.pr-inner-page .auth-oauth-note,
body.price-radar.pr-inner-page .auth-oauth-divider,
body.price-radar.pr-inner-page .auth-oauth-divider span { color: var(--muted); }
body.price-radar.pr-inner-page .auth-card a { color: var(--bright); }
@media (max-width: 400px) {
  body.price-radar .header .header-actions { gap: 6px; }
  body.price-radar .header .brand { flex: 0 0 auto; }
  body.price-radar .header .lang-btn { padding: 6px 5px; font-size: 10px; }
  body.price-radar .header #auth-nav a,
  body.price-radar .header #auth-nav button { padding: 8px 10px; }
}
@media (max-width: 650px) {
  body.price-radar .header { padding: 0; }
}
@media (max-width: 400px) {
  body.price-radar .header .lang-btn { min-width: 36px; }
}

/* Game page offer rows must never exceed the viewport on narrow phones */
@media (max-width: 480px) {
  body.pr-game-page .offer-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px;
  }
  body.pr-game-page .offer-row > * { min-width: 0; }
  body.pr-game-page .offer-row .btn-buy {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  body.pr-game-page .offer-price,
  body.pr-game-page .offer-checked {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  body.pr-game-page .pr-mobile-nav { max-width: 100vw; }
}

/* Home header: logout control for signed-in users (icon-only; stays visible on phones) */
body.price-radar .topactions .pr-logout { display: inline-grid; place-items: center; }
body.price-radar .topactions .pr-logout[hidden] { display: none; }
@media (max-width: 650px) {
  body.price-radar .top .topin .topactions { gap: 6px; }
  body.price-radar .top .topin .topactions .pr-logout { width: 36px; height: 36px; border-radius: 10px; display: inline-grid; }
  body.price-radar .top .topin .topactions .pr-logout[hidden] { display: none; }
}

/* Search deep-link (?q=): hide home blocks before app.js runs so results do not shift layout. */
body.price-radar.is-searching #home-sections,
body.price-radar.is-searching #home-feeds,
body.price-radar.is-searching #home-spotlight,
body.price-radar.is-searching #hero-section,
body.price-radar.is-searching #home-news,
body.price-radar.is-searching .cp-home-hero,
body.price-radar.is-searching .cp-home-top,
body.price-radar.is-searching .cp-panel-promo {
  display: none !important;
}

/* Final residue cleanup: legacy chamfered chrome on cards and hero search. */
body.price-radar .game-card,
body.price-radar .pr-game,
body.price-radar .game-card .card-cover,
body.price-radar .pr-game .cover,
body.price-radar .hero .search,
body.price-radar .hero .search input,
body.price-radar .hero .search button {
  clip-path: none !important;
}
body.price-radar .pr-game {
  border-radius: 16px !important;
}
body.price-radar .pr-game .cover,
body.price-radar .game-card .card-cover {
  border: 0 !important;
  border-radius: 0 !important;
}
body.price-radar .hero .search input {
  border: 0 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-size: 14px !important;
}
body.price-radar .hero .search input::placeholder {
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
body.price-radar .pr-game .gamebody {
  flex: 1 1 auto;
  display: flex !important;
  flex-direction: column;
}
body.price-radar .pr-game .gamebody > .cardbtn {
  margin-top: auto;
}

/* Game page / SEO pages: remove remaining legacy skin (chamfers, glitch shadows, cyan chart). */
body.price-radar .offers-title,
body.price-radar .game-media-title,
body.price-radar .gp-related-title {
  background: transparent !important;
  color: #eaf2fb !important;
  text-shadow: none !important;
  text-transform: none !important;
  letter-spacing: -.01em !important;
  padding: 0 !important;
  border: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
  font-size: 1.15rem !important;
}
body.price-radar .offer-row {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #273648 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
}
body.price-radar .offer-shop {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
body.price-radar .offer-shop strong {
  font-size: 14px;
  color: #eaf2fb;
}
body.price-radar .offer-shop .badge {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  background: #162435;
  border: 1px solid #2b3d52;
  color: #a9bbd0;
  text-transform: none !important;
  letter-spacing: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
}
body.price-radar .offer-price {
  color: #eaf2fb !important;
  text-shadow: none !important;
  text-transform: none !important;
  font-size: 16px;
}
body.price-radar .offer-checked {
  color: #8ea2b8 !important;
  font-size: 11px;
  font-weight: 500;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
body.price-radar .btn-buy,
body.price-radar .game-page-answer-buy,
body.price-radar .footer-btn {
  clip-path: none !important;
  border-radius: 10px;
}
body.price-radar .footer-btn {
  border-radius: 999px;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
body.price-radar .ph-bg { fill: #0c1522; }
body.price-radar .ph-line { stroke: #b6f66b; }
body.price-radar .ph-area { fill: rgba(182, 246, 107, .13); }
body.price-radar .ph-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 8px;
  font-size: 12px;
  color: #8ea2b8;
}
body.price-radar .ph-leg {
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* Region notice (non-PL visitors) overlays the page instead of pushing the layout down (CLS). */
body.price-radar .region-banner:not([hidden]) {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  margin: 0;
  background: #0f1a28;
  border-top: 1px solid #28384c;
  color: #c7d3e2;
}
@media (max-width: 767px) {
  body.price-radar .region-banner:not([hidden]) {
    bottom: 68px;
  }
}
body.price-radar .region-banner .region-banner-inner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 14px;
  max-width: 1100px;
  margin: 0 auto;
}
body.price-radar .region-banner .region-banner-text {
  flex: 1;
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  text-transform: none;
  letter-spacing: 0;
}
body.price-radar .region-banner .region-banner-close {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #2b3d52;
  background: #162435;
  color: #eaf2fb;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  clip-path: none;
}
@media (max-width: 767px) {
  body.price-radar .region-banner .region-banner-inner {
    padding-right: 96px;
  }
}

/* ---- Home catalog card density (compact rows, readable price/status) ---- */
body.price-radar #games-grid.grid,
body.price-radar .pr-cards,
body.price-radar .home-section-row {
  gap: 10px;
  align-items: stretch;
}

body.price-radar .pr-game,
body.price-radar .game-card.pr-game {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: auto;
}

body.price-radar .pr-game .cover,
body.price-radar .game-card.pr-game .cover,
body.price-radar .game-card.pr-game .card-cover {
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  max-height: 118px;
  flex: 0 0 auto;
}

body.price-radar .pr-game .gamebody,
body.price-radar .game-card.pr-game .gamebody,
body.price-radar .game-card.pr-game .card-body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column;
  gap: 5px !important;
  padding: 9px 10px 10px !important;
}

body.price-radar .pr-game .gameName,
body.price-radar .game-card.pr-game .gameName,
body.price-radar .game-card.pr-game .card-title {
  font-size: 13px !important;
  line-height: 1.28 !important;
  min-height: calc(1.28em * 2) !important;
  max-height: calc(1.28em * 2);
  margin: 0;
}

body.price-radar .pr-game .gameMeta,
body.price-radar .game-card.pr-game .gameMeta {
  font-size: 10px !important;
  gap: 4px;
  line-height: 1.2;
  margin: 0;
}

body.price-radar .pr-game .gamePriceRow {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 6px;
  margin-top: 2px !important;
  padding-top: 0 !important;
}

body.price-radar .pr-game .price,
body.price-radar .game-card.pr-game .price,
body.price-radar .game-card.pr-game .card-price {
  font-size: 19px !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
}

body.price-radar .pr-game .subprice {
  font-size: 10px !important;
  line-height: 1.25;
  margin-top: 1px !important;
  color: #9fb0c5;
}

body.price-radar .pr-game .verified,
body.price-radar .pr-game .pr-stale {
  font-size: 10px !important;
  line-height: 1.3;
  gap: 5px;
  margin: 0;
  min-height: 14px;
}

body.price-radar .pr-game .discount {
  padding: 3px 7px;
  font-size: 11px;
}

body.price-radar .pr-game .cardbtn,
body.price-radar .pr-game .pr-cardbtn {
  margin-top: 4px !important;
  padding: 8px 10px !important;
  min-height: 38px;
  font-size: 12px !important;
  border-radius: 10px;
}

body.price-radar .pr-game .gamebody > .cardbtn {
  margin-top: 4px !important;
}

@media (min-width: 981px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px;
  }
}

@media (min-width: 1280px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1500px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 980px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards,
  body.price-radar .home-section-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
  }

  body.price-radar .pr-game .cover,
  body.price-radar .game-card.pr-game .cover {
    max-height: 82px;
  }

  body.price-radar .pr-game .cardbtn,
  body.price-radar .pr-game .pr-cardbtn {
    min-height: 36px;
    padding: 7px 8px !important;
  }
}

@media (max-width: 420px) {
  body.price-radar #games-grid.grid,
  body.price-radar .pr-cards,
  body.price-radar .home-section-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
