:root{color-scheme:dark;--bg:#0a1a15;--surface:#11261f;--surface2:#173329;--line:#244538;--text:#eaf4ee;--mute:#8fb1a0;--accent:#34d399;--green:#107c10;--gold:#ffd166;--display:"Sora",system-ui,sans-serif;--body:"Figtree",system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;position:relative;isolation:isolate;background:var(--bg);color:var(--text);font:15px/1.45 var(--body)}
body::before{content:"";position:absolute;inset:0 0 auto 0;height:380px;z-index:-1;pointer-events:none;background:radial-gradient(60% 130% at 15% 0%,rgba(52,211,153,.20),transparent 70%),radial-gradient(45% 110% at 95% 0%,rgba(16,124,16,.30),transparent 70%)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
header{max-width:1320px;margin:auto;padding:38px 16px 18px}
h1{margin:0;font:700 clamp(28px,4.5vw,42px)/1.08 var(--display);letter-spacing:-.025em}
h1 a{color:inherit;text-decoration:none}
#meta{margin-top:8px;color:var(--mute);font-size:14px;min-height:20px}
.bar{position:static;display:flex;flex-wrap:wrap;gap:8px;padding:10px max(16px,calc((100vw - 1320px)/2 + 16px));background:rgba(10,26,21,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-block:1px solid var(--line)}
.bar input,.bar select,.bar button{height:42px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:0 14px;font:500 14px var(--body)}
.bar input{flex:1 1 260px;padding-left:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238fb1a0' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:14px center}
.bar select,.bar button{cursor:pointer}
.bar button:hover,.bar select:hover{border-color:var(--accent)}
.bar button.on{background:var(--green);border-color:var(--accent)}
.fbtn{display:none}
.layout{display:flex;gap:22px;max-width:1320px;margin:22px auto 0;padding:0 16px;align-items:flex-start}
aside{flex:0 0 244px;position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.rng{margin-bottom:20px}
.rh{display:flex;justify-content:space-between;font:600 14px var(--display)}
.rh b{color:var(--accent);font:500 13px var(--body)}
.dual{position:relative;height:22px;margin-top:6px}
.dual::before{content:"";position:absolute;left:0;right:0;top:9px;height:4px;border-radius:2px;background:var(--line)}
.dual i{position:absolute;top:9px;height:4px;background:var(--accent);border-radius:2px}
.dual input{position:absolute;left:0;top:0;width:100%;height:22px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}
.dual input::-webkit-slider-runnable-track{background:none;height:22px}
.dual input::-moz-range-track{background:none}
.dual input::-webkit-slider-thumb{pointer-events:auto;-webkit-appearance:none;width:12px;height:12px;margin-top:3px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);box-sizing:content-box;cursor:pointer}
.dual input::-moz-range-thumb{pointer-events:auto;width:12px;height:12px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);cursor:pointer}
aside summary{font:600 14px var(--display);cursor:pointer;margin-bottom:8px}
.g{display:flex;justify-content:space-between;gap:8px;padding:5px 0;cursor:pointer;font-size:14px}
.g input{accent-color:var(--accent)}
.g small,aside small{color:var(--mute)}
section{flex:1;min-width:0}
#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:16px}
.card{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .15s}
.card:hover{border-color:var(--accent)}
.pic{display:block;position:relative;aspect-ratio:2/3;background:linear-gradient(160deg,#1b3a2e,#0f2119)}
.pic::after{content:"";position:absolute;inset:auto 0 0 0;height:36%;background:linear-gradient(transparent,rgba(4,14,10,.82));pointer-events:none;z-index:1}
.pic img{width:100%;height:100%;object-fit:cover;display:block}
.badge{position:absolute;z-index:2;top:10px;left:10px;background:var(--gold);color:#2b2000;font:800 12px/1 var(--display);padding:5px 9px;border-radius:999px}
.heart{position:absolute;z-index:3;top:8px;right:8px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(6,18,13,.62);color:#fff;cursor:pointer;font-size:15px;backdrop-filter:blur(6px)}
.heart.on{color:#ff6b81}
.subs{position:absolute;z-index:2;left:10px;bottom:10px;display:flex;gap:4px}
.sub{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:999px;font:700 10px/1 var(--display);font-style:normal;color:#fff;background:#107c10;border:1px solid #5fe38c88}
.info{display:flex;flex-direction:column;flex:1;gap:2px;padding:12px 12px 14px}
.info h3{margin:0;font:600 14px/1.25 var(--display);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.info h3 a{color:inherit;text-decoration:none}
.info h3 a:hover{color:var(--accent)}
.pub{margin:0;color:var(--mute);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.price{display:flex;align-items:baseline;gap:8px;margin-top:auto;padding-top:8px}
.price b{font:700 17px var(--display);color:var(--accent)}
.price s{color:var(--mute);font-size:12px}
#more{display:block;margin:30px auto 56px;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:12px 30px;font:600 14px var(--body);cursor:pointer}
#more:hover{border-color:var(--accent)}
#more[hidden]{display:none}
#msg{text-align:center;color:var(--mute);padding:48px 16px}
#msg:empty{display:none}
@media(max-width:760px){
  header{padding:24px 14px 12px}
  .bar{position:static;padding:8px 12px;gap:6px}
  .bar input{flex:1 1 100%}
  .bar select,.bar button{flex:1 1 auto;padding:0 10px;font-size:13px}
  .fbtn{display:inline-block}
  .layout{display:block;padding:0 12px;margin-top:14px}
  aside{display:none;position:static;max-height:none;margin-bottom:14px}
  aside.show{display:block}
  #grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .info{padding:9px 9px 11px}
  .info h3{font-size:13px}
  .price b{font-size:15px}
  .badge{top:8px;left:8px;font-size:11px;padding:4px 7px}
  .subs{left:8px;bottom:8px}
  .sub{height:20px;padding:0 8px;font-size:9px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.cta{display:inline-flex;align-items:center;justify-content:center;margin-top:24px;padding:20px 38px;border-radius:999px;background:var(--accent);color:#04281a;font:700 clamp(18px,2.6vw,24px)/1 var(--display);text-decoration:none;box-shadow:0 12px 34px rgba(52,211,153,.28)}
.cta:hover{background:#6ee7b7}
.sec{max-width:1320px;margin:38px auto 0;padding:0 16px}
.sec h2{margin:0 0 4px;font:700 22px/1.2 var(--display);letter-spacing:-.01em}
.sec p.sub-t{margin:0 0 14px;color:var(--mute);font-size:14px}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:176px;gap:16px;overflow-x:auto;padding-bottom:14px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.row .card{scroll-snap-align:start}
@media(max-width:760px){.cta{width:100%;margin-top:18px;padding:18px 20px}.sec{margin-top:28px;padding:0 12px}.row{grid-auto-columns:calc((100% - 10px)/2);gap:10px}}

.pub a{color:inherit;text-decoration:none}
.pub a:hover{color:var(--accent);text-decoration:underline}
.lowtag{position:absolute;z-index:2;top:40px;left:10px;background:#fff;color:#0b3d2a;font:700 10px/1 var(--display);padding:4px 8px;border-radius:999px}
.ends{margin:2px 0 0;color:var(--gold);font-size:12px;font-weight:600}
.chartbtn{position:absolute;z-index:3;top:8px;right:46px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(6,18,13,.62);cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(6px)}
.chartbtn svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.back{color:var(--accent);text-decoration:none;font:600 14px var(--display)}
#modal{position:fixed;inset:0;z-index:50;background:rgba(3,10,8,.72);display:grid;place-items:center;padding:16px}
#modal[hidden]{display:none}
.mbox{position:relative;width:min(620px,100%);background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px}
.mbox h3{margin:0 40px 12px 0;font:700 18px/1.25 var(--display)}
#mx{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--surface2);color:var(--text);font-size:18px;cursor:pointer}
.chart{width:100%;height:auto}
.chart text{fill:var(--mute);font:11px var(--body)}
.mbox p{margin:8px 0 0;font-size:14px}
.mbox .note{color:var(--mute);font-size:12px}
@media(max-width:760px){.lowtag{top:32px;left:8px;font-size:9px;padding:3px 6px}.chartbtn{right:44px}}

.pcmark{position:absolute;z-index:2;right:10px;bottom:10px;display:flex;align-items:center;gap:5px;background:rgba(6,18,13,.8);color:#fff;border:1px solid #fff5;border-radius:8px;padding:4px 7px;font:700 10px/1 var(--display);letter-spacing:.05em}
.pcmark::before{content:"";width:10px;height:7px;border:1.5px solid #fff;border-radius:2px}
.dealbar{position:relative;display:flex;align-items:stretch;height:150px;margin-top:24px;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(100deg,#0f6b3a,#0c3a2b 70%);color:var(--text);text-decoration:none}
.dealbar:hover{border-color:var(--accent)}
.dealtxt{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 28px;max-width:56%}
.dealtxt b{font:700 clamp(20px,3vw,30px)/1.1 var(--display);letter-spacing:-.01em}
.dealtxt small{color:#bfe9d3;font-size:14px}
.dealimgs{position:absolute;top:0;right:0;bottom:0;width:72%;display:flex;gap:8px;flex-direction:row-reverse;justify-content:flex-start;padding:12px 12px 0;overflow:hidden}
.dealimgs::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0e5a34 0%,rgba(14,90,52,0) 48%);pointer-events:none}
.dealimgs img{height:100%;aspect-ratio:2/3;object-fit:cover;border-radius:10px 10px 0 0;flex:none;background:#154d36}
.dealbar:hover .dealimgs img{filter:brightness(1.1)}
@media(max-width:760px){.dealbar{height:116px;margin-top:18px}.dealtxt{padding:0 16px;max-width:60%}.dealtxt small{font-size:12px}.dealimgs{width:66%;padding:10px 10px 0}.pcmark{right:8px;bottom:8px;padding:3px 6px;font-size:9px}}

.bar .wlink{cursor:pointer;display:inline-flex;align-items:center;height:42px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);text-decoration:none;font:500 14px var(--body)}
.bar .wlink:hover{border-color:var(--accent)}

.relbar{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:8px 10px;background:rgba(6,18,13,.88);color:var(--gold);font:700 11px/1 var(--display);text-align:center;letter-spacing:.02em}
.pic.unrel .subs,.pic.unrel .pcmark{bottom:38px}
.overlay{position:fixed;inset:0;z-index:60;background:rgba(3,10,8,.74);display:grid;place-items:center;padding:16px;overflow:auto}
.overlay[hidden]{display:none}
.mclose{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--surface2);color:var(--text);font-size:18px;cursor:pointer}
.gbox{width:min(700px,100%)}
.gtop{display:flex;gap:18px}
.gimg{width:150px;aspect-ratio:2/3;object-fit:cover;border-radius:12px;background:#154d36;flex:none}
.gmeta h3{margin:0 40px 6px 0;font:700 20px/1.2 var(--display)}
.gpub{margin:0 0 10px;color:var(--mute);font-size:14px}
.gpub a{color:inherit}
.gprice{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.gprice b{font:700 24px var(--display);color:var(--accent)}
.gprice s{color:var(--mute)}
.gpct{background:var(--gold);color:#2b2000;font:800 12px/1 var(--display);padding:4px 8px;border-radius:999px}
.gtags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tag{background:var(--surface2);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px}
.gdesc{margin:16px 0 0;font-size:14px;color:#cfe3d8;white-space:pre-line;max-height:190px;overflow:auto}
.gactions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.pbtn{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 18px;border-radius:12px;border:0;background:var(--accent);color:#04281a;font:700 14px var(--body);cursor:pointer;text-decoration:none}
.pbtn.ghost{background:var(--surface2);color:var(--text);border:1px solid var(--line)}
.pbtn.on{background:#ff6b81;color:#2b0710}
.mbox input{width:100%;height:44px;margin-top:10px;padding:0 14px;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:10px;font:15px var(--body)}
#authform .pbtn{width:100%;margin-top:14px}
@media(max-width:560px){.gtop{flex-direction:column}.gimg{width:120px}.pbtn{flex:1 1 100%}}
@media(max-width:760px){.pic.unrel .subs,.pic.unrel .pcmark{bottom:32px}.relbar{font-size:10px;padding:7px 8px}}

.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;padding:10px max(16px,calc((100vw - 1320px)/2 + 16px));background:rgba(10,26,21,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{font:700 20px/1 var(--display);letter-spacing:-.02em;color:var(--text);text-decoration:none;white-space:nowrap}
.hsearch{flex:1 1 280px;max-width:560px;margin:0 0 0 10px}
.hsearch input{width:100%;height:42px;padding:0 14px 0 40px;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238fb1a0' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 14px center;color:var(--text);border:1px solid var(--line);border-radius:12px;font:500 14px var(--body)}
.hright{display:flex;align-items:center;gap:8px;margin-left:auto}
.hbtn{display:inline-flex;align-items:center;gap:7px;height:42px;padding:0 14px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:12px;font:500 14px var(--body);cursor:pointer;text-decoration:none;white-space:nowrap}
.hbtn:hover{border-color:var(--accent)}
.hbtn.on{background:var(--green);border-color:var(--accent)}
.hbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.flag{display:block;border-radius:2px}
.region{position:relative}
.rmenu{position:absolute;right:0;top:48px;min-width:230px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.45);z-index:50}
.rmenu[hidden]{display:none}
.rmenu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;background:none;border:0;border-radius:8px;color:var(--text);font:500 14px var(--body);cursor:pointer;text-align:left}
.rmenu button:hover,.rmenu button.sel{background:var(--surface2)}
.reviews{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.rev{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;background:var(--surface2);border:1px solid var(--line);border-radius:12px;color:var(--text);text-decoration:none}
.rev:hover{border-color:var(--accent)}
.rs{display:grid;place-items:center;width:46px;height:46px;border-radius:10px;color:#04150f;font:800 19px var(--display)}
.rs.good{background:#66e08a}.rs.mid{background:#ffd166}.rs.bad{background:#ff6b81}
.rn{display:flex;flex-direction:column;font:600 14px var(--body)}
.rn small{color:var(--mute);font-weight:400;font-size:12px}
.revnote{margin:16px 0 0;color:var(--mute);font-size:13px}
@media(max-width:760px){.top{flex-wrap:wrap;gap:8px;padding:8px 12px}.brand{font-size:17px}.hm{display:none}.hsearch{order:3;flex:1 1 60%;min-width:0;max-width:none;margin:0}.dealsbtn{order:4;margin-left:0}.hbtn .lbl{display:none}.hbtn{padding:0 10px}.rmenu{right:-60px}}

.ctabtn{display:inline-block;align-self:flex-start;margin-top:6px;padding:10px 20px;border-radius:999px;background:var(--accent);color:#04281a;font:700 14px var(--body)}
.dealbar:hover .ctabtn{background:#6ee7b7}
.gpbar{display:flex;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}
.gpbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:16px 10px;background:none;border:0;border-right:1px solid var(--line);color:var(--text);font:700 15px/1.2 var(--display);cursor:pointer}
.gpbar button:last-child{border-right:0}
.gpbar button small{color:var(--mute);font:400 12px var(--body)}
.gpbar button:hover{background:var(--surface2)}
.gpbar button.on{background:var(--green)}
.gpbar button.on small{color:#d6f5e3}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin-top:16px}
.moreb{display:block;margin:22px auto 0;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:11px 28px;font:600 14px var(--body);cursor:pointer}
.moreb[hidden]{display:none}
.tag.gp{background:var(--green);border-color:var(--accent);color:#fff}
aside select{width:100%;height:42px;margin-top:6px;padding:0 10px;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:10px;font:500 14px var(--body)}
.bar{display:none}
@media(min-width:1100px){#grid,.cards{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:760px){.bar{display:flex}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.gpbar button{font-size:13px;padding:12px 6px}}

.rowwrap{position:relative}
.rarrow{position:absolute;top:34%;z-index:5;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(10,26,21,.92);color:var(--text);font:400 26px/1 var(--body);cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.rarrow:hover{border-color:var(--accent);background:var(--green)}
.rarrow.r{right:-8px}
.rarrow.l{left:-8px}
.rarrow[hidden]{display:none}
.seeall{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;border:1px dashed var(--accent);border-radius:14px;background:var(--surface);color:var(--text);text-decoration:none;text-align:center}
.seeall b{font:700 19px var(--display);color:var(--accent)}
.seeall span{color:var(--mute);font-size:13px}
.seeall:hover{background:var(--surface2)}
.gpbig{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(100deg,#0f6b3a,#0b3a2c)}
.gphead{display:flex;align-items:center;gap:14px;padding:24px 28px}
.gpmark{width:46px;height:46px;flex:none}
.gpimg{height:46px;width:auto}
.gpword{font:800 clamp(22px,3.4vw,36px)/1 var(--display);letter-spacing:.07em}
.gpbig .gpbar{border:0;border-top:1px solid rgba(255,255,255,.16);border-radius:0;background:rgba(0,0,0,.2)}
.gpbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:16px 10px;border-right:1px solid rgba(255,255,255,.12);color:var(--text);text-decoration:none;font:700 15px/1.2 var(--display)}
.gpbar a:last-child{border-right:0}
.gpbar a small{color:#bfe9d3;font:400 12px var(--body)}
.gpbar a:hover,.gpbar a.on{background:rgba(255,255,255,.12)}
.gpbar a.on{box-shadow:inset 0 -3px 0 var(--accent)}
.cmp{width:100%;border-collapse:collapse;margin-top:14px;font-size:14px}
.cmp th{text-align:left;color:var(--mute);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
.cmp td{padding:8px;border-bottom:1px solid var(--line)}
.cmp th:not(:first-child),.cmp td:not(:first-child){text-align:right}
.cmp td s{color:var(--mute);font-size:12px;margin-right:6px}
.cmp tr.best td{color:var(--accent);font-weight:700}
.cmp .rg{display:flex;align-items:center;gap:8px}
@media(max-width:760px){.rarrow{width:36px;height:36px;font-size:22px;right:-4px}.rarrow.l{left:-4px}.gphead{padding:18px}.gpmark,.gpimg{width:36px;height:36px}.gpbar a{padding:12px 6px;font-size:13px}}

.tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.tools .hbtn{height:36px;padding:0 14px;font-size:13px}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;background:var(--green);border:1px solid var(--accent);border-radius:999px;color:#fff;font:600 13px var(--body);cursor:pointer}
.chip[hidden]{display:none}
.tools:not(:has(*:not([hidden]))){display:none}
body.wishview aside,body.wishview .bar,body.wishview #sidetoggle{display:none!important}
@media(min-width:761px){.layout.noside aside{display:none}}
@media(max-width:760px){#sidetoggle{display:none}}

.newtag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;background:var(--accent);color:#04281a;font:800 10px/1 var(--display);font-style:normal;letter-spacing:.06em}
.subs{flex-wrap:wrap;max-width:calc(100% - 52px)}
.tag.newp{background:var(--accent);border-color:var(--accent);color:#04281a;font-weight:700}
.rh b#cnt{color:var(--text);font:700 14px var(--display)}
.tools input[type=search]{height:36px;min-width:220px;padding:0 14px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:999px;font:500 13px var(--body)}
.tools input[hidden]{display:none}
.dealsbtn{background:var(--green);border-color:var(--accent)}
.dealsbtn:hover{background:#15a015}

.brand{font:500 28px/1 "Oxanium",sans-serif;letter-spacing:-.02em}.brand small{font-size:.78em}.brand .bg{color:#218F36}.brand .bo{color:#E9861E}.brand .bk{color:#777}
@media(max-width:760px){.brand{font-size:17px}.top .hbtn{padding:0 8px;gap:5px}.top .hright{gap:6px}}

/* Platform switch, first-visit picker and the PlayStation colors */
.plat{display:flex;height:42px;padding:3px;gap:3px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.plat button{border:0;border-radius:9px;padding:0 12px;background:none;color:var(--mute);font:600 13px var(--body);cursor:pointer;white-space:nowrap}
.plat button:hover{color:var(--text)}
.plat button.sel{background:var(--green);color:#fff}
.plat .sh{display:none}
.rnote{margin:6px 8px;color:var(--mute);font-size:13px;max-width:220px}
.pickbox{width:min(440px,100%);text-align:center}
.pickbox h3{margin:0 0 4px}
.pickbtns{display:flex;gap:12px;margin-top:18px}
.pick{flex:1;height:72px;border-radius:14px;border:1px solid var(--line);color:#fff;font:700 18px var(--display);cursor:pointer}
.pick.xbox{background:#107c10}
.pick.ps{background:#0070d1}
.pick:hover{filter:brightness(1.12)}
html.ps{--bg:#0a1222;--surface:#101b30;--surface2:#16243e;--line:#233656;--text:#eaf0fa;--mute:#93a6c4;--accent:#5aa9ff;--green:#0070d1}
html.ps .top{background:rgba(10,18,34,.9)}
html.ps .bar{background:rgba(10,18,34,.85)}
html.ps .rarrow{background:rgba(10,18,34,.92)}
html.ps .overlay{background:rgba(3,7,16,.74)}
html.ps .pbtn:not(.ghost):not(.on){color:#04162e}
html.ps .dealsbtn:hover{background:#1a84e6}
@media(max-width:760px){.plat button{padding:0 9px}.plat .lbl{display:none}.plat .sh{display:inline}}
html.ps body::before{background:radial-gradient(60% 130% at 15% 0%,rgba(90,169,255,.18),transparent 70%),radial-gradient(45% 110% at 95% 0%,rgba(0,112,209,.30),transparent 70%)}
html.ps .dealbar{background:linear-gradient(100deg,#0a4f9c,#0c2a52 70%)}
html.ps .dealimgs::after{background:linear-gradient(90deg,#0b4485 0%,rgba(11,68,133,0) 48%)}
html.ps .dealimgs img{background:#14325e}
html.ps .ctabtn{color:#04162e}
html.ps .dealbar:hover .ctabtn{background:#8cc4ff}
.sub.psplus{background:#f5b800;color:#1d1600;border-color:#ffe08a88}
.sub.eaplay{background:#e3262f;border-color:#ff8a8f88}

/* Screenshot gallery in the game pop-up, and the full-size viewer */
.gshots{display:flex;gap:8px;overflow-x:auto;width:0;min-width:100%;margin-top:14px;padding-bottom:6px;scroll-snap-type:x mandatory}
.gshot{flex:0 0 auto;width:208px;aspect-ratio:16/9;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface2);cursor:zoom-in;scroll-snap-align:start}
.gshot:hover{border-color:var(--accent)}
.gshot img{width:100%;height:100%;object-fit:cover;display:block}
.gview{z-index:70;background:rgba(0,0,0,.9)}
.gview img{max-width:min(1600px,92vw);max-height:84vh;border-radius:10px}
.gvn{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);color:#fff;font:600 13px var(--body);opacity:.8}
.gvnav{position:fixed;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.5);color:#fff;font:400 30px/1 var(--body);cursor:pointer}
.gvnav.l{left:14px}.gvnav.r{right:14px}
.gview .mclose{position:fixed;top:14px;right:14px}
@media(max-width:560px){.gshot{width:160px}.gvnav{width:40px;height:40px}}

/* Genres and trailers in the game pop-up */
.ggen{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ggen:empty{display:none}
.gen{padding:3px 9px;border-radius:999px;border:1px solid var(--line);color:var(--mute);font:500 12px var(--body)}
.gvideo{position:relative}
.gvideo .gplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.6);border:2px solid #fff;color:#fff;font-size:16px;padding-left:3px}
.gvideo .gvt{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 6px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font:600 11px var(--body);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* a fixed 16:9 box, so the video doesn't start small and grow as the stream's quality rises */
.gview video{width:min(1600px,92vw,calc(84vh * 16 / 9));aspect-ratio:16/9;height:auto;object-fit:contain;border-radius:10px;background:#000}
.gview img[hidden],.gview video[hidden]{display:none}
.gvn{max-width:80vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}