/* Gamers Bangladesh store. Colour themes are set with CSS variables (body.theme-KEY); dark headers also get body.head-dark. */
:root, body.theme-blue {
  --brand: #2563eb; --brand-d: #1d4ed8; --brand-dd: #1546c4; --brand-soft: #e8f0ff; --brand-softer: #eef4ff;
  --hero-a: #1546c4; --hero-b: #3b82f6; --hero-accent: #bfe0ff; --hero-text: #dbe7ff;
  --head-bg: #fff; --head-ink: #0f1a33; --head-muted: #5b6782; --head-line: #e2e8f4; --search-bg: #f1f5fd;
  --foot-bg: #0b1d45; --foot-ink: #a8b8dc;
  --bg: #f5f8ff; --card: #fff; --ink: #0f1a33; --muted: #5b6782; --line: #e2e8f4;
  --ok-bg: #e8f0ff; --ok-ink: #1d4ed8; --on-brand: #fff;
  --warn: #f5a524; --warn-bg: #fff6e5; --warn-ink: #8a5200; --bad-bg: #fdecec; --bad-ink: #b42318;
  --good-bg: #e7f7ee; --good-ink: #127a3f;
  --logo-filter: none;
}
body.theme-green {
  --brand: #2d6a22; --brand-d: #22511a; --brand-dd: #193b13; --brand-soft: #e6f7d9; --brand-softer: #f1fbea;
  --hero-a: #193b13; --hero-b: #2d6a22; --hero-accent: #8be04e; --hero-text: #d7e8cf;
  --head-bg: #193b13; --head-ink: #fff; --head-muted: #d7e8cf; --head-line: #193b13; --search-bg: rgba(255,255,255,.1);
  --foot-bg: #0f2a0c; --foot-ink: #a9c49d;
  --bg: #f3f6f1; --ink: #15210f; --muted: #5d6b57; --line: #e2e8de;
  --ok-bg: #e6f7d9; --ok-ink: #2f7a12; --on-brand: #fff;
  --logo-filter: brightness(0) invert(1);
}
body.theme-purple {
  --brand: #6d28d9; --brand-d: #5b21b6; --brand-dd: #2a1259; --brand-soft: #ede5fd; --brand-softer: #f5f0fe;
  --hero-a: #2a1259; --hero-b: #7c3aed; --hero-accent: #c4b5fd; --hero-text: #e2d9fb;
  --head-bg: #2a1259; --head-ink: #fff; --head-muted: #d6c9f5; --head-line: #2a1259; --search-bg: rgba(255,255,255,.1);
  --foot-bg: #1a0a3a; --foot-ink: #b9a9e3;
  --bg: #f6f3fd; --ink: #1c1233; --muted: #625a78; --line: #e6e0f3;
  --ok-bg: #ede5fd; --ok-ink: #5b21b6; --on-brand: #fff;
  --logo-filter: brightness(0) invert(1);
}
body.theme-orange {
  --brand: #c2410c; --brand-d: #9a3412; --brand-dd: #7c2d12; --brand-soft: #ffedd5; --brand-softer: #fff5eb;
  --hero-a: #9a3412; --hero-b: #f97316; --hero-accent: #fed7aa; --hero-text: #ffe8d4;
  --head-bg: #fff; --head-ink: #2a1408; --head-muted: #6f5a4c; --head-line: #f1e2d6; --search-bg: #fff5ee;
  --foot-bg: #3b1607; --foot-ink: #e3b99c;
  --bg: #fff8f3; --ink: #2a1408; --muted: #6f5a4c; --line: #f1e2d6;
  --ok-bg: #ffedd5; --ok-ink: #9a3412; --on-brand: #fff;
  --logo-filter: none;
}
body.theme-midnight {
  --brand: #a16207; --brand-d: #854d0e; --brand-dd: #0f172a; --brand-soft: #fdf3d7; --brand-softer: #fef9ea;
  --hero-a: #0f172a; --hero-b: #1e3a5f; --hero-accent: #fbbf24; --hero-text: #d6dfec;
  --head-bg: #0f172a; --head-ink: #fff; --head-muted: #cbd5e1; --head-line: #0f172a; --search-bg: rgba(255,255,255,.08);
  --foot-bg: #080d1a; --foot-ink: #9aa8bd;
  --bg: #f6f6f2; --ink: #111827; --muted: #5d6474; --line: #e5e4dc;
  --ok-bg: #fdf3d7; --ok-ink: #854d0e; --on-brand: #fff;
  --logo-filter: brightness(0) invert(1);
}
body.theme-red {
  --brand: #c81e1e; --brand-d: #a11717; --brand-dd: #7f1414; --brand-soft: #fde4e4; --brand-softer: #fff0f0;
  --hero-a: #991b1b; --hero-b: #ef4444; --hero-accent: #fecaca; --hero-text: #ffe1e1;
  --head-bg: #fff; --head-ink: #2a0e0e; --head-muted: #6e5656; --head-line: #f1dddd; --search-bg: #fff4f4;
  --foot-bg: #3a0c0c; --foot-ink: #e0aaaa;
  --bg: #fff6f6; --ink: #2a0e0e; --muted: #6e5656; --line: #f1dddd;
  --ok-bg: #fde4e4; --ok-ink: #a11717; --on-brand: #fff;
  --logo-filter: none;
}
body.theme-teal {
  --brand: #0f766e; --brand-d: #115e59; --brand-dd: #134e4a; --brand-soft: #d9f5f1; --brand-softer: #ecfaf8;
  --hero-a: #115e59; --hero-b: #14b8a6; --hero-accent: #99f6e4; --hero-text: #d5f7f1;
  --head-bg: #fff; --head-ink: #0c2321; --head-muted: #52686a; --head-line: #dcebe9; --search-bg: #f0f9f8;
  --foot-bg: #082f2c; --foot-ink: #9cc9c3;
  --bg: #f2fbfa; --ink: #0c2321; --muted: #52686a; --line: #dcebe9;
  --ok-bg: #d9f5f1; --ok-ink: #115e59; --on-brand: #fff;
  --logo-filter: none;
}
body.theme-pink {
  --brand: #be185d; --brand-d: #9d174d; --brand-dd: #1e0b2e; --brand-soft: #fce4ef; --brand-softer: #fdf0f6;
  --hero-a: #1e0b2e; --hero-b: #6b1d5c; --hero-accent: #f9a8d4; --hero-text: #f3d7e8;
  --head-bg: #1e0b2e; --head-ink: #fff; --head-muted: #e3c8dc; --head-line: #1e0b2e; --search-bg: rgba(255,255,255,.1);
  --foot-bg: #13061f; --foot-ink: #c7a5bf;
  --bg: #fbf4f8; --ink: #24101e; --muted: #6c5866; --line: #efdfe8;
  --ok-bg: #fce4ef; --ok-ink: #9d174d; --on-brand: #fff;
  --logo-filter: brightness(0) invert(1);
}
/* Dark mode (html.dark): follows the customer's device unless they press the sun/moon button. Each theme keeps its own colour. */
html.dark{color-scheme:dark}
html.dark body {
  --bg: #0b1220; --card: #121b2e; --ink: #e7ecf5; --muted: #9aa6bd; --line: #233150;
  --brand: #3b82f6; --brand-d: #2563eb; --brand-soft: rgba(59,130,246,.18); --brand-softer: rgba(59,130,246,.10);
  --head-bg: #0f1729; --head-ink: #e7ecf5; --head-muted: #a9b5cc; --head-line: #1c2842; --search-bg: rgba(255,255,255,.07);
  --foot-bg: #070c17; --foot-ink: #93a0b8;
  --ok-bg: rgba(59,130,246,.16); --ok-ink: #93c5fd; --on-brand: #fff;
  --warn-bg: rgba(245,165,36,.14); --warn-ink: #fcc463; --bad-bg: rgba(239,68,68,.15); --bad-ink: #fca5a5;
  --good-bg: rgba(34,197,94,.14); --good-ink: #86efac;
  --logo-filter: brightness(0) invert(1);
}
html.dark body.theme-green { --bg: #0a110a; --card: #121c11; --line: #243422; --head-bg: #0f1a0d; --head-line: #1a2a17; --foot-bg: #060c05; --brand: #3f9a2e; --brand-d: #327c24; --brand-soft: rgba(110,190,80,.18); --brand-softer: rgba(110,190,80,.10); --ok-bg: rgba(110,190,80,.16); --ok-ink: #a6e48a; --hero-a: #133010; --hero-b: #2d6a22; }
html.dark body.theme-purple { --bg: #0e0a19; --card: #171128; --line: #2b2244; --head-bg: #150e2a; --head-line: #221a3d; --foot-bg: #08051a; --brand: #8b5cf6; --brand-d: #7c3aed; --brand-soft: rgba(139,92,246,.2); --brand-softer: rgba(139,92,246,.11); --ok-bg: rgba(139,92,246,.18); --ok-ink: #c9b8ff; --hero-a: #1f0d45; }
html.dark body.theme-orange { --bg: #130c07; --card: #1d140d; --line: #38271b; --head-bg: #1a110a; --head-line: #2c1f15; --foot-bg: #0c0703; --brand: #ea580c; --brand-d: #c2410c; --brand-soft: rgba(249,115,22,.18); --brand-softer: rgba(249,115,22,.10); --ok-bg: rgba(249,115,22,.16); --ok-ink: #fdba74; --hero-a: #7c2d12; --hero-b: #c2410c; }
html.dark body.theme-midnight { --bg: #090e1a; --card: #111827; --line: #253147; --head-bg: #0b1222; --head-line: #18233a; --foot-bg: #050913; --brand: #ca8a04; --brand-d: #a16207; --brand-soft: rgba(234,179,8,.16); --brand-softer: rgba(234,179,8,.09); --ok-bg: rgba(234,179,8,.15); --ok-ink: #fcd34d; }
html.dark body.theme-red { --bg: #130909; --card: #1d1111; --line: #3a2020; --head-bg: #1a0d0d; --head-line: #2d1818; --foot-bg: #0c0505; --brand: #dc2626; --brand-d: #b91c1c; --brand-soft: rgba(239,68,68,.18); --brand-softer: rgba(239,68,68,.10); --ok-bg: rgba(239,68,68,.16); --ok-ink: #fca5a5; --hero-a: #7f1414; --hero-b: #c81e1e; }
html.dark body.theme-teal { --bg: #061211; --card: #0e1d1b; --line: #1e3633; --head-bg: #0a1a18; --head-line: #152a27; --foot-bg: #030b0a; --brand: #0d9488; --brand-d: #0f766e; --brand-soft: rgba(20,184,166,.18); --brand-softer: rgba(20,184,166,.10); --ok-bg: rgba(20,184,166,.16); --ok-ink: #5eead4; --hero-a: #0b3f3b; --hero-b: #0f766e; }
html.dark body.theme-pink { --bg: #11071a; --card: #1b0f26; --line: #362141; --head-bg: #170a23; --head-line: #261535; --foot-bg: #0a0411; --brand: #db2777; --brand-d: #be185d; --brand-soft: rgba(236,72,153,.18); --brand-softer: rgba(236,72,153,.10); --ok-bg: rgba(236,72,153,.16); --ok-ink: #f9a8d4; }
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,"Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit;text-decoration:none}
a.link,.link{color:var(--brand);font-weight:600}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px;width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.muted{color:var(--muted)}
.small{font-size:13px}
.center{text-align:center}
.mt{margin-top:16px}.mt2{margin-top:24px}.mb{margin-bottom:16px}

/* bars */
.testbar{background:#fef3c7;color:#7c4a03;font-size:13px;font-weight:600;text-align:center;padding:6px 12px}
.notice{background:var(--brand-dd);color:#fff;font-size:13.5px;font-weight:600;text-align:center;padding:8px 12px}
.npop{position:fixed;inset:0;background:rgba(10,15,30,.5);display:grid;place-items:center;padding:16px;z-index:100}
.npop[hidden]{display:none}
[hidden]{display:none!important}
.npop-box{background:var(--card);color:var(--ink);border-radius:16px;border-top:6px solid var(--brand);max-width:440px;width:100%;padding:22px 22px 18px;position:relative;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.npop-box b{display:block;font-size:17px;color:var(--brand);margin-bottom:8px;padding-right:28px}
.npop-box p{margin-bottom:16px;white-space:normal}
.npop-x{position:absolute;top:10px;right:12px;background:none;border:0;font-size:26px;line-height:1;color:var(--muted);cursor:pointer}

/* header */
.top{background:var(--head-bg);color:var(--head-ink);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--head-line);box-shadow:0 2px 12px rgba(15,40,100,.05)}
.top .wrap{display:flex;align-items:center;gap:18px;height:72px}
.logo{flex:none}
.logo img{height:42px;width:auto;filter:var(--logo-filter)}
.nav{display:flex;gap:4px;font-weight:600;font-size:14px;color:var(--head-muted);margin-left:14px;padding-left:18px;border-left:1px solid var(--head-line)}
.nav a{padding:8px 11px;border-radius:9px;white-space:nowrap}
.nav a:hover{color:var(--brand)}
.nav a.on{color:var(--brand);background:var(--brand-softer)}
body.head-dark .nav a.on,html.dark .nav a.on{background:rgba(255,255,255,.1)}
body.head-dark .nav a.on,body.head-dark .nav a:hover,html.dark .nav a.on,html.dark .nav a:hover{color:#fff}
.search{flex:1;max-width:380px;min-width:160px;margin-left:auto;background:var(--search-bg);border:1px solid var(--head-line);border-radius:12px;height:42px;display:flex;align-items:center;gap:10px;padding:0 14px;color:var(--head-muted)}
.search input{border:0;background:transparent;outline:0;flex:1;font:inherit;color:var(--head-ink);min-width:0}
.search input::placeholder{color:var(--head-muted)}
.acct{display:flex;align-items:center;gap:10px}
.wallet-pill{display:inline-flex;align-items:center;gap:7px;background:var(--brand-soft);color:var(--brand);border-radius:10px;height:40px;padding:0 13px;font-weight:700;font-size:13.5px;white-space:nowrap}
.wallet-pill svg{width:17px;height:17px}
.acct-btn{display:flex;align-items:center;gap:8px;padding:3px 10px 3px 3px;border:1px solid var(--head-line);border-radius:999px;font-weight:700;font-size:14px;color:var(--head-ink)}
.acct-btn:hover{border-color:var(--brand)}
.acct-btn .avatar{width:34px;height:34px;font-size:14px}
.acct-btn .chev{color:var(--head-muted)}
body.head-dark .wallet-pill,html.dark .wallet-pill{background:rgba(255,255,255,.12);color:var(--hero-accent)}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;flex:none}
body.head-dark .avatar,html.dark .avatar{background:var(--hero-accent);color:var(--foot-bg)}
.btn-login{border:1px solid var(--head-line);border-radius:10px;padding:9px 16px;font-weight:700;font-size:14px;color:var(--brand);white-space:nowrap}
body.head-dark .btn-login,html.dark .btn-login{border-color:rgba(255,255,255,.3);color:#fff}
.iconbtn{width:38px;height:38px;border-radius:10px;background:var(--search-bg);display:none;place-items:center;color:var(--head-muted)}
.dropdown{position:relative}
.dropdown summary{list-style:none;cursor:pointer}
.dropdown summary::-webkit-details-marker{display:none}
.dropdown .menu{position:absolute;right:0;top:50px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(15,40,100,.12);min-width:250px;padding:8px;z-index:30}
.dropdown .menu a,.dropdown .menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;border-radius:10px;font:inherit;font-size:14px;font-weight:600;background:none;border:0;cursor:pointer;color:var(--ink)}
.dropdown .menu a:hover,.dropdown .menu button:hover{background:var(--brand-softer)}
.dropdown .menu .who{display:flex;align-items:center;gap:10px;padding:8px 10px 12px;border-bottom:1px solid var(--line);margin-bottom:6px;font-size:12.5px;color:var(--muted);word-break:break-all}
.dropdown .menu .who b{display:block;color:var(--ink);font-size:14px;word-break:normal}
.dropdown .menu svg{width:17px;height:17px;flex:none;color:var(--muted)}
.dropdown .menu em{font-style:normal;margin-left:auto;color:var(--muted);font-size:13px}
.dropdown .menu form{border-top:1px solid var(--line);margin-top:6px;padding-top:6px}
.dropdown .menu button.out,.dropdown .menu button.out svg{color:var(--bad-ink)}
.dropdown .menu button.out:hover{background:var(--bad-bg)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;font-weight:800;font-size:16px;height:52px;padding:0 24px;border:0;cursor:pointer;font-family:inherit;text-align:center}
.btn-main{background:var(--brand);color:var(--on-brand)}
.btn-main:hover{background:var(--brand-d)}
.btn-light{background:var(--card);color:var(--brand);border:1.5px solid var(--line)}
.btn-ghost{background:transparent;color:var(--brand);border:1.5px solid var(--line)}
.btn-sm{height:40px;font-size:14px;padding:0 16px;border-radius:10px}
.btn-block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* badges */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}
.b-instant{background:var(--ok-bg);color:var(--ok-ink)}
.b-manual{background:#fff3dc;color:#9a5b00}
.b-out{background:#eef0f4;color:#7a8295}
.b-ok{background:var(--good-bg);color:var(--good-ink)}
.b-wait{background:#fff3dc;color:#9a5b00}
.b-bad{background:var(--bad-bg);color:var(--bad-ink)}
.b-muted{background:#eef0f4;color:#5b6782}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor}

.card{background:var(--card);border:1px solid var(--line);border-radius:18px}
.pad{padding:20px}
h1.page{font-size:26px;font-weight:900;letter-spacing:-.5px;margin:22px 0 16px}
h2.sec{font-size:20px;font-weight:800;letter-spacing:-.3px;display:flex;justify-content:space-between;align-items:baseline;margin:34px 0 14px}
h2.sec a{font-size:14px;color:var(--brand);font-weight:700}

/* alerts */
.alert{border-radius:12px;padding:12px 14px;font-size:14px;margin:14px 0;font-weight:500}
.alert-ok{background:var(--good-bg);color:var(--good-ink)}
.alert-bad{background:var(--bad-bg);color:var(--bad-ink)}
.alert-warn{background:var(--warn-bg);color:var(--warn-ink)}
.alert-info{background:#eef6ff;color:#1e4b8f}
.alert ul{margin-left:18px}

/* hero */
.hero{margin-top:20px;border-radius:24px;background:linear-gradient(120deg,var(--hero-a),var(--hero-b));color:#fff;padding:44px 40px;display:grid;grid-template-columns:1.1fr 1fr;gap:20px;align-items:center;overflow:hidden;position:relative}
.hero h1{font-size:40px;line-height:1.1;font-weight:900;letter-spacing:-1px}
.hero h1 span{color:var(--hero-accent)}
.hero p{color:var(--hero-text);margin:14px 0 22px;font-size:16px;max-width:460px}
.hero .btn{background:#fff;color:var(--brand-dd)}
.hero .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.hero .tiles img{border-radius:16px;aspect-ratio:1;width:100%;height:auto;object-fit:cover;box-shadow:0 10px 30px rgba(0,0,0,.25);background:#fff}
.hero .tiles img:nth-child(odd){transform:rotate(-3deg)}
.hero .tiles img:nth-child(even){transform:rotate(3deg) translateY(8px)}
.slides{position:relative}
.slide{display:none}.slide.on{display:grid}
.dots{display:flex;gap:6px;margin-top:20px}
.dots button{width:8px;height:8px;border-radius:99px;background:rgba(255,255,255,.4);border:0;cursor:pointer}
.dots button.on{width:26px;background:#fff}

/* trust row */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.trust .t{display:flex;gap:12px;align-items:center;padding:14px 16px}
.trust .ti{width:40px;height:40px;border-radius:12px;background:var(--brand-soft);display:grid;place-items:center;flex:none;font-size:18px}
.trust b{display:block;font-size:14px}.trust small{color:var(--muted);font-size:13px}

/* chips */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:9px 16px;font-weight:600;font-size:14px}
.chip.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* product grid */
.grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.pc{padding:10px;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s;min-width:0}
.pc:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(15,40,100,.08)}
.pc img{border-radius:12px;aspect-ratio:1;object-fit:cover;width:100%;height:auto;background:#eef2f8}
.pc b{display:block;font-size:14.5px;margin-top:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .from{font-size:13px;color:var(--muted)}
.pc .from strong{color:var(--brand);font-weight:800}
.pc .badge{margin-top:8px;align-self:flex-start}
.pc.out{opacity:.6}
.empty{padding:40px 20px;text-align:center;color:var(--muted)}

/* how it works */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.step{padding:20px}
.step .n{width:32px;height:32px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:12px}
.step b{display:block;font-size:16px;margin-bottom:4px}.step p{color:var(--muted);font-size:14px}
.paybadges{margin-top:14px;font-size:13px;color:var(--muted);text-align:center}

/* product page */
.crumb{font-size:13px;color:var(--muted);margin:18px 0 14px}
.crumb a:hover{color:var(--brand)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start}
.phead{display:flex;gap:18px;align-items:center;padding:18px}
.phead img{width:96px;height:96px;border-radius:14px;object-fit:cover;flex:none}
.phead h1{font-size:26px;letter-spacing:-.5px;font-weight:900;line-height:1.2}
.phead .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;font-size:13px;color:var(--muted);align-items:center}
.box{padding:20px;margin-top:14px}
.box h2{font-size:17px;font-weight:800;display:flex;align-items:center;gap:10px;margin-bottom:14px}
.box h2 .n{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-size:14px;display:grid;place-items:center;flex:none}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
label.l{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.inp,select.inp,textarea.inp{width:100%;height:50px;border:1.5px solid var(--line);border-radius:12px;padding:0 14px;font:inherit;font-size:15px;background:var(--card);color:var(--ink);outline:0}
textarea.inp{height:auto;min-height:110px;padding:12px 14px;resize:vertical}
.inp:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.inp.err{border-color:var(--bad-ink)}
.ferr{color:var(--bad-ink);font-size:12.5px;margin-top:5px;font-weight:600}
.hint{font-size:12.5px;color:var(--muted);margin-top:6px}
.warnbox{background:var(--warn-bg);color:var(--warn-ink);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;margin-top:12px}
.pk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.p{border:1.5px solid var(--line);border-radius:14px;padding:12px;position:relative;background:var(--card);cursor:pointer;display:block;min-width:0}
.p input{position:absolute;opacity:0;pointer-events:none}
.p .amt{font-weight:800;font-size:15px;display:block;overflow-wrap:anywhere}
.p .amt small{display:block;font-weight:500;color:var(--muted);font-size:12px}
.p .pr{font-weight:800;color:var(--brand);margin-top:8px;font-size:15px;display:block}
.p .pr s{color:var(--muted);font-weight:500;font-size:12px;margin-left:4px}
.p:has(input:checked){border-color:var(--brand);background:var(--brand-softer);box-shadow:0 0 0 3px var(--brand-soft)}
.p:has(input:checked)::after{content:"✓";position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;display:grid;place-items:center;font-weight:900}
.p:has(input:focus-visible){outline:2px solid var(--brand)}
.p .tag{position:absolute;top:-9px;left:10px;background:var(--warn);color:#3b2600;font-size:10.5px;font-weight:800;border-radius:6px;padding:2px 7px}
.p.off{opacity:.5;cursor:not-allowed}
.p.off .pr{color:#888}
/* Package sections: a title with a thin line, a short text, then the section's packages. Long titles wrap and keep a short line. */
.pks-g{--sc:var(--bad-ink);--sb:var(--bad-bg)}
.pks-orange{--sc:var(--warn-ink);--sb:var(--warn-bg)}
.pks-green{--sc:var(--good-ink);--sb:var(--good-bg)}
.pks-brand{--sc:var(--brand);--sb:var(--brand-soft)}
html.dark .pks-brand{--sc:var(--ok-ink)}
.pks-grey{--sc:var(--muted);--sb:color-mix(in srgb,var(--muted) 14%,transparent)}
.pks-g+.pks-g{margin-top:22px}
.pk-or+.pks-g,.cust+.pks-g{margin-top:14px}
.pks{margin:0 0 12px}
.pks-h{display:flex;align-items:flex-start;gap:10px}
.pks-h b{font-size:15.5px;font-weight:800;line-height:1.3;min-width:0;overflow-wrap:anywhere}
.pks-h::after{content:"";flex:1 0 24px;height:1px;background:var(--line);margin-top:10px}
.pks-badge{flex:none;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:var(--sb);color:var(--sc);padding:3px 8px;border-radius:6px;line-height:1.3}
.pks-t{font-size:13px;color:var(--muted);margin:4px 0 0;overflow-wrap:anywhere}
.pks-t em{font-style:normal;font-weight:700;color:var(--sc);white-space:nowrap}
/* Highlight box: a tint of the section colour behind the whole section */
.pks-box{background:color-mix(in srgb,var(--sb) 75%,var(--card));border:1.5px solid color-mix(in srgb,var(--sc) 28%,transparent);border-radius:16px;padding:14px}
.pks-box .pks-badge{background:var(--card)}
.pks-box .pks-h::after{background:color-mix(in srgb,var(--sc) 25%,transparent)}
@media (max-width:760px){.pks-box{padding:12px 10px;border-radius:14px}}
/* Start closed: a "Show N packages" button opens the section */
.pks-more>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border:1.5px dashed var(--line);border-radius:12px;font-weight:700;font-size:14px;color:var(--brand);background:var(--card)}
html.dark .pks-more>summary{color:var(--ok-ink)}
.pks-more>summary::-webkit-details-marker{display:none}
.pks-more>summary::after{content:"";width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.pks-more[open]>summary{margin-bottom:12px}
.pks-more[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.pks-more .pks-hide,.pks-more[open] .pks-show{display:none}
.pks-more[open] .pks-hide{display:inline}
.pks-more>summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.qty{display:flex;align-items:center;gap:12px;margin-top:16px;font-weight:700;font-size:14px}
.ctr{display:flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card)}
.ctr button{width:40px;height:38px;border:0;background:var(--card);font-size:18px;cursor:pointer;color:var(--ink)}
.ctr input{width:46px;height:38px;border:0;border-left:1.5px solid var(--line);border-right:1.5px solid var(--line);text-align:center;font:inherit;font-weight:700;-moz-appearance:textfield}
.ctr input::-webkit-outer-spin-button,.ctr input::-webkit-inner-spin-button{-webkit-appearance:none}
.pays{display:grid;gap:10px}
.pays.two{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.pay{display:flex;align-items:center;gap:14px;border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;background:var(--card);cursor:pointer;position:relative}
.pay input{position:absolute;opacity:0}
.pay .radio{width:20px;height:20px;border-radius:50%;border:2px solid #b8c4d6;flex:none}
.pay:has(input:checked){border-color:var(--brand);background:var(--brand-softer)}
.pay:has(input:checked) .radio{border:6px solid var(--brand)}
.pay.off{opacity:.55;cursor:not-allowed}
.plogo{width:56px;height:34px;border-radius:8px;display:grid;place-items:center;font-weight:900;font-size:14px;color:#fff;flex:none;background:var(--brand)}
.plogo.dark{background:var(--foot-bg)}
.plogo svg{width:24px;height:24px}
.plogo.img{width:72px;background:#fff;border:1px solid var(--line)}.plogo.img img{max-width:62px;max-height:28px;width:auto;height:auto}
.pmarks{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.pmarks img{height:22px;width:auto;border-radius:5px;border:1px solid var(--line)}
.pay b{display:block;font-size:15px}.pay small{color:var(--muted);font-size:12.5px}
.pay .right{margin-left:auto;font-weight:800;font-size:14px;color:var(--brand);white-space:nowrap}
.sum{padding:20px;position:sticky;top:84px}
.sum h3{font-size:17px;margin-bottom:12px}
.row{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:6px 0;color:var(--muted)}
.row b{color:var(--ink);text-align:right;overflow-wrap:anywhere}
.total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed var(--line);margin-top:8px;padding-top:12px}
.total b{font-size:28px;font-weight:900;letter-spacing:-.5px;color:var(--brand-dd)}
.sum .btn{margin-top:14px}
.safe{font-size:12px;color:var(--muted);text-align:center;margin-top:10px;line-height:1.6}
.info{padding:6px 20px;margin-top:14px}
.info details{border-bottom:1px solid var(--line)}
.info details:last-child{border:0}
.info summary{display:flex;justify-content:space-between;padding:14px 0;font-weight:700;font-size:15px;cursor:pointer;list-style:none}
.info summary::-webkit-details-marker{display:none}
.info summary::after{content:"+";font-weight:700}
.info details[open] summary::after{content:"−"}
.info .body{padding:0 0 14px;color:var(--muted);font-size:14px}
.info .faq .qa{padding:10px 0;border-top:1px dashed var(--line)}.info .faq .qa:first-child{border-top:0;padding-top:0}
.info .faq .qa h3{font-size:14px;font-weight:700;color:var(--ink);margin:0 0 4px}.info .faq .qa .prose p{margin:0 0 6px}
.cat-intro{color:var(--muted);font-size:14.5px;max-width:860px;margin:-6px 0 16px}.cat-intro p{margin:0 0 8px}
.prose p{margin:0 0 10px}.prose ul,.prose ol{margin:0 0 10px 20px}.prose h2,.prose h3{margin:16px 0 8px;color:var(--ink)}
.prose a{color:var(--brand);text-decoration:underline}
.sticky-buy{display:none}

/* checkout */
.prog{display:flex;align-items:center;gap:8px;margin:22px 0 18px;font-size:13px;font-weight:700;color:var(--muted)}
.prog .s{display:flex;align-items:center;gap:8px}
.prog .c{width:26px;height:26px;border-radius:50%;border:2px solid #c4cfdf;display:grid;place-items:center;font-size:12px}
.prog .done .c{background:var(--brand);border-color:var(--brand);color:#fff}
.prog .now{color:var(--ink)}.prog .now .c{border-color:var(--brand);color:var(--brand)}
.prog .bar{flex:1;height:2px;background:#d4dcea;max-width:80px}
.prog .bar.done{background:var(--brand)}
.item{display:flex;gap:14px;align-items:center}
.item img{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none}
.item b{font-size:16px;display:block}.item small{color:var(--muted);font-size:13px}
.item .pr{margin-left:auto;font-weight:900;font-size:18px;white-space:nowrap}
.kv{display:grid;grid-template-columns:140px minmax(0,1fr);gap:10px 14px;font-size:14px}
.kv span{color:var(--muted)}
.kv b{overflow-wrap:anywhere}
.who{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.who small{display:block;color:var(--muted)}
.toggle{display:flex;align-items:center;gap:12px;margin-top:12px;border:1.5px dashed var(--line);border-radius:14px;padding:12px 14px;font-size:14px;cursor:pointer}
.toggle input{width:20px;height:20px;accent-color:var(--brand);flex:none}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted);margin:16px 0}
.check input{width:18px;height:18px;margin-top:1px;accent-color:var(--brand);flex:none}
.coupon{display:flex;gap:8px;margin-top:10px}
.coupon .inp{height:42px}
.mob-pay{display:none}

/* account */
.acc-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start;margin-top:22px}
.acc-layout>*{min-width:0}
.acc-side{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;position:sticky;top:88px}
.acc-me{display:flex;align-items:center;gap:11px;padding:14px}
.acc-me .avatar{width:42px;height:42px;font-size:17px}
.acc-me .t,.acc-nav .t{display:flex;flex-direction:column;min-width:0}
.acc-me b,.acc-me small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acc-me small,.acc-nav small{color:var(--muted);font-size:12.5px;font-weight:500}
.acc-nav{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.acc-nav b,.acc-nav small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acc-nav a,.acc-logout{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;font-size:14px;transition:border-color .15s,box-shadow .15s}
.acc-nav a:hover{border-color:var(--brand);box-shadow:0 6px 16px rgba(15,40,100,.06)}
.acc-nav a.on{border-color:var(--brand);background:var(--brand-softer)}
.acc-nav a.on b{color:var(--brand)}
.acc-nav .ic{width:36px;height:36px;border-radius:10px;background:var(--brand-softer);color:var(--brand);display:grid;place-items:center;flex:none}
.acc-nav a.on .ic{background:var(--brand);color:#fff}
.acc-nav .ic svg{width:18px;height:18px}
.acc-nav .t{flex:1;min-width:0}
.acc-me{min-width:0}.acc-me .t{flex:1}
.acc-nav .go{color:var(--muted);display:grid}
.acc-nav .go svg{width:16px;height:16px}
.acc-logout{width:100%;font:inherit;font-size:14px;cursor:pointer;color:var(--bad-ink);text-align:left}
.acc-logout .ic{background:var(--bad-bg);color:var(--bad-ink)}
.acc-logout:hover{border-color:var(--bad-ink)}
.acc-main{display:grid;gap:16px;min-width:0}
.acc-hello{display:flex;align-items:center;gap:18px;padding:22px 24px;background:linear-gradient(120deg,var(--hero-a),var(--hero-b));border:0;color:#fff}
.acc-hello .avatar{width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.45);display:grid;place-items:center;font-size:24px;font-weight:800;flex:none}
.acc-hello .hi{flex:1;min-width:0}
.acc-hello h1{font-size:21px;line-height:1.25}
.acc-hello p{color:var(--hero-text);font-size:14px;overflow:hidden;text-overflow:ellipsis}
.acc-hello .ticks{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.acc-hello .since{font-size:12.5px;color:var(--hero-text)}
.acc-hello .btn{background:#fff;color:var(--brand-dd);flex:none}
.acc-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.acc-stats .st{padding:16px 18px;display:flex;flex-direction:column;gap:2px;min-width:0}
.acc-stats a.st:hover{border-color:var(--brand)}
.acc-stats .ic{width:38px;height:38px;border-radius:11px;background:var(--brand-softer);color:var(--brand);display:grid;place-items:center;margin-bottom:8px}
.acc-stats .ic svg{width:20px;height:20px}
.acc-stats small{color:var(--muted);font-size:13px;font-weight:600}
.acc-stats b{font-size:22px;font-weight:800;white-space:nowrap}
.acc-stats .more{font-size:12.5px;font-weight:700;color:var(--brand);margin-top:4px}
.acc-stats .st.live .ic{background:#fff3dc;color:#9a5b00}
.acc-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.acc-head h2{font-size:18px}
.acc-empty{text-align:center;padding:26px 16px 30px;color:var(--muted)}
.acc-empty .ic{width:56px;height:56px;border-radius:16px;background:var(--brand-softer);color:var(--brand);display:inline-grid;place-items:center;margin-bottom:12px}
.acc-empty .ic svg{width:28px;height:28px}
.acc-empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:4px}
.acc-sub{font-size:15px;margin:4px 0 12px}
.acc-popular{grid-template-columns:repeat(6,minmax(0,1fr))}
.acc-orders{display:grid}
.acc-orders .ao{display:grid;grid-template-columns:52px minmax(0,1fr) auto auto 110px;align-items:center;gap:14px;padding:12px 6px;border-top:1px solid var(--line)}
.acc-orders .ao:first-child{border-top:0}
.acc-orders .ao:hover{background:var(--bg)}
.acc-orders img{width:52px;height:52px;border-radius:12px;object-fit:cover;background:#eef2f8}
.acc-orders .what{min-width:0;display:flex;flex-direction:column}
.acc-orders .what b,.acc-orders .what span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acc-orders .what span,.acc-orders .meta{font-size:13px;color:var(--muted)}
.acc-orders .meta{display:flex;flex-direction:column;text-align:right}
.acc-orders .meta .num{color:var(--ink);font-weight:700}
.acc-orders .amt{text-align:right;font-size:15px}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{text-align:left;color:var(--muted);font-weight:600;font-size:12.5px;padding:10px;border-bottom:1px solid var(--line)}
.table td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table .r{text-align:right}
.tablewrap{overflow-x:auto}
.codebox{background:#0f1a33;color:#e5edff;border-radius:12px;padding:14px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:8px}
.msg{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px;background:var(--card)}
.msg.staff{background:var(--brand-softer);border-color:var(--brand-soft)}
.msg .h{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);margin-bottom:6px}
.msg .h b{color:var(--ink)}
.files{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.files a{font-size:13px;color:var(--brand);font-weight:600;border:1px solid var(--line);border-radius:8px;padding:4px 10px;background:var(--card)}
.balance{font-size:34px;font-weight:900;color:var(--brand-dd);letter-spacing:-.5px}

/* auth */
.auth{max-width:440px;margin:40px auto;padding:28px}
.auth h1{font-size:24px;font-weight:900;margin-bottom:6px}
.auth p.sub{color:var(--muted);margin-bottom:18px}
.cf-box{margin:4px 0 14px;min-height:65px}.cf-wait{color:#b42318;font-size:13px;font-weight:600;margin:-6px 0 12px}html.dark .cf-wait{color:#ff9c8f}
.seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:4px;margin-bottom:18px}
.seg a{flex:1;text-align:center;padding:9px 10px;border-radius:9px;font-weight:700;font-size:14px;color:var(--muted)}
.seg a.on{background:var(--card,#fff);color:var(--brand);box-shadow:0 1px 4px rgba(15,23,42,.12)}
.form-row{margin-bottom:14px}
.form-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:14px}
.or{color:var(--muted);text-align:center;margin-top:16px;font-size:14px}

/* footer */
footer.site{background:var(--foot-bg);color:var(--foot-ink);margin-top:48px;padding:36px 0 40px;font-size:14px}
footer.site .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:24px}
footer.site h2{color:#fff;font-size:14px;font-weight:700;margin:0 0 10px}
footer.site p{margin-bottom:6px;overflow-wrap:anywhere}
footer.site a:hover{color:#fff}
footer.site .flogo{height:46px;width:auto;margin-bottom:14px}
footer.site .tpbox{margin:24px auto 0;max-width:760px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 16px}
footer.site .tp-head{display:inline-flex;align-items:center;gap:6px;color:#fff;font-weight:800;font-size:16px;letter-spacing:-.01em}
footer.site .tp-stars{display:inline-flex;gap:2px}
footer.site .tp-stars i{width:18px;height:18px;background:#00b67a;display:grid;place-items:center;border-radius:2px}
footer.site .tp-live{min-height:24px;min-width:180px;width:auto}
footer.site .tp-sep{width:1px;height:20px;background:rgba(255,255,255,.18)}
footer.site .tp-text{font-size:13.5px;opacity:.9}
footer.site .tp-link{color:#00d98f;font-weight:700;font-size:13.5px;white-space:nowrap}
footer.site .tp-link:hover{color:#3ff0b0}
@media (max-width:700px){footer.site .tpbox{gap:8px 12px}footer.site .tp-sep{display:none}}
footer.site .copy{border-top:1px solid rgba(255,255,255,.1);margin-top:24px;padding-top:16px;font-size:12.5px}
footer.site .copy.has-pay{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap}
footer.site .paywe{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
footer.site .pwl{font-weight:600;margin-right:4px}
footer.site .pchip{background:#fff;border-radius:6px;height:30px;min-width:46px;padding:3px 7px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 1px 2px rgba(0,0,0,.25)}
footer.site .pchip img{max-height:24px;max-width:56px;width:auto;height:auto;object-fit:contain;display:block}
footer.site .pchip-t{font:800 14px/1 system-ui,sans-serif;color:#0b3d91}footer.site .pchip-t b{color:#f7b500}
@media (max-width:700px){footer.site .copy.has-pay{flex-direction:column;align-items:flex-start}footer.site .paywe{gap:5px}footer.site .pwl{width:100%;margin:0 0 2px}footer.site .pchip{height:28px;min-width:0;padding:2px 5px}footer.site .pchip img{max-height:22px;max-width:44px}footer.site .pchip-t{font-size:12px}}

/* mobile bottom nav */
.bnav{display:none}

/* pagination */
.pager{display:flex;gap:6px;justify-content:center;margin:20px 0;flex-wrap:wrap}
.pager a,.pager span{min-width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;padding:0 10px;background:var(--card);font-weight:600;font-size:14px}
.pager .on{background:var(--brand);color:#fff;border-color:var(--brand)}
.pager .off{opacity:.45}
.pagebar{margin-top:18px}
.pagebar .pager{margin:14px 0 4px}
.perpage{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
.perpage-pick{display:flex;align-items:center;gap:4px}
.perpage-pick a,.perpage-pick b{padding:5px 11px;border-radius:9px;border:1px solid var(--line);background:var(--card,#fff);font-weight:600;color:inherit}
.perpage-pick b{background:var(--brand);border-color:var(--brand);color:#fff}

@media (max-width:1000px){
  .acc-layout{grid-template-columns:minmax(0,1fr);margin-top:14px;gap:12px}
  .acc-side{position:static}
  .acc-nav{display:flex;overflow-x:auto;gap:8px;padding-bottom:2px}
  .acc-nav a,.acc-logout{white-space:nowrap;flex:none;padding:8px 12px 8px 8px;gap:8px}
  .acc-nav small,.acc-nav .go{display:none}
  .acc-nav .ic{width:30px;height:30px}
  .acc-nav b{overflow:visible}
  .search,.acct-btn .nm{display:none !important}
  .iconbtn{display:grid;margin-left:auto}
  .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .trust{grid-template-columns:repeat(2,1fr)}
  .hero{grid-template-columns:minmax(0,1fr)}
  .hero .tiles{display:none}
}
@media (max-width:760px){
  body{font-size:14px}
  .nav,.search,.wallet-pill,.desk-only{display:none !important}
  .iconbtn{display:grid}
  .top .wrap{height:58px}
  .acct{margin-left:auto}
  .logo img{height:32px}
  .hero{padding:28px 22px;border-radius:18px;margin-top:14px}
  .hero h1{font-size:28px}
  .hero p{font-size:14.5px}
  .trust{grid-template-columns:1fr 1fr;gap:8px}
  .trust .t{padding:10px;gap:8px}
  .trust .ti{width:34px;height:34px}
  .trust small{display:none}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .pc{padding:7px}
  .pc b{font-size:13px}
  .pc .badge{font-size:10.5px;padding:2px 7px}
  .steps{grid-template-columns:1fr}
  h2.sec{font-size:17px;margin:26px 0 12px}
  .layout{grid-template-columns:minmax(0,1fr);gap:0}
  .phead{padding:14px;gap:14px}.phead img{width:72px;height:72px}.phead h1{font-size:20px}
  .box{padding:16px;margin-top:10px}
  .pk{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .p{padding:10px}
  .layout .sum.product-sum{display:none}
  .sticky-buy{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--card);border-top:1px solid var(--line);padding:10px 16px;gap:12px;align-items:center;z-index:25;box-shadow:0 -6px 20px rgba(0,0,0,.06)}
  .sticky-buy .t{min-width:0}
  .sticky-buy .t small{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sticky-buy .t b{font-size:22px;font-weight:900;color:var(--brand-dd)}
  .sticky-buy .btn{flex:1;height:50px}
  body.has-bnav footer.site{padding-bottom:90px}
  body.has-sticky footer.site{padding-bottom:100px}
  .sum{position:static}
  .checkout .sum .btn.desk{display:none}
  .mob-pay{display:block;position:fixed;bottom:0;left:0;right:0;background:var(--card);border-top:1px solid var(--line);padding:10px 16px 12px;z-index:25;box-shadow:0 -6px 20px rgba(0,0,0,.06)}
  .prog{font-size:11px;gap:5px}.prog .bar{max-width:30px}.prog .c{width:22px;height:22px;font-size:11px}
  .prog .lbl{display:none}.prog .now .lbl{display:inline}
  h1.page{font-size:21px;margin:14px 0 12px}
  .kv{grid-template-columns:110px minmax(0,1fr);font-size:13.5px}
  .acc-me{display:none}
  .acc-hello{flex-wrap:wrap;padding:18px;gap:14px}
  .acc-hello .avatar{width:50px;height:50px;font-size:20px}
  .acc-hello .btn{width:100%}
  .acc-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .acc-stats .st{padding:14px}
  .acc-stats b{font-size:19px}
  .acc-popular{grid-template-columns:repeat(3,minmax(0,1fr))}
  .acc-orders .ao{grid-template-columns:44px minmax(0,1fr) auto;gap:10px;padding:12px 2px}
  .acc-orders img{width:44px;height:44px}
  .acc-orders .meta{display:none}
  .acc-orders .st{grid-column:2;grid-row:2}
  .acc-orders .amt{grid-column:3;grid-row:1}
  footer.site .cols{grid-template-columns:1fr 1fr}
  footer.site .cols>div:first-child{grid-column:1/-1}
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;background:var(--card);border-top:1px solid var(--line);height:64px;z-index:24;font-size:11px;font-weight:600;color:var(--muted);text-align:center}
  body.has-sticky .bnav{display:none}
  .bnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
  .bnav a.on{color:var(--brand)}
  .bnav svg{width:22px;height:22px}
  .auth{margin:18px auto;padding:20px}
  .table.stack thead{display:none}
  .table.stack tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}
  .table.stack td{display:flex;justify-content:space-between;gap:10px;border:0;padding:4px 6px}
  .table.stack td::before{content:attr(data-l);color:var(--muted);font-size:12.5px}
}
footer.site .reviews a{display:inline-flex;align-items:center;gap:8px;font-weight:600}
footer.site .reviews .stars{color:#00b67a;letter-spacing:1px;white-space:nowrap;flex-shrink:0}
.pk .p .amt small.inst{display:inline-flex;align-items:center;gap:5px;width:max-content;margin-top:4px;padding:2px 8px;border-radius:999px;background:var(--ok-bg);color:var(--ok-ink);font-size:11.5px;font-weight:700}
.pk .p .amt small.inst .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.pk .p .amt small.bo{color:var(--wait-ink,#9a5b00);font-weight:600}
footer.site .social{display:flex;gap:10px;margin-top:10px}
footer.site .social a{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:#fff}
footer.site .social a:hover{background:rgba(255,255,255,.2)}
@media (max-width:700px){footer.site .cols>div:last-child{grid-column:1/-1}}

/* motion: short, light effects. All switched off for people who ask for less motion. */
main{animation:gb-fade .25s ease-out}
.btn,.btn-login,.wallet-pill,.chip,.acct-btn,.iconbtn,.ctr button{transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s,transform .12s}
.btn:active:not(:disabled),.chip:active,.wallet-pill:active,.ctr button:active,.bnav a:active{transform:scale(.97)}
.btn-main:hover:not(:disabled){box-shadow:0 8px 18px rgba(37,99,235,.25);transform:translateY(-1px)}
.btn-light:hover{border-color:var(--brand)}
.chip:hover{border-color:var(--brand);color:var(--brand)}
.pc:hover img{transform:scale(1.03)}
.pc img{transition:transform .25s ease}
.p,.pay{transition:border-color .15s,background-color .15s,box-shadow .15s,transform .12s}
.p:hover:not(.off),.pay:hover:not(.off){border-color:var(--brand)}
.p:active:not(.off){transform:scale(.98)}
.p:has(input:checked)::after{animation:gb-pop .2s ease-out}
.acc-stats .st,.trust .t{transition:transform .15s,box-shadow .15s,border-color .15s}
.acc-stats a.st:hover,.trust .t:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(15,40,100,.07)}
.acc-orders .ao{transition:background-color .15s}
.dropdown[open] .menu{animation:gb-drop .16s ease-out}
.slide{animation:gb-fade .45s ease-out}
details > summary ~ *{animation:gb-fade .2s ease-out}
.alert{animation:gb-in .3s ease-out}
/* Content that slides in as it comes into view (added by store.js only when supported). */
.rv{opacity:0;transform:translateY(12px);transition:opacity .4s ease-out,transform .4s ease-out}
.rv.in{opacity:1;transform:none}
/* Grey shimmer while a picture is still loading. */
img.sk{background:linear-gradient(90deg,#eef2f8 25%,#f7f9fd 50%,#eef2f8 75%);background-size:200% 100%;animation:gb-shimmer 1.1s linear infinite}
/* Busy button: shows a spinner after it is pressed, so nobody presses twice. */
.is-busy{position:relative;color:transparent !important;pointer-events:none}
.is-busy::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;animation:gb-spin .7s linear infinite}
.btn-light.is-busy::after,.is-busy.light::after{border-color:rgba(37,99,235,.25);border-top-color:var(--brand)}
@keyframes gb-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes gb-fade{from{opacity:0}to{opacity:1}}
@keyframes gb-drop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes gb-pop{from{transform:scale(.4)}to{transform:scale(1)}}
@keyframes gb-spin{to{transform:rotate(360deg)}}
@keyframes gb-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media (hover:none){.pc:hover,.acc-stats a.st:hover,.trust .t:hover,.btn-main:hover:not(:disabled){transform:none}.pc:hover img{transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .rv{opacity:1;transform:none}
  .is-busy::after{animation:gb-spin 1.5s linear infinite !important}
}

/* wallet top-up image */
.wimg{display:inline-grid;place-items:center;flex:none;border-radius:12px;background:linear-gradient(135deg,var(--hero-a),var(--hero-b));color:var(--brand)}
@media (max-width:640px){.acc-orders .wimg{width:44px!important;height:44px!important}}

/* track order */
.trk{max-width:980px;padding-top:20px;padding-bottom:30px}
.trk-hero{display:flex;gap:18px;align-items:center;border-radius:20px;background:linear-gradient(120deg,var(--hero-a),var(--hero-b));color:#fff;padding:28px 30px}
.trk-hero h1{font-size:28px;line-height:1.2;font-weight:900}
.trk-hero p{color:var(--hero-text);margin-top:4px}
.trk-ico{width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.16);display:grid;place-items:center;flex:none}
.trk-ico svg{width:30px;height:30px}
.trk-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-top:18px;align-items:start}
.trk-form{padding:24px}
.trk-form .btn svg{width:18px;height:18px}
.trk-trust{list-style:none;display:grid;gap:12px}
.trk-trust li{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.trk-trust li span{width:38px;height:38px;border-radius:11px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.trk-trust li span svg{width:19px;height:19px}
.trk-trust b{display:block;font-size:14.5px}
.trk-trust small{color:var(--muted);font-size:13px}
.trk-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.trk-head h2{font-size:22px;font-weight:900;line-height:1.1}
.trk-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);margin:22px 0 6px;counter-reset:s}
.trk-steps li{position:relative;text-align:center;padding:0 4px;font-size:13px;color:var(--muted)}
.trk-steps li i{display:block;width:26px;height:26px;margin:0 auto 8px;border-radius:50%;border:2px solid var(--line);background:var(--card);position:relative;z-index:1}
.trk-steps li::before{content:"";position:absolute;top:12px;left:-50%;width:100%;height:3px;background:var(--line)}
.trk-steps li:first-child::before{display:none}
.trk-steps li b{display:block;color:inherit;font-size:13px}
.trk-steps li small{display:block;font-size:12px;margin-top:2px}
.trk-steps li.done{color:var(--ink)}
.trk-steps li.done i{background:var(--brand);border-color:var(--brand)}
.trk-steps li.done i::after{content:"";position:absolute;left:8px;top:4px;width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.trk-steps li.done::before,.trk-steps li.now::before{background:var(--brand)}
.trk-steps li.now{color:var(--brand)}
.trk-steps li.now i{border-color:var(--brand);box-shadow:0 0 0 5px var(--brand-soft)}
.trk-items{margin-top:16px;border-top:1px solid var(--line)}
.trk-items .item{padding:12px 0;border-bottom:1px solid var(--line)}
.trk-items .item img{width:52px;height:52px}
@media (max-width:760px){
  .trk-grid{grid-template-columns:minmax(0,1fr)}
  .trk-hero{padding:22px 18px;border-radius:16px}
  .trk-hero h1{font-size:23px}
  .trk-ico{width:48px;height:48px}
  .trk-steps{grid-template-columns:1fr;gap:0;text-align:left}
  .trk-steps li{display:grid;grid-template-columns:26px 1fr;column-gap:12px;text-align:left;padding:0 0 16px}
  .trk-steps li i{grid-row:span 2;margin:0}
  .trk-steps li::before{left:12px;top:-16px;width:3px;height:16px}
}

/* maintenance page */
/* Maintenance page */
.mnt-body{min-height:100vh;display:flex;flex-direction:column;color:#fff;position:relative;overflow-x:hidden;background:var(--hero-a);
  background:radial-gradient(1200px 600px at 85% -10%,color-mix(in srgb,var(--hero-b) 55%,transparent),transparent 60%),
  radial-gradient(900px 500px at -10% 110%,color-mix(in srgb,var(--hero-a) 70%,transparent),transparent 60%),
  linear-gradient(160deg,color-mix(in srgb,var(--hero-a) 75%,#050814),#060a18)}
.mnt-glow{position:fixed;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%)}
.mnt-top{position:relative;padding:26px 24px 0;max-width:1100px;width:100%;margin:0 auto}
.mnt-logo{height:38px;width:auto;filter:brightness(0) invert(1)}
.mnt{position:relative;flex:1;width:100%;max-width:1100px;margin:0 auto;padding:clamp(40px,9vh,96px) 24px 48px}
.mnt-status{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 12px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:var(--hero-accent)}
.mnt-dot{width:9px;height:9px;border-radius:50%;background:#f5a524;box-shadow:0 0 0 0 rgba(245,165,36,.6);animation:mntPulse 1.8s infinite}
.mnt h1{font-size:clamp(36px,7vw,68px);font-weight:900;line-height:1.04;letter-spacing:-.035em;margin:22px 0 18px;max-width:820px}
.mnt-lead{font-size:clamp(16px,2vw,19px);line-height:1.6;color:var(--hero-text);max-width:620px;margin:0 0 34px}
.mnt-progress{height:6px;max-width:520px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden;position:relative}
.mnt-progress span{position:absolute;top:0;bottom:0;left:-40%;width:40%;border-radius:99px;background:linear-gradient(90deg,transparent,var(--hero-accent),#fff);animation:mntBar 1.9s cubic-bezier(.4,0,.2,1) infinite}
.mnt-progress-label{font-size:13.5px;color:var(--hero-text);opacity:.8;margin:12px 0 34px}
.mnt-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:56px}
.mnt-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 24px;border-radius:14px;font-weight:800;font-size:15.5px;color:#fff;transition:transform .15s,background .15s}
.mnt-btn:hover{transform:translateY(-1px)}
.mnt-btn-wa{background:#1fa855;box-shadow:0 10px 30px rgba(31,168,85,.35)}
.mnt-btn-wa:hover{background:#1a9149}
.mnt-btn-ghost{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22)}
.mnt-btn-ghost:hover{background:rgba(255,255,255,.14)}
.mnt-info{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mnt-info li{display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(6px)}
.mnt-info svg{flex:none;color:var(--hero-accent);margin-top:2px}
.mnt-info b{display:block;font-size:15px;margin-bottom:3px}
.mnt-info span{display:block;font-size:13.5px;line-height:1.5;color:var(--hero-text);opacity:.9}
.mnt-foot{position:relative;border-top:1px solid rgba(255,255,255,.1);padding:20px 24px;text-align:center;font-size:13px;color:var(--hero-text);opacity:.75}
.mnt-foot span{display:block;margin-top:4px}
@keyframes mntPulse{70%{box-shadow:0 0 0 9px rgba(245,165,36,0)}100%{box-shadow:0 0 0 0 rgba(245,165,36,0)}}
@keyframes mntBar{0%{left:-40%}100%{left:100%}}
@media (max-width:760px){.mnt-info{grid-template-columns:1fr}.mnt-actions .mnt-btn{flex:1 1 100%}.mnt-top{padding:20px 16px 0}.mnt{padding-left:16px;padding-right:16px}.mnt-logo{height:32px}}
@media (prefers-reduced-motion:reduce){.mnt-dot{animation:none}.mnt-progress span{animation:none;left:0;width:60%}.mnt-btn{transition:none}}
.staffbar{background:#7c2d12;color:#fff;font-size:13px;font-weight:700;text-align:center;padding:6px 12px}
@media (max-width:880px) and (min-width:761px){.nav > a:first-child{display:none}.nav{margin-left:4px;padding-left:12px}}
.paybox{margin:0 0 18px;border:1px solid var(--line);border-radius:14px;padding:16px}
.paybox h3{font-size:16px;margin-bottom:10px}
/* Contact support box and the customer refund popup */
.support-box{background:var(--bad-bg);color:var(--bad-ink);border-radius:14px;padding:16px 18px;margin:14px 0}
.support-box>b{display:block;font-size:17px;margin-bottom:4px}
.support-box p{margin:0 0 12px;color:var(--ink);font-size:14.5px}
.refund-push{border:1.5px solid var(--brand);border-radius:14px;padding:16px 18px;margin:14px 0;background:var(--brand-softer)}
.refund-push>b{display:block;font-size:18px;font-weight:800;margin-bottom:4px;color:var(--ink)}
.refund-push p{margin:0 0 12px;color:var(--muted);font-size:14.5px}
.support-btns{display:flex;gap:10px;flex-wrap:wrap}
.btn-wa{background:#25d366;color:#fff}.btn-wa:hover{background:#1ebe5b}
.btn-fb{background:#1877f2;color:#fff}.btn-fb:hover{background:#0f66d8}
.btn-dc{background:#5865f2;color:#fff}.btn-dc:hover{background:#4752c4}
.refund-ask{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border:1.5px dashed var(--line);border-radius:12px;padding:12px 14px;margin-top:10px;font-size:14px;color:var(--muted)}
.refund-box{max-width:460px}
.refund-box .pay{margin-top:10px;align-items:flex-start}
.refund-box .pay b{font-size:15px;color:var(--ink);margin:0;padding:0}
.refund-box .pay small{display:block;margin-top:2px}
.refund-box .row b{display:inline;font-size:15px;color:var(--ink);margin:0;padding:0}
.acc-cta{display:flex;flex-direction:column;gap:8px;flex:none}.acc-cta .btn{white-space:nowrap}
.acc-hello .acc-cta .btn-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.acc-hello .acc-cta .btn-light:hover{background:rgba(255,255,255,.12)}
@media (max-width:640px){.acc-cta{flex-direction:row;width:100%}.acc-cta .btn{flex:1;padding:0 10px}}
/* Order progress steps on the customer's order page */
.osteps{display:flex;list-style:none;margin:16px 0 6px;padding:0;counter-reset:s}
.osteps li{flex:1;position:relative;text-align:center;font-size:12.5px;color:var(--muted);min-width:0}
.osteps li::before{content:"";position:absolute;top:14px;left:-50%;width:100%;height:3px;background:var(--line);z-index:0}
.osteps li:first-child::before{display:none}
.osteps li i{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;margin:0 auto 6px;border-radius:50%;background:var(--card);border:2px solid var(--line);font-style:normal;font-weight:800;font-size:13px;color:var(--muted)}
.osteps li span{display:block;line-height:1.25;padding:0 3px}
.osteps li.done{color:var(--ink)}
.osteps li.done i{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.osteps li.done::before,.osteps li.now::before,.osteps li.end::before{background:var(--brand)}
.osteps li.now{color:var(--brand);font-weight:700}
.osteps li.now i{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
.osteps li.end{font-weight:700}
.osteps li.end.bad{color:var(--bad-ink)}.osteps li.end.bad i{background:var(--bad-ink);border-color:var(--bad-ink);color:#fff}
.osteps li.end.muted{color:var(--muted)}.osteps li.end.muted i{background:var(--muted);border-color:var(--muted);color:#fff}
.osteps li.end.warn{color:var(--warn-ink)}.osteps li.end.warn i{background:var(--warn);border-color:var(--warn);color:#fff}
@media (max-width:420px){.osteps li{font-size:10.5px}.osteps li span{padding:0 1px}.osteps li.now,.osteps li.end{font-weight:600;letter-spacing:-.2px}.osteps li i{width:26px;height:26px;font-size:12px}.osteps li::before{top:12px}}
/* Help Center: sections that open on tap */
.help-intro{margin:0 0 14px;color:var(--muted)}
.help-list{display:grid;gap:10px}
.help-q{padding:0;overflow:hidden}
.help-q summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;font-weight:700;font-size:16px;color:var(--ink)}
.help-q summary::-webkit-details-marker{display:none}
.help-q summary::after{content:"+";flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font-size:18px;font-weight:700}
.help-q[open] summary::after{content:"−"}
.help-q[open] summary{border-bottom:1px solid var(--line)}
.help-q .prose{padding:14px 18px 6px}
/* Live chat bubble */
.chatw{position:fixed;right:20px;bottom:20px;z-index:60}
.chat-fab{width:58px;height:58px;border-radius:50%;border:0;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 28px rgba(15,26,51,.28);position:relative;transition:transform .15s}
.chat-fab:hover{transform:scale(1.05)}
.chatw.is-open .chat-fab{display:none}
.chat-dot{position:absolute;top:4px;right:4px;width:14px;height:14px;border-radius:50%;background:#ef4444;border:2px solid #fff}
.chat-panel{position:absolute;right:0;bottom:0;width:360px;max-width:calc(100vw - 32px);height:min(520px,calc(100vh - 120px));background:var(--card);color:var(--ink);border-radius:18px;box-shadow:0 24px 60px rgba(15,26,51,.3);display:flex;flex-direction:column;overflow:hidden}
.chat-panel[hidden]{display:none}
.chat-panel header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;background:var(--brand);color:var(--on-brand)}
.chat-panel header b{display:block;font-size:16px}.chat-panel header small{opacity:.85;font-size:12.5px}
.chat-x{border:0;background:rgba(255,255,255,.18);color:inherit;width:32px;height:32px;border-radius:50%;font-size:20px;line-height:1;cursor:pointer}
.chat-body{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--bg)}
.chat-step{padding:18px 16px;overflow:auto}
.chat-step p{margin:0 0 14px;font-size:14.5px;color:var(--muted)}
.chat-step label{display:block;font-size:13px;font-weight:600;margin:0 0 5px}
.chat-step input{width:100%;height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;margin-bottom:12px;background:var(--card)}
.chat-step input:focus,.chat-send textarea:focus{outline:none;border-color:var(--brand)}
.chat-link{display:block;margin:12px auto 0;border:0;background:none;color:var(--brand);font:inherit;font-size:13.5px;cursor:pointer;text-decoration:underline}
.chat-log{flex:1;overflow-y:auto;padding:14px 14px 6px;display:flex;flex-direction:column;gap:10px}
.chat-hi{margin:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px;color:var(--muted)}
.cmsg{display:flex;flex-direction:column;max-width:82%}
.cmsg .bub{padding:9px 12px;border-radius:14px;font-size:14.5px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.cmsg small{font-size:11px;color:var(--muted);margin-top:3px}
.cmsg.me{align-self:flex-end;align-items:flex-end}.cmsg.me .bub{background:var(--brand);color:var(--on-brand);border-bottom-right-radius:4px}
.cmsg.them{align-self:flex-start}.cmsg.them .bub{background:var(--card);border:1px solid var(--line);border-bottom-left-radius:4px}
.chat-err{margin:0;padding:8px 14px;background:var(--bad-bg);color:var(--bad-ink);font-size:13px}
.chat-err[hidden]{display:none}
.chat-send{display:flex;gap:8px;align-items:flex-end;padding:10px;border-top:1px solid var(--line);background:var(--card)}
.chat-send[hidden]{display:none}
.chat-send textarea{flex:1;resize:none;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;font:inherit;font-size:14.5px;max-height:120px;min-height:44px}
.chat-send .btn{width:44px;height:44px;padding:0;border-radius:12px;flex:none}
@media (max-width:760px){
  .chatw{right:14px;bottom:78px}
  body.has-sticky .chatw{bottom:86px}
  .chatw.is-open{inset:auto 0 0 0;right:0;bottom:0}
  .chat-panel{position:fixed;inset:auto 0 0 0;width:100%;max-width:none;height:min(78vh,600px);border-radius:18px 18px 0 0}
}
/* 18+ question for first-time visitors */
.agegate{position:fixed;inset:0;z-index:200;background:rgba(10,15,30,.72);backdrop-filter:blur(6px);display:grid;place-items:center;padding:16px}
.agegate[hidden]{display:none}
.agegate .box{background:var(--card);color:var(--ink);max-width:420px;width:100%;border-radius:18px;padding:28px 24px;text-align:center;border-top:6px solid var(--brand);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.agegate .box img{height:40px;width:auto;margin:0 auto 16px}
.agegate h2{font-size:22px;margin:0 0 8px}
.agegate p{color:var(--muted);margin:0 0 20px;font-size:15px}
.agegate .btns{display:grid;gap:10px}
.agegate .btns .btn{height:48px}
.agegate .no-age{font-size:44px;line-height:1;margin-bottom:10px}
/* "Your order is delivered" pop-up */
.delivered-box{text-align:center}
.delivered-box .tick{width:56px;height:56px;border-radius:50%;background:var(--ok-bg);color:var(--ok-ink);display:grid;place-items:center;font-size:28px;font-weight:900;margin:0 auto 10px}
.delivered-box b#delivered-t{display:block;font-size:20px;margin-bottom:4px}
.delivered-box p{color:var(--muted);margin:0 0 12px}
.delivered-box .codebox{text-align:left;margin-bottom:12px}
/* Checkout: location warning and steps */
.loc-warn{margin:0 0 14px;border-color:var(--warn);background:var(--warn-bg)}
.loc-warn h2{color:var(--warn-ink)}
.loc-warn p{margin:0 0 10px;line-height:1.5}
.loc-warn .inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.loc-help{margin-top:12px}
.loc-help>summary,.loc-dev>summary{cursor:pointer;font-weight:700}
.loc-lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin:10px 0}
.loc-lang button{border:0;background:var(--card);padding:6px 14px;font:inherit;font-weight:600;cursor:pointer;color:inherit}
.loc-lang button.on{background:var(--brand);color:var(--on-brand)}
.loc-dev{border-top:1px solid var(--line);padding:8px 0}
.loc-dev ol{margin:8px 0 0;padding-left:20px;line-height:1.6}
/* Order details: product picture and name open the product page */
.item-plink{flex:none;display:block;border-radius:12px;transition:opacity .15s}
.item-plink:hover{opacity:.85}
.item-pname{color:inherit;text-decoration:none}
.item-pname:hover{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
/* Refund pop-up: second step for a manual refund */
.refund-box{max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto}
.refund-box .rdest{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.refund-box .rseg{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--bg,#f4f6fa);border:1px solid var(--line);border-radius:12px;padding:4px;margin-bottom:12px}
.refund-box .rseg label{position:relative;cursor:pointer}
.refund-box .rseg input{position:absolute;opacity:0;pointer-events:none}
.refund-box .rseg span{display:block;text-align:center;padding:8px 6px;border-radius:9px;font-weight:700;font-size:14px;color:var(--muted)}
.refund-box .rseg input:checked+span{background:var(--card);color:var(--brand);box-shadow:0 1px 3px rgba(15,26,51,.12)}
.refund-box .rseg input:focus-visible+span{outline:2px solid var(--brand);outline-offset:1px}
.refund-box .rfields .form-row{margin-bottom:10px}
.refund-box .rfields .hint,.refund-box .rdest>.hint{margin:4px 0 8px}
.refund-box .rback{margin-top:8px}
.refund-box>[data-rstep]>b{display:block;font-size:17px;color:var(--brand);margin-bottom:8px;padding-right:28px}
.refund-box .inp{height:44px}
/* Payment / top-up successful pop-up */
.paid-box .paid-rows{text-align:left;border:1px solid var(--line);border-radius:12px;padding:4px 14px;margin:0 0 14px}
.paid-box .paid-rows .row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px;color:var(--muted)}
.paid-box .paid-rows .row:last-child{border-bottom:0}
.paid-box .paid-rows .row b{display:inline;font-size:14.5px;color:var(--ink);margin:0;padding:0;text-align:right;overflow-wrap:anywhere}
.paid-box .paid-rows .row b.trx{font-weight:800;letter-spacing:.3px}
.paid-box b#paid-t{display:block;font-size:20px;margin-bottom:4px}
/* Home banner (1.1.72): sliding banners in the store theme colours, with Games and Gift cards boxes under them. */
.hero2{margin-top:20px}
.hslides{position:relative;height:360px;border-radius:24px;overflow:hidden;background:linear-gradient(120deg,var(--hero-a),var(--hero-b));color:#fff}
.hslide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s}
.hslide.on{opacity:1;visibility:visible}
.hs-img{position:absolute;top:0;right:0;width:66%;height:100%;object-fit:cover;object-position:center}
.hs-shade{position:absolute;inset:0;background:linear-gradient(90deg,var(--hero-a) 0%,var(--hero-a) 34%,transparent 90%);background:linear-gradient(90deg,var(--hero-a) 0%,var(--hero-a) 36%,color-mix(in srgb,var(--hero-a) 60%,transparent) 60%,transparent 92%)}
.hs-body{position:relative;z-index:1;height:100%;max-width:560px;padding:40px 44px 46px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hs-tag{background:var(--hero-accent);color:var(--hero-a);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:99px;margin-bottom:12px}
.hs-title{font-size:40px;line-height:1.08;font-weight:900;letter-spacing:-1px;margin:0 0 10px}
.hs-body p{color:var(--hero-text);font-size:16px;line-height:1.5;margin:0 0 20px;max-width:440px}
.hs-btn{display:inline-block;background:#fff;color:var(--brand-dd);font-weight:800;font-size:15px;border-radius:12px;padding:12px 22px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.hs-btn:hover{transform:translateY(-1px)}
.hs-dots{position:absolute;left:0;right:0;bottom:14px;z-index:2;display:flex;justify-content:center;gap:6px}
.hs-dots button{width:8px;height:8px;border-radius:99px;background:rgba(255,255,255,.45);border:0;padding:0;cursor:pointer;transition:width .3s}
.hs-dots button.on{width:24px;background:#fff}
.hboxes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.hbox{position:relative;display:block;height:110px;border-radius:18px;overflow:hidden;background:var(--hero-a)}
.hbox img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.hbox:hover img{transform:scale(1.04)}
.hbox::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--hero-a),transparent);background:linear-gradient(0deg,color-mix(in srgb,var(--hero-a) 90%,transparent) 0%,color-mix(in srgb,var(--hero-a) 35%,transparent) 60%,transparent 100%)}
.hbox span{position:absolute;left:18px;bottom:12px;z-index:1;color:#fff;font-weight:800;font-size:19px;text-shadow:0 1px 6px rgba(0,0,0,.35)}
@media (max-width:640px){
  .hero2{margin-top:14px}
  .hslides{height:300px;border-radius:20px}
  .hs-img{width:78%}
  .hs-shade{background:linear-gradient(90deg,var(--hero-a) 0%,var(--hero-a) 45%,transparent 92%);background:linear-gradient(90deg,var(--hero-a) 0%,color-mix(in srgb,var(--hero-a) 90%,transparent) 42%,color-mix(in srgb,var(--hero-a) 50%,transparent) 68%,transparent 94%)}
  .hs-body{padding:24px 20px 36px;max-width:100%}
  .hs-title{font-size:28px;letter-spacing:-.5px;max-width:82%}
  .hs-body p{font-size:14px;max-width:72%;margin-bottom:16px}
  .hs-tag{font-size:11px;padding:4px 10px;margin-bottom:10px}
  .hs-btn{font-size:14.5px;padding:11px 18px}
  .hboxes{gap:10px;margin-top:10px}
  .hbox{height:84px;border-radius:16px}
  .hbox span{font-size:15px;left:12px;bottom:10px}
}
@media (prefers-reduced-motion:reduce){.hslide{transition:none}}
/* Fade the picture's left edge into the banner and tint it lightly with the theme colour. */
.hs-img{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}
.hslide::after{content:"";position:absolute;inset:0;pointer-events:none;background:color-mix(in srgb,var(--hero-a) 22%,transparent)}
.hbox img{filter:saturate(.9)}
.hbox::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:color-mix(in srgb,var(--hero-a) 22%,transparent)}
/* View as customer (staff only): always visible, with an Exit button. */
.viewasbar{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;background:#7c2d12;color:#fff;font-size:13.5px;padding:8px 14px;text-align:center}
.viewasbar form{margin:0}
.viewasbar button{background:#fff;color:#7c2d12;border:0;border-radius:8px;font-weight:800;font-size:13px;padding:6px 14px;cursor:pointer}

/* Part stock choice in Price details */
.stockpick{border-bottom:1px dashed var(--line);padding-bottom:12px;margin-bottom:12px}
.stockpick .sp-head{font-size:13px;color:var(--muted);margin:0 0 8px;line-height:1.45}
.sp-opt{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card);font:inherit;color:inherit;cursor:pointer;margin-top:8px}
.sp-opt:first-of-type{margin-top:0}
.sp-opt:hover{border-color:var(--brand)}
.sp-opt .radio{width:18px;height:18px;border-radius:50%;border:2px solid #b8c4d6;flex:none}
.sp-opt.on{border-color:var(--brand);background:var(--brand-softer);cursor:default}
.sp-opt.on .radio{border:5px solid var(--brand)}
.sp-txt{min-width:0;flex:1}.sp-txt b{display:block;font-size:14px}.sp-txt small{display:block;color:var(--muted);font-size:12px;line-height:1.35}
.sp-pr{font-size:14px;white-space:nowrap}
/* Check your email: code box */
.vcode{text-align:left;margin-top:14px}
.vcode .inp{text-align:center;font-size:20px;letter-spacing:6px;font-weight:700}
.vor{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin:16px 0 12px}
.vor:before,.vor:after{content:"";flex:1;height:1px;background:var(--line)}
.email-nag{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.email-nag-btns{display:flex;gap:8px;flex-wrap:wrap}
.refund-amt{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:4px 0 10px}
.refund-amt span{color:var(--muted);font-size:14px}.refund-amt b{font-size:18px}
/* Player details under an order line: full width, values never split mid-number */
.pfields{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:10px 0 0;padding:10px 14px;background:var(--bg,#f5f7fb);border:1px solid var(--line);border-radius:12px;font-size:14px}
.pfields span{color:var(--muted)}
.pfields b{font-weight:700;overflow-wrap:break-word;word-break:normal;min-width:0}
.pfields.wrong{border-color:#fca5a5;background:#fef2f2}
.pfields.wrong b{color:#b91c1c}
html.dark .pfields.wrong{background:rgba(220,38,38,.12);border-color:rgba(248,113,113,.45)}
html.dark .pfields.wrong b{color:#fca5a5}
/* Custom amount gift cards */
.p.cust{display:grid;grid-template-columns:1fr minmax(180px,250px) 160px;gap:16px;align-items:center;padding:16px 18px;margin-bottom:4px}
.p.cust:has(input:checked)::after{display:none}
.p.cust .amt{font-size:16px}
.p.cust .amt small{font-size:13px;margin-top:3px}
.p.cust .cust-in{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);border-radius:12px;height:50px;padding:0 14px;cursor:text}
.p.cust .cust-in:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.p.cust .cust-in .cur,.p.cust .cust-in .usd{font-weight:800;color:var(--muted)}
.p.cust .cust-in .usd{font-size:12.5px}
.p.cust .cust-in input{position:static;opacity:1;pointer-events:auto;border:0;outline:0;background:transparent;font:inherit;font-size:19px;font-weight:700;color:var(--ink);width:100%;min-width:0;-moz-appearance:textfield}
.p.cust .cust-in input::-webkit-outer-spin-button,.p.cust .cust-in input::-webkit-inner-spin-button{-webkit-appearance:none}
.p.cust .cust-pay{background:var(--brand-soft);border-radius:12px;padding:8px 14px;text-align:right}
.p.cust .cust-pay small{display:block;color:var(--muted);font-size:12px;font-weight:600}
.p.cust .cust-pay b{font-size:20px;font-weight:800;color:var(--brand)}
.pk-or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;font-weight:700;margin:16px 0 12px}
.pk-or::before,.pk-or::after{content:"";flex:1;height:1px;background:var(--line)}
@media (max-width:640px){.p.cust{grid-template-columns:1fr 1fr}.p.cust .amt{grid-column:1/-1}.p.cust .cust-pay{text-align:center}}
/* Payment successful page */
.osuccess{max-width:560px;margin:28px auto;padding:30px 26px;text-align:center}
.osuccess .tick{width:60px;height:60px;border-radius:50%;background:var(--ok-bg);color:var(--ok-ink);display:grid;place-items:center;font-size:30px;font-weight:900;margin:0 auto 12px}
.osuccess h1{font-size:24px;margin:0 0 6px}
.osuccess .lead{color:var(--muted);margin:0 0 18px}
.os-rows{text-align:left;border:1px solid var(--line);border-radius:12px;padding:4px 16px;margin-bottom:18px}
.os-rows .row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px dashed var(--line);font-size:14px;color:var(--muted)}
.os-rows .row:last-child{border-bottom:0}
.os-rows .row b{color:var(--ink);text-align:right;font-weight:600}
.os-rows .trx{font-family:ui-monospace,Menlo,monospace;letter-spacing:.02em}
.os-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
@media (max-width:640px){.osuccess{margin:12px auto;padding:22px 16px}.os-btns .btn{flex:1 1 100%}}

/* Region tabs on a product page (products in the same region group) */
.phead.has-rg{flex-wrap:wrap}
.phead.has-rg>div{flex:1;min-width:0}
.rg{flex-basis:100%;min-width:0;margin-left:114px}
.rg small{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:8px}
.rg-row{display:flex;gap:10px;flex-wrap:wrap}
.rg a{display:flex;align-items:center;gap:9px;padding:9px 16px 9px 10px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);font-weight:700;font-size:14.5px;color:var(--ink);white-space:nowrap;transition:border-color .15s,background .15s}
.rg a:hover{border-color:var(--brand)}
.rg a img{width:28px;height:21px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex:none}
.rg a.on{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 3px var(--brand-softer)}
.pc .b-regions{background:var(--brand-soft);color:var(--brand-d)}
@media (max-width:760px){.rg{margin-left:0}.rg-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.rg-row::-webkit-scrollbar{display:none}.rg a{padding:8px 14px 8px 9px;font-size:14px}}
/* Dark / light mode button */
.modebtn{width:38px;height:38px;border-radius:10px;background:var(--search-bg);border:0;display:grid;place-items:center;color:var(--head-muted);cursor:pointer;flex:none;transition:background-color .15s,color .15s,transform .12s}
.modebtn:hover{color:var(--head-ink)}.modebtn:active{transform:scale(.94)}
.modebtn svg{display:block}
html.dark .modebtn .i-moon,html:not(.dark) .modebtn .i-sun{display:none}
html.dark .modebtn{color:#fcd34d}
/* Dark mode: colours that are fixed in light mode */
html.dark .b-manual,html.dark .b-wait,html.dark .acc-stats .st.live .ic{background:rgba(245,165,36,.15);color:#fcc463}
html.dark .b-out,html.dark .b-muted{background:rgba(255,255,255,.08);color:#a3adc2}
html.dark .alert-info{background:rgba(59,130,246,.14);color:#a8c8ff}
html.dark .total b,html.dark .balance,html.dark .sticky-buy .t b{color:var(--ink)}
html.dark .pc .b-regions{color:var(--ok-ink)}
html.dark .ctr input{background:transparent;color:var(--ink)}
html.dark .pc img,html.dark .acc-orders img{background:#1b2438}
html.dark .chat-dot{border-color:var(--card)}
html.dark .testbar{background:#3a2c06;color:#fcd98a}
/* Home rows: box that fills the empty spaces (Request / Hot selling) */
.gbx{grid-column:span var(--span);container-type:inline-size;position:relative;overflow:hidden;padding:0;min-height:220px;border:2px dashed color-mix(in srgb,var(--brand) 40%,var(--line));background:var(--card)}
.gbx[hidden]{display:none}
.gbx .scene{position:absolute;inset:0;display:flex;align-items:center;transition:opacity .6s,transform .6s}
.gbx .scene.a{gap:28px;padding:20px 30px;color:var(--ink)}
.gbx .scene.b{opacity:0;transform:translateY(16px);pointer-events:none;flex-direction:column;align-items:stretch;justify-content:center;padding:16px 0 24px}
.gbx.on-b .scene.a{opacity:0;transform:translateY(-16px);pointer-events:none}
.gbx.on-b .scene.b{opacity:1;transform:none;pointer-events:auto}
.gbx .art{position:relative;width:150px;height:150px;flex:none}
.gbx .art .ic{position:absolute;inset:34px;border-radius:24px;background:var(--brand-soft);display:grid;place-items:center;animation:gbxPulse 2.4s ease-in-out infinite}
.gbx .art .ic svg{width:42px;height:42px;stroke:var(--brand)}
.gbx .art img{position:absolute;width:46px;height:46px;border-radius:12px;object-fit:cover;border:3px solid var(--card);box-shadow:0 8px 18px rgba(15,26,51,.18);animation:gbxBob 3s ease-in-out infinite}
.gbx .art img:nth-of-type(1){left:0;top:4px;transform:rotate(-10deg)}
.gbx .art img:nth-of-type(2){right:0;top:16px;animation-delay:-1s}
.gbx .art img:nth-of-type(3){left:22px;bottom:0;animation-delay:-2s}
.gbx .art .q{position:absolute;right:10px;bottom:8px;width:30px;height:30px;border-radius:50%;background:var(--brand);color:var(--on-brand);font-weight:900;display:grid;place-items:center;font-size:16px;animation:gbxBob 3s ease-in-out infinite -1.5s}
@keyframes gbxBob{50%{translate:0 -8px}}
@keyframes gbxPulse{50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--brand) 12%,transparent)}}
.gbx .txt{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.gbx .gh{display:block;font-size:22px;font-weight:900;letter-spacing:-.4px;line-height:1.2}
.gbx .gp{color:var(--muted);font-size:14.5px;margin:6px 0 14px;max-width:340px;line-height:1.45}
.gbx .sm{display:none}
.gbx .hb-top{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:0 22px}
.gbx .hb-top .gh{font-size:18px}
.gbx .hot{display:inline-flex;align-items:center;gap:6px;background:#fff1e6;color:#c2410c;font-weight:800;font-size:13px;border-radius:99px;padding:4px 12px}
html.dark .gbx .hot{background:#3b1d0e;color:#fdba74}
.gbx .hl{overflow:hidden;margin-top:10px;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.gbx .run{display:flex;gap:12px;width:max-content;animation:gbxRun var(--run,30s) linear infinite;padding:0 6px}
.gbx:hover .run,.gbx:focus-within .run{animation-play-state:paused}
@keyframes gbxRun{to{transform:translateX(-50%)}}
.gbx .hc{width:100px;flex:none;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:7px;color:var(--ink)}
.gbx .hc img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
.gbx .hc b{display:block;font-size:12.5px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gbx .hc span{font-size:12px;font-weight:800;color:var(--brand)}
html.dark .gbx .hc span{color:var(--ok-ink)}
.gbx .sdots{position:absolute;right:14px;bottom:10px;display:flex;gap:6px;z-index:2}
.gbx .sdots button{width:8px;height:8px;border-radius:99px;background:var(--line);border:0;padding:0;cursor:pointer;transition:width .3s,background .3s}
.gbx .sdots button.on{width:22px;background:var(--brand)}
@media (prefers-reduced-motion:reduce){.gbx .run,.gbx .art img,.gbx .art .q,.gbx .art .ic{animation:none}.gbx .hl{overflow-x:auto}.gbx .scene{transition:none}}
@container (max-width:340px){
  .gbx .scene.a{flex-direction:column;justify-content:center;gap:4px;padding:12px 12px 22px;text-align:center}
  .gbx .txt{align-items:center;width:100%}
  .gbx .art{width:110px;height:100px}.gbx .art .ic{inset:22px 27px;border-radius:16px}.gbx .art .ic svg{width:28px;height:28px}
  .gbx .art img{width:34px;height:34px;border-width:2px;border-radius:9px}.gbx .art .q{width:22px;height:22px;font-size:12px}
  .gbx .gh{font-size:16px}.gbx .gp{font-size:12.5px;margin:2px 0 10px}
  .gbx .btn{width:100%;justify-content:center;padding:9px 12px;font-size:13px}
  .gbx .hb-top{padding:0 12px}.gbx .hb-top .gh{font-size:15px}.gbx .hot{font-size:11.5px;padding:3px 9px}
  .gbx .hc{width:92px;padding:5px}.gbx .hc b{font-size:11.5px}.gbx .hc span{font-size:11px}
}
@container (max-width:180px){
  .gbx .gp{display:none}.gbx .lg{display:none}.gbx .sm{display:inline}
  .gbx .art{width:96px;height:78px}.gbx .art .ic{inset:16px 26px}.gbx .art img{width:28px;height:28px}.gbx .art .q{width:20px;height:20px;font-size:11px}
  .gbx .scene.a{padding:8px 8px 22px;gap:2px}.gbx .gh{font-size:13.5px;line-height:1.25;margin-bottom:8px}
  .gbx .btn{padding:7px 8px;font-size:12px;min-height:0;height:auto}
  .gbx .scene.b{padding:10px 0 22px;justify-content:flex-start}.gbx .hb-top{padding:0 8px}.gbx .hot{font-size:11px;padding:2px 8px}.gbx .hb-top .gh{font-size:13px}
  .gbx .hc{width:74px;padding:4px}.gbx .hc b{font-size:10.5px}.gbx .hc span{font-size:10.5px}.gbx .hl{margin-top:8px}
}
@media (max-width:760px){.gbx{min-height:0}}
/* Log in / sign-up designs (Settings > Appearance). Shared form look */
.lg-form h1{font-size:26px;font-weight:900;letter-spacing:-.5px;margin-bottom:6px}
.lg-form p.sub{color:var(--muted);margin-bottom:18px}
.lg-form .inp{height:48px}
.lg-badge{display:inline-flex;align-items:center;gap:6px;background:var(--brand-soft);color:var(--brand);font-weight:700;font-size:12.5px;border-radius:99px;padding:4px 11px;margin-bottom:12px}
html.dark .lg-badge{color:var(--ok-ink)}
.lg-badge svg{width:14px;height:14px}
.lg-terms{color:var(--muted);font-size:13px;text-align:center;margin-top:12px}
.lg-perk{display:flex;align-items:center;gap:12px;font-weight:700;font-size:14.5px;margin-bottom:14px;position:relative;z-index:1}
.lg-perk .pi{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none}
.lg-perk .pi svg{width:18px;height:18px}
.lg-perk small{display:block;font-weight:500;font-size:13px}
.pw-wrap{position:relative}.pw-wrap .inp{padding-right:46px}
.pw-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center;border-radius:8px}
.pw-eye svg{width:19px;height:19px}.pw-eye.on{color:var(--brand)}
/* Design "wall": product pictures behind two boxes */
.lgw{position:relative;overflow:hidden;display:flex;justify-content:center;padding:46px 16px 56px}
.lgw-wall{position:absolute;inset:-80px;display:grid;grid-template-columns:repeat(9,1fr);gap:16px;transform:rotate(-8deg);opacity:.9;align-content:start}
.lgw-wall img{width:100%;height:auto;aspect-ratio:1;border-radius:18px;object-fit:cover;display:block}
.lgw-shade{position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 72%,transparent),color-mix(in srgb,var(--bg) 90%,transparent))}
html.dark .lgw-shade{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 84%,transparent),color-mix(in srgb,var(--bg) 94%,transparent))}
.lgw-two{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:22px;width:100%;max-width:1000px;align-items:stretch}
.lgw-two.top{align-items:start}
.lgw-bx{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:38px 40px;box-shadow:0 30px 80px rgba(15,26,51,.14)}
.lgw-nc{display:flex;flex-direction:column;background:linear-gradient(155deg,var(--hero-a),var(--hero-b));border:0;color:#fff;position:relative;overflow:hidden}
.lgw-nc:after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.08);right:-120px;top:-120px}
.lgw-bi{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.16)}
.lgw-bi svg{width:26px;height:26px}
.lgw-nc h2{font-size:25px;font-weight:800;letter-spacing:-.4px;margin:18px 0 6px}
.lgw-nc p.t{opacity:.9;margin-bottom:18px}
.lgw-nc .lg-perk .pi{background:rgba(255,255,255,.16)}.lgw-nc .lg-perk small{opacity:.8}
.lgw-fan{position:relative;height:150px;margin:0 0 18px}
.lgw-fan img{position:absolute;width:104px;height:104px;border-radius:16px;border:3px solid rgba(255,255,255,.9);box-shadow:0 14px 26px rgba(0,0,0,.25);left:calc(50% - 52px);top:20px;object-fit:cover}
.lgw-fan img:nth-child(1){transform:rotate(-14deg) translate(-90px,12px)}.lgw-fan img:nth-child(2){transform:rotate(-5deg) translate(-31px,0)}
.lgw-fan img:nth-child(3){transform:rotate(5deg) translate(31px,0)}.lgw-fan img:nth-child(4){transform:rotate(14deg) translate(90px,12px)}
.lgw-go{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:8px;height:50px;border-radius:12px;background:#fff;color:var(--brand-dd);font-weight:800;position:relative;z-index:1}
.lgw-go svg{width:18px;height:18px}
@media (max-width:760px){
  .lgw{padding:20px 14px 26px}
  .lgw-wall{grid-template-columns:repeat(4,1fr);gap:10px;inset:-40px -60px}
  .lgw-two{grid-template-columns:1fr;gap:14px}.lgw-bx{padding:24px 20px;border-radius:20px}
  .lgw-nc h2{font-size:20px;margin-top:12px}.lgw-fan{display:none}.lgw-nc .lg-perk:nth-of-type(n+2){display:none}.lgw-go{margin-top:6px}
}
/* Design "glow": soft colour glow, form with a colour border, tiles on the right */
.lgg{position:relative;overflow:hidden;padding:40px 16px 56px}
.lgg-blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;pointer-events:none}
.lgg-blob.b1{width:520px;height:520px;background:var(--hero-b);left:4%;top:-120px;opacity:.35}
.lgg-blob.b2{width:480px;height:480px;background:var(--hero-accent);right:4%;bottom:-160px}
.lgg-blob.b3{width:320px;height:320px;background:var(--brand);right:28%;top:30px;opacity:.15}
html.dark .lgg-blob{opacity:.18}
.lgg-bn{position:relative;display:grid;grid-template-columns:440px 1fr;gap:18px;max-width:1180px;margin:0 auto;align-items:start}
.lgg-gb{border-radius:26px;padding:2px;background:linear-gradient(140deg,var(--brand),var(--hero-b) 55%,var(--hero-accent))}
.lgg-in{background:var(--card);border-radius:24px;padding:32px 34px}
.lgg .lg-form h1{background:linear-gradient(90deg,var(--brand),var(--hero-b));-webkit-background-clip:text;background-clip:text;color:transparent}
html.dark .lgg .lg-form h1{background:linear-gradient(90deg,var(--ok-ink),var(--hero-accent));-webkit-background-clip:text;background-clip:text}
.lgg .lg-form .btn-main{background:linear-gradient(90deg,var(--brand-d),var(--brand) 55%,var(--hero-b));border:0}
.lgg-tiles{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-content:start}
.lgg-tile{background:color-mix(in srgb,var(--card) 78%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:24px;padding:22px;position:relative;overflow:hidden}
.lgg-tile .ti{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;margin-bottom:12px;background:var(--brand-soft);color:var(--brand)}
html.dark .lgg-tile .ti{color:var(--ok-ink)}
.lgg-tile .ti svg{width:20px;height:20px}
.lgg-tile b{display:block;font-size:16px}.lgg-tile span.t{color:var(--muted);font-size:13.5px}
.lgg-tile.big{grid-column:1/3;min-height:250px;background:linear-gradient(135deg,var(--hero-a),var(--brand) 50%,var(--hero-b));color:#fff;border:0;padding:30px;display:flex;flex-direction:column;justify-content:flex-end}
.lgg-tile.big:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.10);right:-90px;top:-110px}
.lgg-tile.big .k{font-size:12.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;opacity:.85;position:relative;z-index:1}
.lgg-tile.big h2{font-size:28px;font-weight:900;letter-spacing:-.7px;line-height:1.15;margin:6px 0 8px;max-width:330px;position:relative;z-index:1}
.lgg-tile.big p{opacity:.92;max-width:320px;margin-bottom:18px;position:relative;z-index:1}
.lgg-go{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;height:46px;padding:0 22px;border-radius:12px;background:#fff;color:var(--brand-dd);font-weight:800;position:relative;z-index:1}
.lgg-go svg{width:18px;height:18px}
.lgg-tile.big .pics{position:absolute;right:26px;top:24px;display:grid;grid-template-columns:repeat(3,72px);gap:10px;transform:rotate(6deg)}
.lgg-tile.big .pics img{width:72px;height:72px;border-radius:16px;border:3px solid rgba(255,255,255,.85);object-fit:cover}
.lgg-tile.pay{grid-column:1/3;display:flex;align-items:center;gap:16px}.lgg-tile.pay .ti{margin:0;flex:none}
.lgg-chips{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}.lgg-chips span{border:1px solid var(--line);border-radius:99px;padding:5px 12px;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap;background:var(--card)}
@media (max-width:1100px){.lgg-tile.big .pics{display:none}}
@media (max-width:900px){.lgg-bn{grid-template-columns:1fr;max-width:560px}}
@media (max-width:760px){
  .lgg{padding:16px 14px 26px}.lgg-blob.b1{width:300px;height:300px;left:-80px}.lgg-blob.b2{width:260px;height:260px;right:-80px;bottom:-60px}
  .lgg-bn{gap:12px}.lgg-in{padding:24px 20px}.lgg-tiles{gap:12px}.lgg-tile{padding:16px;border-radius:20px}
  .lgg-tile.big{padding:20px;min-height:0}.lgg-tile.big h2{font-size:21px}.lgg-tile.big p{font-size:13.5px}.lgg-go{width:100%;justify-content:center}
  .lgg-tile.pay{display:none}.lgg-tile .ti{width:38px;height:38px;margin-bottom:8px}.lgg-tile b{font-size:14.5px}.lgg-tile span.t{font-size:12.5px}
}

/* Product request price on the customer's order page */
.offer-box{border:1.5px solid var(--brand);border-radius:14px;padding:16px 18px;margin:14px 0;background:var(--brand-softer)}
.offer-box>b{display:block;font-size:18px;font-weight:800;margin-bottom:4px;color:var(--ink)}
.offer-box>p{margin:0 0 12px;color:var(--muted);font-size:14.5px}
.offer-rows{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px 14px;margin:0 0 12px}
.offer-rows>div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;font-size:14.5px}
.offer-rows>div+div{border-top:1px solid var(--line)}
.offer-rows span{color:var(--muted)}
.offer-rows .left b{font-size:19px;color:var(--brand)}
.offer-rows .left span{color:var(--ink);font-weight:700}
.offer-no{margin-top:10px}
.offer-no>summary{list-style:none;cursor:pointer}
.offer-no>summary::-webkit-details-marker{display:none}
.offer-no[open]>summary{display:none}
.offer-ways{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.offer-way{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.offer-way>b{font-size:15px;color:var(--ink)}
.offer-way>p{margin:0;color:var(--muted);font-size:13.5px;flex:1}
.offer-way .l{margin-top:4px}
.offer-in{display:flex;gap:8px;width:100%}
.offer-in .inp{flex:1;min-width:0}
@media (max-width:620px){.offer-ways{grid-template-columns:1fr}}

/* Product information staff add on an order (codes, product details) */
.pinfo{margin:14px 0 4px;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--card);box-shadow:0 6px 20px rgba(15,23,42,.06)}
.pinfo-h{background:linear-gradient(120deg,var(--brand),var(--brand-d));color:#fff;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:800;font-size:15px}
.pinfo-h small{font-weight:600;opacity:.85;font-size:12px;white-space:nowrap}
.pinfo-t{white-space:pre-wrap;padding:14px 16px;font-size:15px;line-height:1.6;color:var(--ink);overflow-wrap:anywhere}
.pinfo-f{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.pinfo-copy{border:0;background:var(--brand-soft);color:var(--brand);font:inherit;font-weight:700;font-size:13px;border-radius:9px;padding:7px 14px;cursor:pointer}
.pinfo-copy.done{background:var(--ok-bg);color:var(--ok-ink)}
html.dark .pinfo{box-shadow:none}

/* Refund proof on a refunded order */
.rproof{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border:1px solid var(--line);background:var(--card);border-radius:14px;padding:14px 16px;margin:14px 0}
.rproof-h{display:flex;gap:12px;align-items:center;min-width:0;flex:1}
.rproof-h i{width:38px;height:38px;border-radius:12px;background:#e8f8ee;color:#16a34a;display:grid;place-items:center;font-style:normal;font-size:18px;font-weight:800;flex:none}
html.dark .rproof-h i{background:rgba(34,197,94,.15);color:#4ade80}
.rproof-h b{display:block;font-size:15.5px;color:var(--ink)}
.rproof-h small{display:block;color:var(--muted);font-size:13.5px}
.rproof-box{max-width:560px;max-height:90vh;overflow:auto}
.rproof-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.rproof-files img{width:100%;border-radius:10px;border:1px solid var(--line);display:block}
.rproof-pdf{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:150px;border:1px solid var(--line);border-radius:10px;font-size:12.5px;color:var(--muted);text-decoration:none;padding:8px;text-align:center;overflow-wrap:anywhere}
.rproof-pdf span{font-size:22px;font-weight:800;color:var(--brand)}
@media (max-width:520px){.rproof .btn{width:100%}}
.chg-box .offer-rows b{text-align:right}
/* Product page header: picture 300px beside the details (phone: 200px picture on top, name below) */
.phead.pB{display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;padding:20px;align-items:start}
.pB .pic-frame{position:relative;width:300px;aspect-ratio:1;border-radius:18px;overflow:hidden;background:var(--brand-softer);box-shadow:0 10px 26px rgba(0,0,0,.10)}
.phead.pB .pic-frame img{width:100%;height:100%;border-radius:0;object-fit:cover}
.pB .phd{min-width:0}
.pB h1{font-size:30px;margin-top:6px}
.pB .desc{font-size:14px;color:var(--muted);margin:12px 0 0;line-height:1.55}
.pB .rg{margin:18px 0 0}
@media (max-width:760px){
  .phead.pB{grid-template-columns:minmax(0,1fr);gap:14px;padding:14px;justify-items:center}
  .pB .pic-frame{width:200px;border-radius:16px}
  .pB .phd{width:100%;text-align:center}
  .pB h1{font-size:22px;margin-top:0}
  .pB .meta{justify-content:center}
  .pB .desc{font-size:13px;margin-top:8px}
  .pB .rg{margin-top:14px;text-align:left}
}

/* Yes/No pop-up (public/js/ask.js) */
.gbask{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px;background:rgba(8,14,30,.55);backdrop-filter:blur(3px);animation:gbask-in .14s ease}
.gbask[hidden]{display:none}
.gbask-box{width:100%;max-width:400px;background:var(--card,#fff);color:var(--ink,#0f1a33);border-radius:18px;padding:24px 22px 18px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.3);animation:gbask-pop .16s ease-out}
.gbask-i{width:46px;height:46px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:22px;background:var(--brand-soft,#eef4ff);color:var(--brand,#2563eb)}
.gbask-box p{margin:0 0 18px;font-size:15.5px;line-height:1.5;font-weight:600}
.gbask-b{display:flex;gap:10px}
.gbask-b button{flex:1;height:44px;border-radius:12px;font:inherit;font-weight:700;font-size:14.5px;cursor:pointer;border:1.5px solid var(--line,#e2e8f4);background:transparent;color:inherit}
.gbask-b .gbask-yes{background:var(--brand,#2563eb);border-color:var(--brand,#2563eb);color:#fff}
.gbask-b button:focus-visible{outline:3px solid var(--brand-soft,#bcd2ff);outline-offset:2px}
html.gbask-on{overflow:hidden}
@keyframes gbask-in{from{opacity:0}}
@keyframes gbask-pop{from{opacity:0;transform:scale(.94)}}
@media (max-width:420px){.gbask-b{flex-direction:column-reverse}}
.cancel-unpaid{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:10px 12px 10px 14px;border:1.5px dashed var(--line);border-radius:12px;font-size:14px;color:var(--muted)}

/* Header Games and Gift Cards buttons (icon box with a short line); on phone a row under the header on shop pages */
.nav{align-items:center}
.nav a.hb,.hbrow a.hb{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:5px 12px 5px 5px;border-radius:12px;line-height:1.1;font-weight:700;transition:border-color .15s,box-shadow .15s,transform .15s}
.hb i{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#fff;font-style:normal;flex:none}
.hb.g i{background:#2563eb}.hb.c i{background:#f97316}
.hb small{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-top:1px}
.nav a.hb:hover,.hbrow a.hb:hover{border-color:var(--brand);color:var(--ink);box-shadow:0 4px 12px rgba(15,26,51,.08);transform:translateY(-1px)}
.nav a.hb.on,.hbrow a.hb.on{border-color:var(--brand);background:var(--brand-softer);color:var(--ink)}
body.head-dark .nav a.hb,html.dark .nav a.hb,html.dark .hbrow a.hb{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#fff}
body.head-dark .nav a.hb small,html.dark .hb small{color:#a9b4cc}
body.head-dark .nav a.hb.on,html.dark .nav a.hb.on,html.dark .hbrow a.hb.on{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.12)}
.hbrow{display:none}
@media (max-width:1180px){.nav a.hb small{display:none}.nav a.hb{padding:4px 10px 4px 4px}.nav a.hb i{width:26px;height:26px}}
@media (max-width:760px){.hbrow{display:flex;gap:8px;max-width:1180px;margin:0 auto;padding:10px 16px 0}.hbrow a.hb{flex:1;min-width:0}.hbrow a.hb span{min-width:0}}
@media (prefers-reduced-motion:reduce){.nav a.hb,.hbrow a.hb{transition:none}.nav a.hb:hover,.hbrow a.hb:hover{transform:none}}

/* Wallet: Add money button beside the balance, amount box, then the payment step */
.balrow{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.addmoney{display:inline-flex;align-items:center;gap:6px}.addmoney span{font-size:18px;line-height:1}
.addbox{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--brand-softer)}
.addbox[hidden]{display:none}
.addrow{display:flex;gap:8px;margin-top:6px}.addrow .inp{flex:1;min-width:0;max-width:260px}
.addbox .err{color:var(--bad-ink);font-weight:600;font-size:13px;margin-top:6px}
html.dark .addbox{background:rgba(255,255,255,.04)}
.addhead{font-size:20px;margin:6px 0 12px}
.addsum{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:12px;background:var(--brand-softer)}
.addsum b{font-size:22px;font-weight:900;color:var(--brand-dd)}
html.dark .addsum{background:rgba(255,255,255,.05)}html.dark .addsum b{color:var(--ink)}
.backlink{font-size:13px;font-weight:600;color:var(--muted)}

/* My orders: orders that need the customer stand out in a box */
.acc-orders .ao.ao-act{background:#fff7ed;border:1px solid #fdba74;border-left:4px solid #f97316;border-radius:12px;margin:6px 0;padding-left:10px;padding-right:10px}
.acc-orders .ao.ao-act + .ao{border-top:0}
.acc-orders .ao.ao-act:hover{background:#ffedd5}
.ao-tag{display:block;margin-top:5px;font-size:12px;font-weight:600;color:#9a3412;line-height:1.3}
.ao-tag b{display:inline-block;background:#f97316;color:#fff;font-size:10.5px;letter-spacing:.3px;text-transform:uppercase;padding:2px 7px;border-radius:999px;margin-right:6px}
html.dark .acc-orders .ao.ao-act{background:rgba(249,115,22,.1);border-color:rgba(249,115,22,.45);border-left-color:#f97316}
html.dark .acc-orders .ao.ao-act:hover{background:rgba(249,115,22,.16)}
html.dark .ao-tag{color:#fdba74}
@media (max-width:760px){.acc-orders .ao.ao-act{padding-left:8px;padding-right:8px}.ao-tag b{display:table;margin:0 0 3px}}

/* Live search suggestions */
form.has-sugg{position:relative}
.sugg{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 40px rgba(15,26,51,.16);padding:6px;min-width:280px;text-align:left}
.sugg[hidden]{display:none}
.sugg a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;color:var(--ink);text-decoration:none}
.sugg a:hover,.sugg a.on{background:var(--brand-softer)}
.sugg img{width:40px;height:40px;border-radius:9px;object-fit:cover;flex:none;background:var(--bg)}
.sugg span{flex:1;min-width:0}.sugg b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sugg small{display:block;font-size:12px;color:var(--muted)}
.sugg em{font-style:normal;font-size:12.5px;font-weight:700;color:var(--brand);white-space:nowrap}
.sugg a.sugg-all{justify-content:center;font-size:13px;font-weight:700;color:var(--brand);border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:4px}
.sugg-none{padding:12px;font-size:13px;color:var(--muted)}
html.dark .sugg{box-shadow:0 16px 40px rgba(0,0,0,.5)}html.dark .sugg a:hover,html.dark .sugg a.on{background:rgba(255,255,255,.07)}html.dark .sugg em,html.dark .sugg a.sugg-all{color:#93c5fd}

/* Category chips folded behind » until they slide out */
.chips.fold a.chip:not(:first-child){display:none}
.chip-more{cursor:pointer;color:var(--brand);font-size:16px;line-height:1;padding:9px 14px;font-family:inherit}
.chip-more span{display:inline-block;animation:chip-nudge 1.4s ease-in-out infinite}
.chip-more:hover{border-color:var(--brand)}
.chips.unfold a.chip:not(:first-child){animation:chip-in .38s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--k,1) * 70ms)}
@keyframes chip-in{from{opacity:0;transform:translateX(-14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes chip-nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.chips.unfold a.chip,.chip-more span{animation:none}}
/* Account settings: Verify mobile button beside the number, password in a pop-up */
.inp-act{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.inp-act .inp{width:100%}
.btn-verify{height:44px;font-size:15px;background:#f59e0b;border:1.5px solid #f59e0b;color:#fff;font-weight:700;border-radius:12px;padding:0 16px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.btn-verify svg{width:16px;height:16px}
.btn-verify:hover{background:#d97706;border-color:#d97706}
.pw-card{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.pw-box{max-width:420px}
.pw-box .form-row{margin-bottom:12px}
.pw-acts{display:flex;gap:10px;justify-content:flex-end;margin-top:6px}
.pw-acts .btn{height:48px;font-size:15px;padding:0 18px;white-space:nowrap}
@media (max-width:420px){.pw-acts .btn{flex:0 0 auto}.pw-acts .btn-main{flex:1}}
/* Checkout: a payment method that needs a verified mobile/email first (Settings > Payments) */
.pay.locked{cursor:default;opacity:1}
.pay.locked>.radio,.pay.locked>.plogo,.pay.locked>div>b{opacity:.5}
.pay.locked>div{flex:1;min-width:0}
.vlock{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;margin-top:8px;padding:9px 11px;border-radius:10px;background:#fff7e6;border:1px solid #f6d79a;color:#8a5200;font-size:13px;font-weight:600;line-height:1.4}
.vlock .vl-t{display:flex;gap:7px;align-items:flex-start;flex:1 1 220px}.vlock .vl-t svg{flex:none;margin-top:1px}
.vlock .vb{margin-left:auto;display:inline-flex;gap:6px;flex-wrap:wrap}
.vlock a{background:#f59e0b;color:#1f1300;border:1.5px solid #f59e0b;border-radius:9px;padding:6px 12px;font-weight:800;font-size:12.5px;white-space:nowrap;text-decoration:none}
.vlock a:hover{background:#d97706;border-color:#d97706}
.vlock a.alt{background:transparent;color:inherit}.vlock a.alt:hover{background:rgba(245,158,11,.15)}
html.dark .vlock{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.35);color:#fbbf24}

/* Package cards: designs staff choose in Settings > Appearance (.pkd-a ... .pkd-m), price under a dashed line, never wraps (1.1.113) */
.pkd{container-type:inline-size;--line2:color-mix(in srgb,var(--line),var(--muted) 28%);--stub:color-mix(in srgb,var(--brand-softer) 55%,var(--card))}
.pkd .pk{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@container (max-width:640px){.pkd .pk{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (max-width:470px){.pkd .pk{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
.pkd .pk .p{display:flex;flex-direction:column;padding:0;text-align:left;border:1.5px solid var(--line2);border-radius:12px;min-width:0}
.pkd .pk .p:has(input:checked){border-color:var(--brand);background:var(--brand-softer);box-shadow:0 0 0 3px var(--brand-soft)}
.pkd .pk .p:has(input:checked)::after{content:none}
.pkd .pk .p .pt{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.pkd .pk .p .amt{font-weight:700;font-size:14.5px;line-height:1.3;overflow-wrap:break-word;text-wrap:pretty;min-width:0;max-width:100%}
.pkd .pk .p .amt small{font-size:12px;font-weight:500;margin-top:1px}
.pkd .pk .p .pp{display:flex;align-items:center;gap:6px;min-width:0;margin-top:auto}
.pkd .pk .p .pr{margin:0;display:flex;align-items:baseline;flex-wrap:wrap;column-gap:6px;row-gap:0;font-size:inherit;color:inherit;line-height:1.25}
.pkd .pk .p .pr b{white-space:nowrap;font-weight:800;color:var(--brand);font-size:16px;font-variant-numeric:tabular-nums}
html.dark .pkd .pk .p .pr b{color:var(--ok-ink)}
.pkd .pk .p .pr s{white-space:nowrap;margin:0;font-size:12px;line-height:1.1}
.pkd .pk .p.off .pr b{color:var(--muted)!important;font-size:13px}
.pkd .ins{display:inline-flex;align-items:center;gap:3px;white-space:nowrap;color:var(--ok-ink);font-size:11px;font-weight:700;line-height:1.4}
.pkd .ins svg{flex:none;width:12px;height:12px}
.pkd .ins-p,.pkd .rd{display:none}
.pkd .pk .p .bo{font-size:12px;color:var(--warn-ink);font-weight:600}
.pkd-a .ins-t,.pkd-b .ins-t,.pkd-c .ins-t,.pkd-d .ins-t,.pkd-e .ins-t,.pkd-f .ins-t{background:var(--ok-bg);border-radius:999px;padding:1px 8px 1px 6px;margin-top:2px}
@container (max-width:470px){.pkd .pk .p .amt{font-size:13.5px}.pkd .pk .p .pr b{font-size:15px}}
/* ticket notches: half circles that bite into the card edge at the dashed line */
.pkd-a .pk .p .pp::before,.pkd-a .pk .p .pp::after,.pkd-m .pk .p .pp::before,.pkd-m .pk .p .pp::after{content:"";position:absolute;top:-8px;width:9px;height:15px;background:var(--card);border:1.5px solid var(--line2)}
.pkd-a .pk .p .pp::before,.pkd-m .pk .p .pp::before{left:-1.5px;border-left:0;border-radius:0 9px 9px 0}
.pkd-a .pk .p .pp::after,.pkd-m .pk .p .pp::after{right:-1.5px;border-right:0;border-radius:9px 0 0 9px}
.pkd-a .pk .p:has(input:checked) .pp::before,.pkd-a .pk .p:has(input:checked) .pp::after,.pkd-m .pk .p:has(input:checked) .pp::before,.pkd-m .pk .p:has(input:checked) .pp::after,
.pkd-c .pk .p:has(input:checked) .pp::before,.pkd-c .pk .p:has(input:checked) .pp::after{border-color:var(--brand)}
/* solid price area when chosen (A, C, F, K) */
.pkd-a .pk .p:has(input:checked) .pp,.pkd-c .pk .p:has(input:checked) .pp,.pkd-f .pk .p:has(input:checked) .pp,.pkd-k .pk .p:has(input:checked) .pp{background:var(--brand)}
.pkd-a .pk .p:has(input:checked) .pr b,.pkd-c .pk .p:has(input:checked) .pr b,.pkd-f .pk .p:has(input:checked) .pr b,.pkd-k .pk .p:has(input:checked) .pr b,.pkd-d .pk .p:has(input:checked) .pr b{color:#fff}
.pkd-a .pk .p:has(input:checked) .pr s,.pkd-c .pk .p:has(input:checked) .pr s,.pkd-f .pk .p:has(input:checked) .pr s,.pkd-k .pk .p:has(input:checked) .pr s{color:rgba(255,255,255,.78)}
/* A · Ticket */
.pkd-a .pk .p{border-radius:14px}
.pkd-a .pk .p .pt{padding:12px 12px 10px;flex:1}
.pkd-a .pk .p .pp{position:relative;justify-content:center;border-top:2px dashed var(--line2);padding:9px 8px 10px;background:var(--stub);border-radius:0 0 12px 12px}
.pkd-a .pk .p .pr{justify-content:center}
.pkd-a .pk .p .pr b{font-size:17px}
.pkd-a .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
/* B · Price bar */
.pkd-b .pk .p{overflow:visible}
.pkd-b .pk .p .pt{padding:12px 36px 10px 12px;flex:1}
.pkd-b .pk .p .rd{display:block;position:absolute;top:12px;right:10px;width:18px;height:18px;border-radius:50%;border:2px solid var(--line2)}
.pkd-b .pk .p:has(input:checked) .rd{border:5.5px solid var(--brand);background:#fff}
.pkd-b .pk .p .pp{justify-content:space-between;border-top:1.5px dashed var(--line2);background:var(--stub);padding:9px 12px;border-radius:0 0 11px 11px}
.pkd-b .pk .p .pp::before{content:"Price";font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pkd-b .pk .p .pr{flex-direction:row-reverse;justify-content:flex-end}
.pkd-b .pk .p:has(input:checked) .pp{background:var(--brand-soft);border-top-color:var(--brand)}
@container (max-width:470px){.pkd-b .pk .p .pp::before{display:none}.pkd-b .pk .p .pr{flex-direction:row}}
/* C · Side ticket and K · Price block: one slim line per package */
.pkd-c .pk,.pkd-k .pk{grid-template-columns:repeat(3,minmax(0,1fr))}
@container (max-width:760px){.pkd-c .pk,.pkd-k .pk{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (max-width:520px){.pkd-c .pk,.pkd-k .pk{grid-template-columns:minmax(0,1fr);gap:8px}}
.pkd-c .pk .p,.pkd-k .pk .p{flex-direction:row;align-items:stretch}
.pkd-c .pk .p .pt,.pkd-k .pk .p .pt{flex:1;justify-content:center}
.pkd-c .pk .p .pp,.pkd-k .pk .p .pp{flex:none;margin:0;position:relative}
.pkd-c .pk .p .pr,.pkd-k .pk .p .pr{flex-direction:column;align-items:flex-end}
.pkd-c .pk .p .pt{padding:10px 12px}
.pkd-c .pk .p .pp{width:108px;justify-content:center;border-left:2px dashed var(--line2);background:var(--stub);padding:8px;border-radius:0 11px 11px 0}
.pkd-c .pk .p .pr{align-items:center}
.pkd-c .pk .p .pp::before,.pkd-c .pk .p .pp::after{content:"";position:absolute;left:-8px;width:15px;height:9px;background:var(--card);border:1.5px solid var(--line2)}
.pkd-c .pk .p .pp::before{top:-1.5px;border-top:0;border-radius:0 0 9px 9px}
.pkd-c .pk .p .pp::after{bottom:-1.5px;border-bottom:0;border-radius:9px 9px 0 0}
.pkd-c .pk .p .pr b{font-size:16.5px}
.pkd-c .pk .p:has(input:checked) .pp{border-left-color:var(--brand)}
.pkd-c .pk .p.off .pr b,.pkd-k .pk .p.off .pr b{font-size:12px}
/* K · Price block (K6) */
.pkd-k .pk .p{padding:5px}
.pkd-k .pk .p .pt{flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:center;align-content:center;gap:3px 8px;padding:6px 8px}
.pkd-k .pk .p .amt{flex:0 1 auto}
.pkd-k .pk .p .pp{min-width:92px;justify-content:flex-end;border-radius:9px;background:var(--brand-softer);margin-left:6px;padding:6px 12px}
.pkd-k .pk .p .pp::before{content:"";position:absolute;left:-7px;top:4px;bottom:4px;border-left:1.5px dashed var(--line2)}
.pkd-k .pk .p .pr s{font-size:11.5px;line-height:1}
.pkd-k .ins-t,.pkd-l .ins-t{background:var(--ok-bg);border-radius:6px;padding:2px 6px 2px 4px;font-size:10.5px}
/* D · Price chip */
.pkd-d .pk .p{border-radius:14px;text-align:center;border-color:var(--line)}
.pkd-d .pk .p .pt{align-items:center;padding:14px 10px 10px;flex:1}
.pkd-d .pk .p .pp{justify-content:center;border-top:1.5px dashed var(--line2);margin:0 10px;padding:10px 0 12px}
.pkd-d .pk .p .pr{flex-direction:column;align-items:center}
.pkd-d .pk .p .pr b{display:inline-block;background:var(--brand-softer);border:1px solid var(--brand-soft);border-radius:999px;padding:4px 14px}
.pkd-d .pk .p .pr s{margin-top:3px}
.pkd-d .pk .p.off .pr b{background:transparent;border-color:var(--line)}
.pkd-d .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
.pkd-d .pk .p:has(input:checked) .pr b{background:var(--brand);border-color:var(--brand)}
.pkd-d .pk .p:has(input:checked)::after{content:"✓"}
/* E · Big price */
.pkd-e .pk .p{padding:0 12px;border-color:var(--line)}
.pkd-e .pk .p .pt{padding:12px 0 10px;flex:1}
.pkd-e .pk .p .pp{justify-content:space-between;gap:8px;border-top:1.5px dashed var(--line2);padding:10px 0 11px}
.pkd-e .pk .p .pr{flex-direction:column;align-items:flex-start}
.pkd-e .pk .p .pr b{font-size:18px;letter-spacing:-.01em}
.pkd-e .pk .p .rd{display:block;flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--line2)}
.pkd-e .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
.pkd-e .pk .p:has(input:checked) .rd{border:5.5px solid var(--brand);background:#fff}
@container (max-width:470px){.pkd-e .pk .p .pr b{font-size:16px}}
/* F · Price band */
.pkd-f .pk .p{text-align:center;border-color:var(--line)}
.pkd-f .pk .p .pt{align-items:center;justify-content:center;padding:14px 10px 12px;flex:1}
.pkd-f .pk .p .pp{justify-content:center;border-top:2px dashed var(--line2);background:var(--brand-softer);padding:10px 8px;border-radius:0 0 11px 11px}
.pkd-f .pk .p .pr{justify-content:center}
.pkd-f .pk .p .pr b{font-size:17px}
.pkd-f .pk .p.off .pp{background:var(--stub)}
.pkd-f .pk .p:has(input:checked) .pp{border-top-color:rgba(255,255,255,.55)}
/* G · Tag beside name */
.pkd-g .pk .p{padding:10px 12px}
.pkd-g .pk .p .pt{flex-direction:row;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:4px 6px;margin-bottom:9px}
.pkd-g .pk .p .amt{flex:0 1 auto}
.pkd-g .ins-t{border:1px solid currentColor;border-radius:6px;padding:1px 5px;font-size:10px;text-transform:uppercase;letter-spacing:.05em;margin-top:1px}
.pkd-g .pk .p .pp{border-top:1.5px dashed var(--line2);padding-top:8px}
.pkd-g .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
@container (max-width:470px){.pkd-g .pk .p{padding:9px 10px}.pkd-g .ins-t{padding:1px 4px;font-size:9.5px}}
/* H · Instant by price */
.pkd-h .pk .p{padding:10px 12px}
.pkd-h .pk .p .pt{margin-bottom:8px}
.pkd-h .ins-t{display:none}.pkd-h .ins-p{display:inline-flex;order:2}
.pkd-h .pk .p .pp{justify-content:space-between;flex-wrap:wrap;gap:2px 8px;border-top:1.5px dashed var(--line2);padding-top:8px}
.pkd-h .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
/* J · Top flag */
.pkd-j .pk{row-gap:16px;padding-top:6px}
.pkd-j .pk .p{padding:12px 12px 10px;text-align:center}
.pkd-j .pk .p .pt{align-items:center}
.pkd-j .ins-t{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--brand);color:#fff;border-radius:999px;padding:1px 8px 1px 6px;font-size:10px;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 0 0 3px var(--card)}
.pkd-j .pk .p .tag{left:auto;right:8px}
.pkd-j .pk .p .pp{justify-content:center;border-top:1.5px dashed var(--line2);margin:9px 4px 0;padding-top:8px}
.pkd-j .pk .p .pr{justify-content:center}
.pkd-j .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
/* L · Chip after name */
.pkd-l .pk .p{padding:10px 12px}
.pkd-l .pk .p .pt{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-bottom:9px}
.pkd-l .pk .p .pp{border-top:1.5px dashed var(--line2);padding-top:8px}
.pkd-l .pk .p .pr b{font-size:16.5px}
.pkd-l .pk .p:has(input:checked) .pp{border-top-color:var(--brand)}
.pkd-l .pk .p:has(input:checked)::after{content:"";top:-1.5px;right:-1.5px;width:0;height:0;background:none;border-radius:0 12px 0 0;border-top:22px solid var(--brand);border-left:22px solid transparent}
/* M · Small ticket */
.pkd-m .pk .p .pt{padding:10px 12px 9px;flex:1}
.pkd-m .ins-t{display:none}.pkd-m .ins-p{display:inline-flex}
.pkd-m .pk .p .pp{position:relative;justify-content:space-between;flex-wrap:wrap;gap:2px 6px;border-top:1.5px dashed var(--line2);padding:8px 12px 9px;background:var(--stub);border-radius:0 0 11px 11px}
.pkd-m .pk .p .pr{margin-left:auto}
.pkd-m .pk .p:has(input:checked) .pp{background:var(--brand-soft);border-top-color:var(--brand)}

/* Currency icons: the icon in a soft tile left of the package name, on every card design (1.1.116) */
.pkd .dl,.pkd .sl,.pkd .tg2{display:none}
.pkd .pk .p .ct{display:flex;align-items:center;gap:9px;min-width:0;max-width:100%}
.pkd .pk .p .ci{flex:none;display:block;width:32px;height:32px;padding:3px;border-radius:9px;background:var(--brand-softer);object-fit:contain}
.pkd .pk .p:has(input:checked) .ci{background:var(--card)}
.pkd .pk .p.off .ci{filter:grayscale(1);opacity:.7}
.pkd-g .pk .p .ct,.pkd-k .pk .p .ct,.pkd-l .pk .p .ct{flex:0 1 auto}
.pkd-d .pk .p .ct,.pkd-f .pk .p .ct,.pkd-j .pk .p .ct{justify-content:center}
@container (max-width:470px){.pkd .pk .p .ct{gap:6px}.pkd .pk .p .ci{width:24px;height:24px;padding:1px;border-radius:7px}}
.pkd .tg2{flex:none;align-items:center;white-space:nowrap;background:var(--warn);color:#3b2600;font-size:10px;font-weight:800;border-radius:6px;padding:1px 6px;line-height:1.5}
.pkd-t .ins-t,.pkd-v .ins-t,.pkd-w .ins-t{background:var(--ok-bg);border-radius:6px;padding:2px 6px 2px 4px;font-size:10.5px}
/* Designs that put several lines, pills or rows in one box: their own column rules win over "Cards per row" */
/* T · Grouped list */
.pkd.pkd-t .pk.pk{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;border:1.5px solid var(--line);border-radius:14px;padding:4px 14px;background:var(--card)}
@container (max-width:560px){.pkd.pkd-t .pk.pk{grid-template-columns:minmax(0,1fr);padding:2px 12px}}
.pkd-t .pk .p{flex-direction:row;align-items:center;gap:10px;border:0;border-radius:0;border-bottom:1px solid var(--line);padding:11px 2px;background:transparent}
.pkd-t .pk .p:nth-last-child(1),.pkd-t .pk .p:nth-last-child(2):nth-child(odd),.pkd-t .pk .p:nth-last-child(2):nth-child(even){border-bottom:0}
@container (max-width:560px){.pkd-t .pk .p:nth-last-child(2):nth-child(odd),.pkd-t .pk .p:nth-last-child(2):nth-child(even){border-bottom:1px solid var(--line)}}
.pkd-t .pk .p:has(input:checked){background:transparent;box-shadow:none;border-color:var(--line);border-bottom:1.5px solid var(--brand)}
.pkd-t .pk .p .pp{display:contents}
.pkd-t .pk .p .rd{display:block;order:-1;flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--line2)}
.pkd-t .pk .p:has(input:checked) .rd{border:5px solid var(--brand);background:#fff}
.pkd-t .pk .p .pt{flex:1;flex-direction:row;flex-wrap:wrap;align-items:center;gap:3px 8px}
.pkd-t .pk .p .ct{flex:0 1 auto}
.pkd-t .pk .p:has(input:checked) .amt{color:var(--brand)}
html.dark .pkd-t .pk .p:has(input:checked) .amt{color:var(--ok-ink)}
.pkd-t .pk .p .pr{flex:none;flex-direction:column;align-items:flex-end}
.pkd-t .pk .p .pr s{font-size:11.5px;line-height:1}
.pkd-t .pk .p.off .pr b{font-size:12px}
.pkd-t .pk .p>.tag{display:none}.pkd-t .tg2{display:inline-flex}
/* U · Pill buttons */
.pkd.pkd-u .pk.pk{display:flex;flex-wrap:wrap;gap:8px}
.pkd-u .pk .p{flex-direction:row;align-items:center;gap:8px;border-radius:999px;padding:5px 5px 5px 14px;max-width:100%}
.pkd-u .pk .p .pt{flex-direction:row;align-items:center;gap:6px;min-width:0}
.pkd-u .pk .p .ct{gap:6px}
.pkd-u .pk .p .ci{width:24px;height:24px;padding:1px;border-radius:50%;margin-left:-8px}
.pkd-u .pk .p .amt{font-size:14px}
.pkd-u .pk .p .amt small{display:none}
.pkd-u .ins-t{order:-1;font-size:0;gap:0;width:20px;height:20px;justify-content:center;border-radius:50%;background:var(--ok-bg);margin-left:-6px;flex:none}
.pkd-u .pk .p .bo{display:none}
.pkd-u .pk .p .pp{margin:0;flex:none}
.pkd-u .pk .p .pr{flex-wrap:nowrap;background:var(--brand-softer);border-radius:999px;padding:4px 11px}
.pkd-u .pk .p .pr b{font-size:14.5px}
.pkd-u .pk .p .pr s{font-size:11px}
.pkd-u .pk .p:has(input:checked){background:var(--brand);border-color:var(--brand)}
.pkd-u .pk .p:has(input:checked) .amt{color:#fff}
.pkd-u .pk .p:has(input:checked) .pr{background:rgba(255,255,255,.18)}
.pkd-u .pk .p:has(input:checked) .pr b,.pkd-u .pk .p:has(input:checked) .pr s{color:#fff!important}
.pkd-u .pk .p:has(input:checked) .ins-t{background:rgba(255,255,255,.22);color:#fff}
.pkd-u .pk .p.off .pr{background:transparent}.pkd-u .pk .p.off .pr b{font-size:12px}
.pkd-u .pk .p>.tag{display:none}.pkd-u .tg2{display:inline-flex}
/* V · Price tag */
.pkd-v .pk,.pkd-w .pk,.pkd-y .pk{grid-template-columns:repeat(3,minmax(0,1fr))}
@container (max-width:760px){.pkd-v .pk,.pkd-w .pk,.pkd-y .pk{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (max-width:520px){.pkd.pkd-v .pk.pk,.pkd.pkd-w .pk.pk{grid-template-columns:minmax(0,1fr);gap:8px}}
.pkd-v .pk .p{flex-direction:row;align-items:center;gap:10px;padding:9px 10px 9px 14px}
.pkd-v .pk .p .pt{flex:1;flex-direction:row;flex-wrap:wrap;align-items:center;gap:3px 8px}
.pkd-v .pk .p .ct{flex:0 1 auto}
.pkd-v .pk .p .pp{position:relative;flex:none;margin:0;background:var(--brand-softer);padding:6px 12px 6px 19px;border-radius:4px 8px 8px 4px;clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}
.pkd-v .pk .p .pp::before{content:"";position:absolute;left:9px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--card)}
.pkd-v .pk .p .pr{flex-direction:column;align-items:flex-end}
.pkd-v .pk .p .pr s{font-size:11.5px;line-height:1}
.pkd-v .pk .p:has(input:checked) .pp{background:var(--brand)}
.pkd-v .pk .p:has(input:checked) .pr b{color:#fff}
.pkd-v .pk .p:has(input:checked) .pr s{color:rgba(255,255,255,.78)}
.pkd-v .pk .p.off .pp{background:var(--stub)}.pkd-v .pk .p.off .pr b{font-size:12px}
/* W · Icon tile */
.pkd-w .pk .p{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:2px;align-items:center;align-content:center;padding:10px 12px}
.pkd-w .pk .p:not(:has(.ci)){grid-template-columns:minmax(0,1fr)}
.pkd-w .pk .p .pt,.pkd-w .pk .p .ct{display:contents}
.pkd-w .pk .p .pt>*,.pkd-w .pk .p .ct>.amt,.pkd-w .pk .p .pp{grid-column:-2}
.pkd-w .pk .p .ci{grid-column:1;grid-row:1 / span 4;width:42px;height:42px;padding:5px;border-radius:11px}
@container (max-width:470px){.pkd-w .pk .p .ci{width:38px;height:38px;padding:4px;border-radius:10px}}
.pkd-w .pk .p .ins-t,.pkd-w .pk .p .tg2{justify-self:start}
.pkd-w .pk .p .pp{margin:0}
.pkd-w .pk .p .pr b{font-size:15.5px}
.pkd-w .pk .p:has(input:checked) .ci{background:var(--card);box-shadow:0 0 0 1.5px var(--brand)}
/* X · Table */
.pkd.pkd-x .pk.pk{display:block;border:1.5px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.pkd-x .pk .p{display:grid;grid-template-columns:minmax(0,1fr) 140px 110px 96px;align-items:center;gap:12px;border:0;border-radius:0;border-top:1px solid var(--line);padding:10px 14px}
.pkd-x .pk .p:first-child{border-top:0}
.pkd-x .pk .p:has(input:checked){background:var(--brand-softer);box-shadow:none;border-color:var(--line)}
.pkd-x .pk .p .pp{display:contents}
.pkd-x .pk .p .pt{grid-column:1;grid-row:1;flex-direction:row;flex-wrap:wrap;align-items:center;gap:3px 8px}
.pkd-x .pk .p .ct{flex:0 1 auto}
.pkd-x .ins-t,.pkd-x .pk .p>.tag,.pkd-x .pk .p .bo{display:none}.pkd-x .tg2{display:inline-flex}
.pkd-x .ins-p,.pkd-x .dl{display:inline-flex;grid-column:2;grid-row:1;min-width:0}
.pkd-x .dl{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere;line-height:1.3}
.pkd-x .pk .p .pr{grid-column:3;grid-row:1;flex-direction:column;align-items:flex-end}
.pkd-x .pk .p .pr s{font-size:11.5px;line-height:1}
.pkd-x .pk .p.off .pr b{font-size:12px}
.pkd-x .sl{display:block;grid-column:4;grid-row:1;text-align:center;border:1.5px solid var(--brand);color:var(--brand);border-radius:8px;padding:5px 0;font-size:13px;font-weight:700}
html.dark .pkd-x .sl{color:var(--ok-ink)}
.pkd-x .sl::before{content:"Select"}
.pkd-x .pk .p:has(input:checked) .sl{background:var(--brand);color:#fff}
.pkd-x .pk .p:has(input:checked) .sl::before{content:"Selected"}
.pkd-x .pk .p.off .sl{border-color:var(--line);color:var(--muted)}
.pkd-x .pk .p.off .sl::before{content:"—"}
@container (max-width:560px){
  .pkd-x .pk .p{grid-template-columns:minmax(0,1fr) auto;row-gap:3px;padding:10px 12px}
  .pkd-x .ins-p,.pkd-x .dl{grid-column:1;grid-row:2}
  .pkd-x .pk .p .pr{grid-column:2;grid-row:1 / span 2}
  .pkd-x .sl{display:none}
}
/* Y · Price on top */
.pkd-y .pk .p .pp{order:-1;margin:0;justify-content:space-between;gap:6px;background:var(--brand-softer);padding:8px 12px;border-radius:10.5px 10.5px 0 0}
.pkd-y .pk .p .pt{padding:9px 12px 10px;flex:1}
.pkd-y .pk .p .pr b{font-size:16.5px}
.pkd-y .ins-t{display:none}
.pkd-y .ins-p{display:inline-flex;order:2;font-size:0;gap:0;width:22px;height:22px;justify-content:center;border-radius:50%;background:var(--card);flex:none}
.pkd-y .pk .p:has(input:checked) .pp{background:var(--brand)}
.pkd-y .pk .p:has(input:checked) .pr b{color:#fff}
.pkd-y .pk .p:has(input:checked) .pr s{color:rgba(255,255,255,.78)}
.pkd-y .pk .p.off .pp{background:var(--stub)}.pkd-y .pk .p.off .pr b{font-size:13px}
.pkd-y .pk .p .tag{left:auto;right:8px;top:-9px}

/* Customer account: Dashboard, profile pictures, centred profile, compact stat tiles, account rows, order filters (1.1.113) */
input::-ms-reveal,input::-ms-clear{display:none}
.btn-login{display:inline-flex;align-items:center;gap:7px}
.btn-login svg{width:18px;height:18px;flex:none}
.avatar.pic{background:none!important;padding:0;overflow:hidden;border:0}
.avatar.pic img{width:100%;height:100%;display:block;object-fit:cover}
.avwrap{position:relative;flex:none;display:inline-grid}
.avedit{position:absolute;right:-3px;bottom:-3px;width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;border:2px solid var(--card);font-size:13px;line-height:1;cursor:pointer;padding:0}
.avedit:hover{background:var(--brand-d)}
.acc-me.mid{flex-direction:column;text-align:center;padding:20px 14px 16px;gap:8px}
.acc-me.mid .avatar{width:76px;height:76px;font-size:28px}
.acc-me.mid .t{align-items:center;width:100%}
.acc-me.mid small{max-width:100%}
.dropdown .menu .who.mid{flex-direction:column;text-align:center;gap:6px;padding:10px 10px 14px;word-break:normal}
.dropdown .menu .who.mid .avatar{width:58px;height:58px;font-size:22px}
.dropdown .menu .who.mid>span:last-child{width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-hero .avatar{width:68px;height:68px;border:3px solid rgba(255,255,255,.55)}
.dash-hero .avedit{border-color:rgba(255,255,255,.85)}
.acc-cta{display:flex;flex-direction:column;gap:8px;flex:none}
.acc-cta .btn{padding:10px 18px;justify-content:center}
.acc-hello .btn.hreq,.btn.hreq{background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff;border:0}
.acc-hello .btn.hreq:hover{filter:brightness(1.05)}
.todo{display:flex;align-items:center;gap:14px;padding:14px 18px;border:1.5px solid var(--warn);background:var(--warn-bg);color:var(--warn-ink);border-radius:16px}
.todo-t{display:flex;flex-direction:column;min-width:0}
.todo b{display:block;color:var(--ink)}
.todo .ic{width:40px;height:40px;border-radius:12px;background:var(--warn);color:#fff;display:grid;place-items:center;flex:none}
.todo .ic svg{width:20px;height:20px}
.todo .btn{margin-left:auto;flex:none}
.acc-stats .st{flex-direction:row;align-items:center;gap:12px;padding:12px 14px}
.acc-stats .st .ic{width:40px;height:40px;border-radius:12px;flex:none;margin:0}
.acc-stats .st .tx{display:flex;flex-direction:column;min-width:0;flex:1}
.acc-stats .st small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acc-stats .st b{font-size:21px;line-height:1.15;overflow:hidden;text-overflow:ellipsis}
.acc-stats .st .go{color:var(--muted);display:grid;flex:none}.acc-stats .st .go svg{width:16px;height:16px}
.dgrid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px}
.dh{font-size:17px}
.qa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.qa a{white-space:nowrap;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px 8px;border:1px solid var(--line);border-radius:14px;font-size:13px;font-weight:700;text-align:center;overflow:hidden;text-overflow:ellipsis;transition:border-color .15s}
.qa a:hover{border-color:var(--brand)}
.qa a .ic{width:40px;height:40px;border-radius:12px;background:var(--brand-softer);color:var(--brand);display:grid;place-items:center}
.qa a .ic svg{width:20px;height:20px}
.qa a.req{background:linear-gradient(135deg,#f59e0b,#f97316);border-color:transparent;color:#fff}
.qa a.req .ic{background:rgba(255,255,255,.22);color:#fff}
.secl{display:grid;gap:8px;margin-top:12px}
.acr{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;position:relative;overflow:hidden;transition:border-color .15s,background .15s;--acr-bg:var(--card)}
.acr .ck{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:900;flex:none}
.acr.a-ok .ck{background:var(--good-bg);color:var(--good-ink)}
.acr.a-no .ck{background:var(--warn-bg);color:var(--warn-ink)}
.acr.a-no{border-color:var(--warn);background:var(--warn-bg);--acr-bg:var(--warn-bg)}
.acr .tx{display:flex;flex-direction:column;min-width:0;flex:1}
.acr .tx b{font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acr .tx small{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acr .act{flex:none;font-size:13px;font-weight:700;color:var(--brand);white-space:nowrap;max-width:0;opacity:0;overflow:hidden;transition:max-width .2s,opacity .15s}
.acr.a-no .act{max-width:160px;opacity:1;color:var(--warn-ink)}
.acr:hover,.acr:focus-visible{border-color:var(--brand);background:var(--brand-softer)}
.acr:hover .act,.acr:focus-visible .act{max-width:160px;opacity:1}
.spend{display:grid;margin-top:14px;background:var(--brand-softer);border-radius:12px;padding:4px 14px}
.spend div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.spend div:last-child{border:0}
.spend small{color:var(--muted);font-size:14px;white-space:nowrap}
.spend b{font-size:15px;white-space:nowrap}
.pop{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:12px}
.pop a{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:12.5px;font-weight:700;min-width:0;transition:border-color .15s}
.pop a:hover{border-color:var(--brand)}
.pop img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.pop span{display:block;padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pop small{display:block;color:var(--muted);font-weight:600;font-size:12px}
.ochips{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px}
.ochips a{padding:7px 13px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:700;white-space:nowrap}
.ochips a:hover{border-color:var(--brand)}
.ochips a.on{background:var(--brand);border-color:var(--brand);color:#fff}
.ochips a em{font-style:normal;opacity:.7;margin-left:5px}
.acc-none{padding:18px 4px}
.avpop{max-width:620px}
.avpop>p{color:var(--muted);font-size:14px;margin-bottom:0}
.avnow{display:flex;align-items:center;gap:14px;margin:14px 0}
.avnow .avatar{width:64px;height:64px;font-size:24px}
.avnow-t{display:block;font-weight:700}
.avrand{background:none;border:0;padding:0;font:inherit;font-size:13px;font-weight:700;color:var(--brand);cursor:pointer}
.avgrid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:9px;max-height:300px;overflow:auto;padding:5px}
.avgrid label{display:block;border-radius:50%;cursor:pointer;position:relative}
.avgrid input{position:absolute;opacity:0;pointer-events:none}
.avgrid img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;display:block;outline:3px solid transparent;outline-offset:2px;transition:outline-color .12s}
.avgrid label:hover img{outline-color:var(--brand-soft)}
.avgrid input:checked+img{outline-color:var(--brand)}
.avgrid input:focus-visible+img{outline-color:var(--brand-d)}
.avbtns{display:flex;gap:10px;margin-top:16px;justify-content:flex-end}
@media (max-width:1180px){.acc-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1000px){.dgrid{grid-template-columns:minmax(0,1fr)}.pop{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:760px){
  .acc-stats .st{padding:10px 12px;gap:10px}.acc-stats .st .ic{width:36px;height:36px}.acc-stats .st b{font-size:18px}.acc-stats .st .go{display:none}
  .acc-cta{width:100%}.acc-cta .btn{width:100%;padding:11px 16px}
  .qa a{font-size:12.5px}.qa a.req{grid-column:1/-1;flex-direction:row;padding:12px}
  .pop{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:40%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}
  .pop a{scroll-snap-align:start}
  .todo{flex-wrap:wrap}.todo .btn{width:100%;margin:0}
  .dash-hero .avatar{width:56px;height:56px}
  .avgrid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .btn-login{padding:8px 10px;gap:5px;font-size:13.5px}.btn-login svg{width:16px;height:16px}
}
@media (hover:none),(max-width:760px){.acr{flex-wrap:wrap;row-gap:2px}.acr .act,.acr.a-no .act{max-width:none;opacity:1;width:100%;padding-left:42px}}

/* Animated header logo (partials/logo-anim): plays once per visit, final logo when motion is reduced (1.1.113) */
.gbl{--lr:#e30834;--ln:#3f456e;--lg:#193b13;position:relative;display:block;height:42px;aspect-ratio:2441/393}
body.head-dark .gbl,html.dark .gbl{--lr:#ff4766;--ln:#d5d9f7;--lg:#5cc46e}
.gbl svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.gbl .gl{position:absolute;display:block;-webkit-mask-image:url(/images/logo-anim.png);mask-image:url(/images/logo-anim.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.gbl .c-red{background:var(--lr)}.gbl .c-navy{background:var(--ln)}.gbl .c-green{background:var(--lg)}
.gbl .ring{fill:none;stroke:var(--lg);stroke-width:13;stroke-dasharray:1;stroke-dashoffset:0}
.gbl .mapline{fill:none;stroke:var(--lg);stroke-width:7;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;opacity:0}
/* Logo styles (Settings > Appearance > Logo colours): classic uses the colours above. */
.gbl .tg{background:var(--lt,var(--ln))}.gbl .mapfill{background:var(--lm,var(--lg))}
.gbl .ring{stroke:var(--lk,var(--lg))}.gbl .mapline{stroke:var(--lo,var(--lm,var(--lg)))}
.gbl .disc{fill:none;transform-box:fill-box;transform-origin:center}.gbl .s1{stop-color:var(--s1,#000)}.gbl .s2{stop-color:var(--s2,#000)}
.gbl[data-ls=gradient]{--lr:linear-gradient(90deg,#ff2e63 25%,#a23cff 55%,#3d5afe 95%);--ln:var(--lr);--lt:#64748b;--lm:linear-gradient(160deg,#ff2e63 10%,#7a4dff 90%);--lo:#a23cff;--s1:#ff2e63;--s2:#7a4dff}
body.head-dark .gbl[data-ls=gradient],html.dark .gbl[data-ls=gradient]{--lr:linear-gradient(90deg,#ff5c86 25%,#b86bff 55%,#6b84ff 95%);--ln:var(--lr);--lt:#94a3b8;--lm:linear-gradient(160deg,#ff5c86 10%,#8f6bff 90%);--lo:#b86bff;--s1:#ff5c86;--s2:#8f6bff}
.gbl[data-ls=gradient] .ring{stroke:url(#gblr)}
.gbl[data-ls=neon]{--lr:#0f172a;--ln:#00a693;--lt:#64748b;--lg:#00a693}
body.head-dark .gbl[data-ls=neon],html.dark .gbl[data-ls=neon]{--lr:#fff;--ln:#2cf2d4;--lt:#8aa0b6;--lg:#2cf2d4}
body.head-dark .gbl[data-ls=neon] :is(.ring,.mapfill),html.dark .gbl[data-ls=neon] :is(.ring,.mapfill){filter:drop-shadow(0 0 10px rgba(44,242,212,.75))}
body.head-dark .gbl[data-ls=neon] .c-navy:not(.tg),html.dark .gbl[data-ls=neon] .c-navy:not(.tg){filter:drop-shadow(0 0 6px rgba(44,242,212,.55))}
.gbl[data-ls=violet]{--lr:linear-gradient(90deg,#7c3aed 25%,#2563eb 52%);--ln:#0f172a;--lt:#64748b;--lm:#fff;--lo:#fff;--lk:none;--s1:#8b5cf6;--s2:#2563eb}
body.head-dark .gbl[data-ls=violet],html.dark .gbl[data-ls=violet]{--lr:linear-gradient(90deg,#a78bfa 25%,#60a5fa 52%);--ln:#f8fafc;--lt:#94a3b8;--s2:#3b82f6}
.gbl[data-ls=violet] .disc{fill:url(#gblr)}
.gbl[data-ls=mono]{--lr:#0b0b12;--ln:#0b0b12;--lg:#0b0b12;--lt:#3a3a46}
body.head-dark .gbl[data-ls=mono],html.dark .gbl[data-ls=mono]{--lr:#fff;--ln:#fff;--lg:#fff;--lt:rgba(255,255,255,.78)}
.gbl-play .gbl .disc{animation:gbl-disc .55s cubic-bezier(.34,1.45,.6,1) 1.2s both}
@keyframes gbl-disc{from{transform:scale(0);opacity:0}to{transform:none;opacity:1}}
.gbl-play .gbl .g{animation:gbl-g 1.05s cubic-bezier(.3,.85,.3,1) both}
.gbl-play .gbl .drop{animation:gbl-drop .6s cubic-bezier(.34,1.45,.6,1) both;animation-delay:calc(.6s + var(--i)*.055s)}
.gbl-play .gbl .ring{animation:gbl-draw 1s cubic-bezier(.65,0,.35,1) 1.25s both}
.gbl-play .gbl .mapline{animation:gbl-trace 1.5s cubic-bezier(.45,0,.25,1) 1.6s both}
.gbl-play .gbl .mapfill{animation:gbl-fill .7s cubic-bezier(.45,0,.2,1) 2.55s both}
.gbl-play .gbl .tg{animation:gbl-tg .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(3s + var(--i)*.04s)}
@keyframes gbl-g{from{transform:translateX(1250%);opacity:0}35%{opacity:1}to{transform:none;opacity:1}}
@keyframes gbl-drop{from{transform:translateY(-140%);opacity:0}45%{opacity:1}to{transform:none;opacity:1}}
@keyframes gbl-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes gbl-trace{0%{stroke-dashoffset:1;opacity:1}70%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes gbl-fill{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes gbl-tg{from{opacity:0;transform:translateY(35%)}to{opacity:1;transform:none}}
.logo:has(.gbl){overflow:hidden;padding:2px 3px 2px 0;margin:-2px 0}
@media (max-width:760px){.gbl{height:32px}}
@media (prefers-reduced-motion:reduce){.gbl *{animation:none!important}}

/* Cards per row chosen per section (1.1.115); a phone keeps 2 */
.pkd .pk.pk-c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pkd .pk.pk-c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pkd .pk.pk-c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@container (max-width:640px){.pkd .pk.pk-c4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (max-width:470px){.pkd .pk.pk-c3,.pkd .pk.pk-c4{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Package tag (e.g. "Hot Selling") never runs over the card or the INSTANT flag */
.pk .p .tag{max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;z-index:1}
.pkd-j .pk .p:has(.ins-t) .tag{position:static;align-self:center;margin:6px auto 2px;max-width:100%}
.pkd-g .pk .p:has(> .tag){padding-top:16px}

/* Reward points (1.1.117): dashboard tile and box, Reward points page, product summary line */
.pcoin,.pcoin-lg{display:inline-grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffd76a,#f2a623 60%,#c97d06);color:#fff;font-weight:900;flex:none}
.pcoin{width:20px;height:20px;font-size:11px}
.pcoin-lg{width:72px;height:72px;font-size:32px;border:4px solid #ffe7a6;box-shadow:0 6px 16px rgba(242,166,35,.3)}
.badge.b-pts{background:rgba(255,255,255,.2);color:#fff;gap:5px;font-weight:700}
.badge.b-pts span{color:#ffd76a}
.badge.b-pts:hover{background:rgba(255,255,255,.3)}
.acc-stats .st.pts{border:1.5px solid #f2a623;background:linear-gradient(135deg,var(--card) 40%,var(--warn-bg))}
.acc-stats .st.pts .ic{background:#f2a623;color:#fff}
.acc-stats .st.pts:hover{border-color:#d98d0b}
.dh a{float:right;font-size:13px;font-weight:700;color:var(--brand);margin-top:3px}
.ptsbox .pbig{display:flex;align-items:center;gap:16px;margin-top:14px}
.ptsbox .pbig>div{display:flex;flex-direction:column;min-width:0}
.ptsbox .pnum{font-size:34px;font-weight:800;line-height:1.05}
.ptsbox .pval{color:var(--muted);font-size:14px;margin-top:3px}
.pbar{height:10px;background:var(--brand-softer);border-radius:8px;overflow:hidden;margin:16px 0 6px}
.pbar i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--brand),#f2a623)}
.pnext{font-size:13.5px;color:var(--muted);margin:0}
.pnext b{color:var(--ink)}
.pbtns{display:flex;gap:10px;margin-top:14px}
.pbtns form,.pbtns>.btn{flex:1;min-width:0}
.pbtns .btn{width:100%;justify-content:center;white-space:nowrap}
.pmove{margin-top:16px}
.pmove .addrow{display:flex;gap:10px}
.pmove .inp{flex:1;min-width:0}
.pworth{margin:8px 0 0;font-size:14px}
.psoon{margin-top:12px;background:var(--warn-bg);color:var(--warn-ink);border-radius:12px;padding:9px 12px;font-size:13.5px}
.phow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.phow div{background:var(--brand-softer);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.phow b{font-size:14px}
.phow span{font-size:12.5px;color:var(--muted)}
.plist{display:grid;margin-top:8px}
.prow{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.prow:first-child{border-top:0}
.prow .ic{width:34px;height:34px;border-radius:10px;background:var(--brand-softer);color:var(--brand);display:grid;place-items:center;flex:none}
.prow .ic svg{width:17px;height:17px}
.prow .tx{display:flex;flex-direction:column;min-width:0;flex:1}
.prow .tx b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .tx small{font-size:12.5px;color:var(--muted)}
.prow .pn{font-weight:800;white-space:nowrap}
.prow .pn.up{color:var(--good-ink)}
.prow .pn.down{color:var(--bad-ink)}
.pempty{margin-top:10px}
.ptsline{display:flex;align-items:center;gap:8px;justify-content:center;margin:0 0 10px;padding:8px 10px;border-radius:10px;background:var(--warn-bg);color:var(--warn-ink);font-size:13.5px}
.ptsline[hidden]{display:none}
.ptsline b{color:var(--ink)}
.ptsm{display:block;font-size:11.5px;font-weight:700;color:var(--warn-ink);white-space:nowrap}
.ptsm[hidden]{display:none}
.sticky-buy .t .ptsm b{font-size:11.5px;font-weight:800;color:inherit}
html.dark .acc-stats .st.pts{background:linear-gradient(135deg,var(--card) 40%,rgba(245,165,36,.14))}
html.dark .psoon,html.dark .ptsline{background:rgba(245,165,36,.14);color:#fcc463}
@media (min-width:1181px){.acc-stats.five{grid-template-columns:repeat(5,minmax(0,1fr))}.acc-stats.five .st{padding:12px}.acc-stats.five .st .go{display:none}}
@media (max-width:1180px){.acc-stats.five .st.pts{grid-column:1/-1;order:-1}}
@media (max-width:760px){
  .phow{grid-template-columns:minmax(0,1fr)}
  .ptsbox .pnum{font-size:30px}.pcoin-lg{width:60px;height:60px;font-size:26px}
  .pbtns{flex-direction:column}
}
/* 1.1.118 dashboard A: greeting row, one summary card, one-line account rows, spending card */
.dhead{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.dhead .hi{flex:1;min-width:0}
.dhead h1{font-size:26px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dhead p{color:var(--muted);font-size:14.5px;margin-top:2px}
.dhead .acc-cta{flex-direction:row}
.dsum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 8px}
.dsum.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.dsum .ds{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:6px 22px;min-width:0;border-left:1px solid var(--line)}
.dsum .ds:first-child{border-left:0}
.dsum small{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13.5px;font-weight:700;white-space:nowrap}
.dsum small svg{width:16px;height:16px}
.dsum b{font-size:28px;font-weight:800;line-height:1.15;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dsum .more{font-size:13px;font-weight:700;color:var(--brand);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dsum .more.soft{color:var(--muted);font-weight:600}
.dsum .more.warn{color:var(--warn-ink)}
.dsum .pbar{display:block;width:100%;max-width:240px;height:7px;margin:4px 0 2px;background:var(--warn-bg)}
.dsum .pbar i{background:#f2a623}
.acc-main .qa{grid-template-columns:repeat(6,minmax(0,1fr))}
.secl.one .acr{padding:9px 12px}
.secl.one .acr .tx{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.secl.one .acr .tx b{flex:none}
.secl.one .acr .tx small{min-width:0;text-align:right}
.secl.one .acr .act{position:absolute;right:12px;top:50%;transform:translateY(-50%);max-width:none;background:var(--acr-bg);padding-left:12px;opacity:0;pointer-events:none}
.secl.one .acr:hover,.secl.one .acr:focus-visible{--acr-bg:var(--brand-softer)}
.secl.one .acr:hover .act,.secl.one .acr:focus-visible .act{opacity:1}
.secl.one .acr.a-no .tx small{display:none}
.secl.one .acr.a-no .act{position:static;transform:none;opacity:1;padding:0;background:none;pointer-events:auto}
.dgrid .spend{background:none;padding:0;margin-top:8px}
.dgrid .spend div{padding:11px 0}
html.dark .dsum .pbar{background:rgba(245,165,36,.16)}
@media (max-width:1180px){.dsum.four{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px}.dsum.four .ds{padding:14px 18px}.dsum.four .ds:nth-child(3){border-left:0}.dsum.four .ds:nth-child(n+3){border-top:1px solid var(--line)}.acc-main .qa{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){
  .dhead h1{font-size:21px}.dhead .acc-cta{width:100%}
  .dsum{grid-template-columns:repeat(2,minmax(0,1fr));padding:6px}.dsum .ds{padding:12px 14px}.dsum .ds:nth-child(3){border-left:0}.dsum .ds:nth-child(n+3){border-top:1px solid var(--line)}
  .dsum:not(.four) .ds:nth-child(3){grid-column:1/-1}
  .dsum b{font-size:23px}
  .secl.one .acr .act{display:none}.secl.one .acr.a-no .act{display:block}
}
/* 1.1.118 points tags B: small gold coin in a thin outline */
.ptag{display:inline-flex;align-items:center;gap:4px;padding:1px 8px 1px 2px;border:1.5px solid #f2a623;border-radius:999px;font-size:12px;font-weight:800;line-height:1.35;color:#a15c00;background:var(--card);white-space:nowrap;letter-spacing:0}
.ptag i{width:15px;height:15px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:9px;line-height:1;color:#fff;background:radial-gradient(circle at 35% 30%,#ffd76a,#f2a623 60%,#d98d0b);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.ptag.neg{border-color:#d92d20;color:#b42318}
.ptag.neg i{background:radial-gradient(circle at 35% 30%,#e4e7ec,#98a2b3);color:#fff}
.ptag .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html.dark .ptag{color:#fcc463;background:transparent}
html.dark .ptag.neg{border-color:#f97066;color:#fda29b}
.acc-orders .amt{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.total .tot-r{display:flex;align-items:center;gap:10px;min-width:0}
.total .tot-r .ptag{font-size:12.5px}
@media (hover:none),(max-width:760px){.secl.one .acr{flex-wrap:nowrap}.secl.one .acr .act{display:none}.secl.one .acr.a-no .act{display:block;width:auto;padding-left:0;position:static;transform:none;opacity:1}}
/* 1.1.118 bigger logo text: on phones the Log in button is a small person icon */
@media (max-width:760px){.btn-login{width:38px;height:38px;padding:0;justify-content:center;border-radius:11px}.btn-login span{display:none}.btn-login svg{width:19px;height:19px}}
/* 1.1.118 header: the bigger logo needs room, so the header steps down before anything runs off the right edge */
@media (min-width:761px) and (max-width:1480px){.search{min-width:120px}}
@media (min-width:761px) and (max-width:1400px){
  .search{display:none !important}.iconbtn{display:grid;margin-left:auto}
  .nav a.hb small{display:none}.nav a.hb{padding:4px 10px 4px 4px}.nav a.hb i{width:26px;height:26px}
}
@media (min-width:761px) and (max-width:1180px){
  .top .wrap{gap:12px}.nav{margin-left:4px;padding-left:10px}.nav a{padding:8px 8px}
  .acct-btn .nm,.acct-btn .chev{display:none !important}
  .gbl{height:36px}
}
@media (min-width:761px) and (max-width:1000px){.wallet-pill span{display:none}.nav a[href$="/page/help"],.nav>a:first-child{display:none}.gbl{height:32px}}
@media (min-width:761px) and (max-width:860px){.gbl{height:29px}.top .wrap{gap:8px}.nav a.hb{padding:3px 8px 3px 3px}}
/* 1.1.119 My orders: slim points tag on one line, left of the order number (phone: beside the status) */
.ptag.ptg{gap:3px;height:18px;padding:0 6px 0 2px;border-width:1px;font-size:11px;line-height:1;box-sizing:border-box}
.ptag.ptg i{width:12px;height:12px;font-size:7px}
.acc-orders .meta .num{display:flex;align-items:center;justify-content:flex-end;gap:7px;white-space:nowrap}
.acc-orders .pt-ph{display:none}
@media (max-width:760px){.acc-orders .st{white-space:nowrap}.acc-orders .st .ao-tag{white-space:normal}.acc-orders .pt-ph{display:inline-flex;vertical-align:middle;margin-left:6px}}

/* 1.1.121 cart: header icon (only while the cart has items), Buy now + cart button, "Added to cart" message, cart page */
.acct-btn,.acct,.wallet-pill{white-space:nowrap;flex:none}
.cartbtn{position:relative;width:40px;height:40px;border-radius:10px;background:var(--search-bg);display:grid;place-items:center;color:var(--head-ink);flex:none}
.cartbtn[hidden]{display:none}
.cartbtn svg{width:20px;height:20px}
.cartbtn:hover,.cartbtn.on{color:var(--brand)}
body.head-dark .cartbtn:hover,html.dark .cartbtn:hover,body.head-dark .cartbtn.on,html.dark .cartbtn.on{color:#fff;background:rgba(255,255,255,.16)}
.cartbtn .n{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#f97316;color:#fff;font-size:11.5px;font-weight:800;display:grid;place-items:center;border:2px solid var(--head-bg);line-height:1;box-sizing:border-box}
.cartbtn.bump .n{animation:gb-pop .35s cubic-bezier(.34,1.45,.6,1)}
.cartbtn.bump{box-shadow:0 0 0 3px rgba(249,115,22,.45);transition:box-shadow .6s}
.btn-cart{background:transparent;color:var(--brand);border:1.5px solid var(--brand)}
.btn-cart:hover:not(:disabled){background:var(--brand-softer)}
html.dark .btn-cart{color:#c4b5fd;border-color:#8b5cf6}
html.dark .btn-cart:hover:not(:disabled){background:rgba(139,92,246,.16)}
.btn-cart svg{width:19px;height:19px;flex:none}
.btn-cart.busy{opacity:.6;pointer-events:none}
/* Buy now 2/3, cart 1/3; mouse over the cart button: half and half, "Cart" opens up to "Add to cart" */
.buyrow{display:flex;gap:10px}
.buyrow .btn{flex:2 1 0;min-width:0;padding:0 10px;white-space:nowrap;gap:6px;transition:flex-grow .35s cubic-bezier(.3,.7,.3,1),background-color .2s,color .2s,transform .12s}
.buyrow .btn-cart{flex-grow:1}
.buyrow .btn-cart .c2{display:none}
.buyrow .btn-cart .grow{display:inline-block;overflow:hidden;max-width:0;opacity:0;vertical-align:bottom;transition:max-width .35s cubic-bezier(.3,.7,.3,1),opacity .25s}
@media (hover:hover){
  .buyrow .btn-cart:hover,.buyrow .btn-cart:focus-visible{flex-grow:2}
  .buyrow .btn-cart:is(:hover,:focus-visible) .grow{max-width:80px;opacity:1}
  .buyrow .btn-cart:is(:hover,:focus-visible) .c1{display:none}
  .buyrow .btn-cart:is(:hover,:focus-visible) .c2{display:inline}
}
@media (prefers-reduced-motion:reduce){.buyrow .btn,.buyrow .btn-cart .grow{transition:none}}
.sticky-buy.sb-cart .btn{flex:2 1 0;min-width:0;white-space:nowrap;gap:6px;padding:0 12px}
.sticky-buy.sb-cart .btn-cart{flex-grow:1}
.sticky-buy.sb-cart .btn-main small{font-size:15px;font-weight:700;opacity:.85}
/* "Added to cart" message (store.js) */
.cart-toast{position:fixed;left:50%;top:88px;z-index:90;display:flex;align-items:center;gap:12px;background:#111827;color:#fff;border-radius:14px;padding:10px 10px 10px 14px;box-shadow:0 14px 40px rgba(0,0,0,.28);font-size:14.5px;max-width:calc(100vw - 24px);transform:translate(-50%,-12px);opacity:0;transition:opacity .25s,transform .25s}
.cart-toast.show{opacity:1;transform:translate(-50%,0)}
.cart-toast .ok{width:26px;height:26px;border-radius:50%;background:#16a34a;display:grid;place-items:center;flex:none}
.cart-toast img{width:38px;height:38px;border-radius:8px;object-fit:cover;flex:none}
.cart-toast .tx{min-width:0}
.cart-toast .tx b{display:block}
.cart-toast small{display:block;color:#9ca3af;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.cart-toast a{background:#fff;color:#111827;font-weight:800;border-radius:10px;padding:9px 14px;font-size:13.5px;white-space:nowrap;flex:none}
.cart-toast.bad{background:#7f1d1d}
html.dark .cart-toast{background:#f8fafc;color:#0f172a}html.dark .cart-toast small{color:#475569}html.dark .cart-toast a{background:var(--brand);color:#fff}
/* Cart page */
.cartpage{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start;margin-bottom:40px}
.cartpage h1{grid-column:1/-1;margin:0;font-size:30px}
.cartpage h1 span{color:var(--muted);font-weight:600;font-size:18px}
.cartlist{padding:18px 22px}
.crow{display:grid;grid-template-columns:84px minmax(0,1fr) auto auto 36px;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.crow:last-child{border-bottom:0}.crow:first-child{padding-top:4px}
.crow>a img{width:84px;height:84px;border-radius:12px;object-fit:cover;display:block}
.crow .tx b{font-size:16.5px;display:block}
.crow .tx b a:hover{color:var(--brand)}
.crow .meta{color:var(--muted);font-size:13.5px;margin-top:3px;line-height:1.5}
.crow .meta em{font-style:normal;color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.crow .badge{margin-top:6px}
.crow .oos{display:block;color:var(--bad-ink,#b42318);font-weight:700;font-size:13px;margin-top:6px}
.crow .edit summary{display:inline;font-size:13px;font-weight:700;color:var(--brand);cursor:pointer;margin-left:6px;list-style:none}
.crow .edit summary::-webkit-details-marker{display:none}
.crow .edit[open] summary{display:none}
.crow .edit form{display:grid;gap:8px;margin-top:10px;max-width:360px}
.crow .edit label{font-size:12.5px;font-weight:700;color:var(--ink)}
.crow .edit .inp{height:40px}
.crow .edit .row{display:flex;gap:8px}
.stp{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;height:38px}
.stp form{display:contents}
.stp button{width:34px;height:100%;border:0;background:none;font:inherit;font-size:18px;font-weight:700;color:var(--muted);cursor:pointer}
.stp button:hover:not(:disabled){color:var(--brand)}
.stp button:disabled{opacity:.35;cursor:default}
.stp i{font-style:normal;min-width:26px;text-align:center;font-weight:800}
.crow .pr{font-weight:800;font-size:17px;white-space:nowrap;text-align:right;min-width:92px}
.crow .pr small{display:block;font-weight:600;color:var(--muted);font-size:12px}
.crow .rm{width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer}
.crow .rm:hover{background:var(--brand-softer);color:#dc2626}
.crow .rm svg{width:17px;height:17px}
.cartsum{padding:22px;position:sticky;top:92px}
.cartsum h3{margin:0 0 10px}
.cartsum .row{display:flex;justify-content:space-between;padding:7px 0;color:var(--muted)}
.cartsum .row b{color:var(--ink)}
.cartsum .total{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--line);margin-top:8px;padding-top:14px}
.cartsum .total b{font-size:26px;color:var(--brand)}
html.dark .cartsum .total b{color:var(--ink)}
.cartsum .btn{margin-top:14px}
.cartsum .hint{text-align:center;margin:10px 0 0;color:var(--muted);font-size:13px}
.cartsum .cont{display:block;text-align:center;margin-top:12px;font-weight:700;color:var(--brand)}
.cartempty{text-align:center;padding:48px 20px;grid-column:1/-1}
.cartempty .ic{width:64px;height:64px;border-radius:18px;background:var(--brand-softer);color:var(--brand);display:grid;place-items:center;margin:0 auto 14px}
.cartempty .ic svg{width:30px;height:30px}
.cartempty p{color:var(--muted);margin:6px 0 18px}
.cartempty .btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
/* Your order on the review page lists every cart item */
.checkout .item+.item{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}
.checkout .kv-h{grid-column:1/-1;font-weight:800;margin-top:6px}
@media (max-width:760px){
  .cartbtn{width:38px;height:38px}
  .top:has(.cartbtn:not([hidden])) .acct{gap:7px}
  .top:has(.cartbtn:not([hidden])) .gbl{height:27px}
  .top:has(.cartbtn:not([hidden])) .logo img{height:28px}
  .cart-toast{top:auto;bottom:86px;transform:translate(-50%,12px);width:calc(100vw - 24px)}
  .cart-toast.show{transform:translate(-50%,0)}
  .cart-toast small{max-width:none}
  .cartpage{grid-template-columns:minmax(0,1fr);gap:14px}.cartpage h1{font-size:24px}
  .cartlist{padding:6px 16px}
  .crow{grid-template-columns:64px minmax(0,1fr) auto;grid-template-areas:"img txt rm" "img stp pr";gap:8px 12px;padding:14px 0}
  .crow>a{grid-area:img;align-self:start}.crow>a img{width:64px;height:64px}
  .crow .tx{grid-area:txt}.crow .stp{grid-area:stp;justify-self:start;height:34px}.crow .pr{grid-area:pr;font-size:16px;min-width:0}.crow>form{grid-area:rm;align-self:start;justify-self:end}
  .crow .tx b{font-size:15px}
  .cartsum{position:static}
}
.crow .edit{display:inline}.crow .edit[open]{display:block}
/* Customer tier badges (1.1.127) */
.tier{display:inline-flex;align-items:center;gap:4px;font-weight:700;font-size:11.5px;line-height:1.2;border-radius:99px;padding:2px 8px 2px 5px;white-space:nowrap;vertical-align:middle;border:0}
.tier .ti{width:13px;height:13px;flex:none}.tier .tdot{width:8px;height:8px;border-radius:50%;background:currentColor;display:inline-block;margin:0 2px}
.tier.big{font-size:13px;padding:4px 11px 4px 7px}.tier.big .ti{width:16px;height:16px}
.t-silver{background:linear-gradient(135deg,#f1f5f9,#dfe5ee);color:#475569;box-shadow:inset 0 0 0 1px #cbd5e1}
.t-gold{background:linear-gradient(135deg,#fff7d6,#fde68a);color:#854d0e;box-shadow:inset 0 0 0 1px #f5c84b}
.t-diamond{background:linear-gradient(135deg,#e0f2fe,#c7d2fe);color:#3730a3;box-shadow:inset 0 0 0 1px #a5b4fc}
.t-red{background:#fdecec;color:#b42318}.t-green{background:#e7f7ee;color:#127a3f}.t-blue{background:#e8f0ff;color:#1d4ed8}.t-purple{background:#f3e8ff;color:#6b21a8}
html.dark .t-silver{background:#1e293b;color:#cbd5e1;box-shadow:inset 0 0 0 1px #334155}
html.dark .t-gold{background:linear-gradient(135deg,#3b2f0a,#5c4710);color:#fde68a;box-shadow:inset 0 0 0 1px #8a6d1a}
html.dark .t-diamond{background:#1e1b4b;color:#c7d2fe;box-shadow:inset 0 0 0 1px #4338ca}
html.dark .t-red{background:#3b1414;color:#fca5a5}html.dark .t-green{background:#0f2e1c;color:#86efac}html.dark .t-blue{background:#172554;color:#93c5fd}html.dark .t-purple{background:#2e1065;color:#d8b4fe}
/* Tier prices: the strip above the packages, the tier name over the price, saving lines */
.tstrip{display:flex;align-items:center;gap:9px;border-radius:12px;padding:9px 13px;margin:0 0 12px;font-size:13.5px;background:linear-gradient(90deg,#fff8dc,#fffdf5);border:1px solid #f5d77a;color:#6b4a06}
.tstrip .ti{width:19px;height:19px;flex:none}.tstrip b{color:#4a3305}
.tstrip.t-st-silver{background:linear-gradient(90deg,#f1f5f9,#fafbfd);border-color:#cbd5e1;color:#334155}.tstrip.t-st-silver b{color:#1e293b}
.tstrip.t-st-diamond{background:linear-gradient(90deg,#eef2ff,#f8f9ff);border-color:#a5b4fc;color:#3730a3}.tstrip.t-st-diamond b{color:#312e81}
html.dark .tstrip{background:linear-gradient(90deg,#2a2107,#1a1606);border-color:#5c4710;color:#f5d77a}html.dark .tstrip b{color:#fde68a}
html.dark .tstrip.t-st-silver{background:#162032;border-color:#334155;color:#cbd5e1}html.dark .tstrip.t-st-silver b{color:#e2e8f0}
html.dark .tstrip.t-st-diamond{background:#1a1a3d;border-color:#4338ca;color:#c7d2fe}html.dark .tstrip.t-st-diamond b{color:#e0e7ff}
.pk .p .pr .tpx{display:block;font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#a16207;line-height:1.1}
html.dark .pk .p .pr .tpx{color:#fbbf24}
.pkd-a .pk .p:has(input:checked) .pr .tpx,.pkd-c .pk .p:has(input:checked) .pr .tpx,.pkd-f .pk .p:has(input:checked) .pr .tpx,.pkd-k .pk .p:has(input:checked) .pr .tpx,.pkd-d .pk .p:has(input:checked) .pr .tpx{color:#fde68a}
.pk .p .pr .tteas{display:block;font-size:11px;font-weight:700;color:#a16207;white-space:nowrap}
html.dark .pk .p .pr .tteas{color:#fbbf24}
.tsave{color:var(--good-ink,#127a3f);font-weight:700;font-size:12.5px}
html.dark .tsave{color:#4ade80}
.sum .row.tier-row b{color:var(--good-ink,#127a3f)}html.dark .sum .row.tier-row b{color:#4ade80}
.tiercard{border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:13px;margin:0 0 14px;background:linear-gradient(120deg,#fff7d6,#fde68a 60%,#f5c84b);color:#4a3305}
.tiercard .ti{width:40px;height:40px;flex:none}.tiercard b{font-size:17px;display:block}.tiercard small{font-size:12.5px;display:block;margin-top:2px}
.tiercard.t-st-silver{background:linear-gradient(120deg,#f8fafc,#e2e8f0 60%,#cbd5e1);color:#1e293b}
.tiercard.t-st-diamond{background:linear-gradient(120deg,#eef2ff,#c7d2fe 60%,#a5b4fc);color:#1e1b4b}
.tiercard.t-st-red,.tiercard.t-st-green,.tiercard.t-st-blue,.tiercard.t-st-purple{background:var(--brand-soft);color:var(--ink)}
html.dark .tiercard{background:linear-gradient(120deg,#2a2107,#3b2f0a 60%,#5c4710);color:#fde68a}
html.dark .tiercard.t-st-silver{background:linear-gradient(120deg,#162032,#1e293b);color:#e2e8f0}
html.dark .tiercard.t-st-diamond{background:linear-gradient(120deg,#1a1a3d,#1e1b4b);color:#e0e7ff}
.avtier{position:absolute;right:-5px;bottom:-4px;width:16px;height:16px;line-height:0}.avtier .ti{width:16px;height:16px}
.sticky-buy .sbsave{position:absolute;left:0;right:0;bottom:100%;text-align:center;background:var(--card);border-top:1px solid var(--line);padding:5px 12px;font-size:12px}
.sticky-buy .sbsave[hidden]{display:none}

/* 1.1.127 header account: menu opens on mouse over, click on the picture goes to the dashboard, a short hint once per visit; Log in at the right edge */
@media (min-width:761px){.acct{margin-left:auto}}
.dropdown.js-hov[open] .menu{animation:none}
.dropdown.js-hov .menu{opacity:0;transform:translateY(-10px) scale(.97);transform-origin:top right;transition:opacity .24s ease,transform .3s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.dropdown.js-hov.show .menu{opacity:1;transform:none;pointer-events:auto}
.dropdown.js-hov .menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.dropdown.js-hov .acct-btn{transition:border-color .15s,box-shadow .2s,background-color .15s}
.dropdown.js-hov.show .acct-btn{border-color:var(--brand);background:rgba(255,255,255,.06)}
.dropdown.js-hov .acct-btn .chev{transition:transform .25s}
.dropdown.js-hov.show .acct-btn .chev{transform:rotate(180deg)}
.dropdown .acct-btn.ping .avatar{animation:gb-ping 1.1s ease-out 2}
@keyframes gb-ping{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--brand) 70%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
@media (prefers-reduced-motion:reduce){.dropdown.js-hov .menu{transition:opacity .1s;transform:none}.dropdown .acct-btn.ping .avatar{animation:none}}
/* Log in: solid button at the right edge */
.login-chip{display:none}
/* Option C: a "Welcome, Log in or sign up" chip on computers; phones keep the small person button */
@media (min-width:761px){
  .top .acct .btn-login{display:none}
  .top .login-chip{display:inline-flex;align-items:center;gap:10px;padding:4px 16px 4px 4px;border-radius:999px;border:1px solid var(--head-line);background:transparent;color:var(--head-ink);text-decoration:none;transition:border-color .15s}
  body.head-dark .top .login-chip,html.dark .top .login-chip{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff}
  .login-chip i{width:36px;height:36px;border-radius:50%;background:var(--brand);display:grid;place-items:center}
  .login-chip i svg{width:18px;height:18px;color:#fff}
  .login-chip span{display:flex;flex-direction:column;line-height:1.15}
  .login-chip small{font-size:11.5px;color:var(--head-muted);font-weight:600}
  .login-chip b{font-size:14px}
  .top .login-chip:hover{border-color:var(--brand)}
}
.top .btn-login{background:var(--brand);border-color:var(--brand);color:#fff;border-radius:11px;padding:10px 18px;box-shadow:0 6px 18px color-mix(in srgb,var(--brand) 35%,transparent)}
.top .btn-login:hover{background:var(--brand-d);border-color:var(--brand-d);transform:translateY(-1px)}
body.head-dark .top .btn-login,html.dark .top .btn-login{border-color:var(--brand);color:#fff}
/* 1.1.129 dashboard tier card: only the tag on the front; mouse over or tap turns it over to the products with member prices */
.tierflip{perspective:900px;margin:0 0 14px;cursor:pointer;outline:none;border-radius:14px}
.tierflip:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 45%,transparent)}
.tierflip .tf-in{display:grid;grid-template-columns:minmax(0,1fr);transition:transform .5s cubic-bezier(.3,.7,.2,1);transform-style:preserve-3d}
.tierflip .tiercard{grid-area:1/1;margin:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.tierflip .tf-front{position:relative;padding-right:46px}
.tierflip .tf-back{transform:rotateY(180deg);display:block;padding:11px 16px 12px;pointer-events:none}
.tierflip.on .tf-in{transform:rotateY(180deg)}
.tierflip.on .tf-front{pointer-events:none}.tierflip.on .tf-back{pointer-events:auto}
/* 1.1.130: hover waits .4s before it flips, so passing the mouse over the card does not turn it */
@media (hover:hover) and (pointer:fine){.tierflip:hover .tf-in{transform:rotateY(180deg);transition-delay:.4s}.tierflip:hover .tf-front{pointer-events:none}.tierflip:hover .tf-back{pointer-events:auto}}
.tf-turn{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.55);display:grid;place-items:center;opacity:.75}
html.dark .tf-turn{background:rgba(255,255,255,.1)}
.tf-hd{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.tierflip .tf-hd .ti{width:18px;height:18px}.tierflip .tf-hd b{font-size:13.5px}.tierflip .tf-hd small{font-size:11.5px;opacity:.7;margin:0 0 0 auto}
.tf-list{min-width:0;font-size:12.5px;line-height:1.75;max-height:3.5em;overflow:hidden}
.tf-list.open{max-height:none}
.tf-list a{color:inherit;text-decoration:none;font-weight:600;white-space:nowrap;border-bottom:1px solid currentColor;border-bottom-color:color-mix(in srgb,currentColor 30%,transparent)}
.tf-list a:hover{border-bottom-color:currentColor}
.tf-list .tfi{white-space:nowrap}.tf-list .tfi:not(:last-child)::after{content:"\00b7";margin:0 3px 0 7px;opacity:.45}
.tf-more{background:none;border:0;padding:0;margin-top:3px;font:inherit;font-size:12px;font-weight:700;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer;opacity:.85}
@media (prefers-reduced-motion:reduce){.tierflip .tf-in{transition:none}}

/* 1.1.130 Manual payment page (pay/manual): wallet tabs, number and amount, TxnID box, checking popup */
.mpay{max-width:620px;padding-top:18px;padding-bottom:28px}
.mpay-card{padding:22px;border-radius:18px}
.mpay-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
.mpay-ttl h1{margin:0;font-size:24px;line-height:1.2;font-weight:800;letter-spacing:-.01em}
.mpay-ord{display:inline-block;margin-top:3px;font-size:13px;color:var(--muted);text-decoration:none}.mpay-ord:hover{color:var(--brand)}
.mpay-lang{display:inline-flex;flex:none;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--bg,var(--card))}
.mpay-lang a{font-size:12.5px;font-weight:700;color:var(--muted);text-decoration:none;padding:5px 11px;border-radius:999px;line-height:1}
.mpay-lang a.on{background:var(--brand);color:#fff}
.mpay-wl{display:flex;gap:8px;margin:0 0 14px}
.mpay-w{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:14px;font-weight:700;border:1.5px solid var(--line);border-radius:12px;padding:10px 6px;background:var(--card);color:var(--ink);cursor:pointer;transition:border-color .15s,background .15s}
.mpay-w img{width:22px;height:22px;border-radius:6px;object-fit:contain;flex:none}
.mpay-w:hover{border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
.mpay-w.on.mpay-bkash{border-color:#e2136e;background:color-mix(in srgb,#e2136e 7%,var(--card));color:#c40f5f}
.mpay-w.on.mpay-nagad{border-color:#ec6b1f;background:color-mix(in srgb,#ec6b1f 7%,var(--card));color:#c2560f}
.mpay-w.on.mpay-rocket{border-color:#8c3494;background:color-mix(in srgb,#8c3494 7%,var(--card));color:#7a2c82}
.mpay-pay{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mpay-f{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--card);min-width:0}
.mpay-l{display:block;font-size:12.5px;color:var(--muted);font-weight:600}
.mpay-v{display:flex;align-items:center;gap:8px;margin:4px 0 2px}
.mpay-v b{font-size:22px;font-weight:800;letter-spacing:.01em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mpay-f small{display:block;font-size:12px;color:var(--muted)}
.mpay-copy{margin-left:auto;flex:none;font:inherit;font-size:12px;font-weight:700;color:var(--brand);border:1px solid color-mix(in srgb,var(--brand) 30%,transparent);border-radius:8px;padding:5px 11px;background:var(--card);cursor:pointer}
.mpay-copy:hover{background:var(--brand-softer)}.mpay-copy.ok{color:#15803d;border-color:#86efac}
.mpay-how{margin-top:12px;background:var(--brand-softer);border-radius:14px;padding:12px 14px}
html.dark .mpay-how{background:color-mix(in srgb,var(--brand) 12%,var(--card))}
.mpay-how>b{font-size:13px}
.mpay-steps{list-style:none;margin:8px 0 0;padding:0;counter-reset:mps;display:grid;gap:7px}
.mpay-steps li{counter-increment:mps;display:flex;align-items:flex-start;gap:9px;font-size:13.5px;line-height:1.45}
.mpay-steps li::before{content:counter(mps);flex:none;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:11.5px;font-weight:800;display:grid;place-items:center;margin-top:1px}
.mpay-added{margin-top:12px;border:1px solid var(--line);border-radius:14px;padding:4px 14px;font-size:13.5px}
.mpay-added div{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}.mpay-added div:last-child{border-bottom:0}
.mpay-added div>span{flex:1;min-width:0}.mpay-added em{font-style:normal;font-size:11.5px;font-weight:700;color:#92400e;background:#fef3c7;border-radius:999px;padding:2px 8px}
.mpay-added .left b{color:#b45309}
.mpay-form{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:8px}
.mpay-form h2{margin:0 0 2px;font-size:16px;font-weight:800}
.mpay-lab{font-size:13px;font-weight:700;color:var(--ink);margin-top:2px}
.mpay-txn{text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:17px;letter-spacing:.06em}
.mpay-txn::placeholder{letter-spacing:.06em;opacity:.45}
.mpay-src{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:6px}
.mpay-src label{min-width:0}.mpay-src input{position:absolute;opacity:0;pointer-events:none}
.mpay-src span{display:block;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;font-weight:700;border:1.5px solid var(--line);border-radius:10px;padding:9px 4px;cursor:pointer;color:var(--muted)}
.mpay-src input:checked+span{border-color:var(--brand);color:var(--brand);background:var(--brand-softer)}
html.dark .mpay-src input:checked+span{background:color-mix(in srgb,var(--brand) 14%,var(--card))}
.mpay-src input:focus-visible+span{box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 35%,transparent)}
.mpay-form .btn{margin-top:6px}
.mpay-alt{text-align:center;margin:14px 0 0;font-size:13px}.mpay-alt a{color:var(--muted)}
.mpay-go{margin-top:14px}
.mpay.is-bn .mpay-l,.mpay.is-bn .mpay-f small,.mpay.is-bn .mpay-how>b{font-size:13.5px}
@media (max-width:560px){.mpay{padding-top:10px}.mpay-card{padding:16px;border-radius:16px}.mpay-ttl h1{font-size:21px}.mpay-pay{grid-template-columns:1fr}.mpay-v b{font-size:21px}
  .mpay-w{font-size:13px;padding:9px 4px;gap:6px}.mpay-w img{width:20px;height:20px}.mpay-src span{font-size:12px}}
.mpay-msg{border-radius:10px;padding:10px 12px;font-size:13.5px;margin:0 0 10px;background:var(--brand-softer)}
.mpay-msg.wait{background:#fffbeb;color:#78350f}.mpay-msg.bad{background:#fef2f2;color:#991b1b}.mpay-msg.info{background:#eff6ff;color:#1e3a8a}.mpay-msg.ok{background:#ecfdf5;color:#065f46}
html.dark .mpay-msg.wait{background:#3a2a0b;color:#fde68a}html.dark .mpay-msg.bad{background:#3b1111;color:#fecaca}html.dark .mpay-msg.info{background:#10203f;color:#bfdbfe}html.dark .mpay-msg.ok{background:#0b2e22;color:#a7f3d0}
.mpay-pop .npop-box{text-align:center}.mpay-pop b{display:block;font-size:17px;margin:12px 0 6px}.mpay-pop p{margin:0 0 10px;color:var(--muted);font-size:13.5px}
.mpay-pop .btn{margin-top:12px}
.mpay-help{margin-top:12px;padding:12px;border:1px solid #e4dcfb;background:#f5f3ff;border-radius:14px;text-align:left}.mpay-pop .mpay-help b{font-size:13.5px;color:var(--ink);margin:0 0 8px;padding:0}
.mpay-help-b{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mpay-hb{display:flex;align-items:center;justify-content:center;gap:7px;border-radius:12px;padding:11px 6px;font-weight:800;font-size:14px;text-decoration:none;border:2px solid transparent}.mpay-hb[hidden]{display:none}
.mpay-hb.case{background:#fff;border-color:#e4e1f3;color:var(--brand)}.mpay-hb.wa{background:#16a34a;color:#fff}.mpay-hb:hover{filter:brightness(.97)}
.mpay-spin{width:44px;height:44px;border-radius:50%;border:4px solid var(--brand-soft);border-top-color:var(--brand);margin:4px auto 0;animation:mpspin .8s linear infinite}
@keyframes mpspin{to{transform:rotate(360deg)}}
.mpay-ic{width:48px;height:48px;border-radius:50%;margin:4px auto 0;display:grid;place-items:center;font-size:24px;font-weight:900}
.mpay-ic.ok{background:#dcfce7;color:#166534}.mpay-ic.bad{background:#fee2e2;color:#991b1b}.mpay-ic.wait{background:#fef3c7;color:#92400e}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace}
/* 1.1.145: "Email not accepted" box */
.ebox{display:flex;gap:12px;align-items:flex-start;margin:14px 0;background:var(--bad-bg);border:1px solid color-mix(in srgb,var(--bad-ink) 22%,transparent);border-left:4px solid var(--bad-ink);border-radius:12px;padding:12px 14px;text-align:left}
.ebox>i{flex:0 0 22px;height:22px;border-radius:50%;background:var(--bad-ink);color:#fff;font:700 13px/22px system-ui,sans-serif;text-align:center;font-style:normal;margin-top:1px}
.ebox b{display:block;color:var(--bad-ink);font-size:14.5px;line-height:1.35}
.ebox span{display:block;color:var(--ink);font-size:13.5px;line-height:1.45;margin-top:2px}
.chat-err.ebox{margin:8px 12px;border-radius:10px;padding:10px 12px}
.chat-err.ebox[hidden]{display:none}
/* 1.1.150 manual delivery time note (Checkout and payment pages) */
.mh-note{display:flex;gap:10px;align-items:flex-start;margin:10px 0 12px;background:#fff8e6;border:1px dashed #f0c060;border-radius:12px;padding:11px 13px;font-size:13.5px;line-height:1.5;color:#5c3b00;text-align:left}
.mh-note svg{color:#c27a00;flex:none;margin-top:1px}
.mh-note a{color:var(--brand);font-weight:700;text-decoration:underline;white-space:nowrap}
html.dark .mh-note{background:rgba(245,165,36,.12);border-color:rgba(245,165,36,.45);color:#f5d9a8}
html.dark .mh-note svg{color:#f5a524}
.checkout .mh-note+.item{border-top:1px solid var(--line);padding-top:12px}

/* 1.1.152 Bangla QR payment page */
.bqr .mpay-pay{grid-template-columns:1fr}
.bqr-amt{color:#e2136e}
html.dark .bqr-amt{color:#ff5ca8}
.bqr-qr{text-align:center;margin:14px 0}
.bqr-qr img{display:block;margin:0 auto;width:280px;max-width:100%;height:auto;border-radius:14px;border:1px solid var(--line);background:#fff}
.bqr .mpay-how+.btn{margin-top:14px}
@media (max-width:640px){.bqr-qr{margin:12px 0}.bqr-qr img{width:100%;max-width:300px}.bqr .btn-lg{min-height:52px}.bqr .mpay-v b{font-size:24px}}
.bqr-state{text-align:center;padding:6px 0}
.bqr-state h2{font-size:19px;margin:10px 0 4px}
.bqr-state p{color:var(--muted);margin-bottom:12px}
.bqr-state .mpay-ic{margin:4px auto 0}
.bqr-state form,.bqr-wa{margin-top:10px}
.bqr-rows{text-align:left;margin:6px 0 4px}
.bqr-rows div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.bqr-rows div:last-child{border-bottom:0}
.bqr-rows span{color:var(--muted)}
.bqr-wait{color:var(--warn-ink)}
.bqr-note{text-align:left;font-size:13px;margin-top:12px}
/* 1.1.156 Scan QR on the order page */
.sqr-btn{display:flex;align-items:center;gap:14px;width:100%;max-width:340px;margin:14px auto 2px;padding:12px 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);cursor:pointer;font:inherit;text-align:left}
.sqr-btn:hover,.sqr-btn:focus-visible{border-color:var(--brand)}
.sqr-ic{width:44px;height:44px;border-radius:10px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none}
.sqr-t b{display:block;font-size:16px}.sqr-t small{display:block;font-size:13px;color:var(--muted)}
.sqr-box{max-width:340px;text-align:center;padding:28px 24px 22px}
.sqr-box img{display:block;width:100%;max-width:260px;height:auto;margin:6px auto 0;border:1px solid var(--line);border-radius:12px;padding:8px;background:#fff}
.sqr-amt{margin-top:16px;font-size:32px;font-weight:800;letter-spacing:-.5px;color:var(--ink)}
.bqr-note a{font-weight:700;text-decoration:underline}