.xh{--h-inner:#F5ECD6;--h-mid:#FFF6E3;--h-outer:#FFF6E3;position:relative;min-height:100vh;min-height:100svh;overflow:hidden;color:#1B1A17;
  background:radial-gradient(circle at 50% 52%,var(--h-inner) 0%,var(--h-mid) 50%,var(--h-outer) 100%)}
.xh-coins{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.xh-coin{position:absolute;bottom:-40px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2B632 45%,#E0A425);box-shadow:0 0 12px rgba(255,211,78,.35);pointer-events:none}
@keyframes xhRise{0%{transform:translateY(0) translateX(0) rotate(0);opacity:0}10%{opacity:var(--o)}90%{opacity:var(--o)}100%{transform:translateY(-112vh) translateX(30px) rotate(360deg);opacity:0}}
.xh-head{position:absolute;inset:0 0 auto;z-index:120;padding-top:env(safe-area-inset-top,0px)}
.xh-head .wrap{display:flex;align-items:center;justify-content:space-between;height:92px;gap:16px}
.xh-logo{display:flex;align-items:center;gap:10px;color:#1B1A17;text-decoration:none;font:800 1.35rem/1 var(--display);letter-spacing:-.02em}
.xh-logo img{width:34px;height:34px;display:block}
.xh-logo .lw{position:relative;display:block}
.xh-logo .hat{position:absolute;width:30px;left:9px;top:-15px;transform:rotate(14deg);filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.xmas-only{display:none!important}
html.xmas .xh-card.xmas-only{display:block!important}
html.xmas .xh-logo .hat{display:block!important}
html.xmas .xh-snow{display:block!important}
.xh-snow{position:absolute;inset:0;pointer-events:none;z-index:115;overflow:hidden}
.flake{position:absolute;top:-20px;border-radius:50%;background:#fff;box-shadow:0 0 6px rgba(255,255,255,.6);pointer-events:none;animation:flake var(--t) linear forwards}
@keyframes flake{0%{transform:translate(0,0);opacity:0}10%{opacity:var(--o)}100%{transform:translate(var(--sx),112vh);opacity:.1}}
.xh-xmas{position:absolute;left:50%;top:94px;transform:translateX(-50%);z-index:121;margin:0;align-items:center;gap:10px;white-space:nowrap;
  background:rgba(247,212,216,0.92);color:#1B1A17;font:600 .9rem var(--body);padding:9px 18px;border-radius:999px;box-shadow:0 10px 30px -10px rgba(215,38,61,.7)}
html.xmas .xh-xmas{display:flex!important}
html.xmas .lights{display:block!important}
.lights{position:absolute;left:0;right:0;top:78px;height:46px;z-index:119;pointer-events:none}
.lights svg{width:100%;height:100%;overflow:visible}
.lights .b{animation:twinkle 1.6s ease-in-out infinite;animation-delay:var(--dl)}
@keyframes twinkle{0%,100%{opacity:1;filter:drop-shadow(0 0 6px currentColor)}50%{opacity:.35;filter:none}}
html.xmas .xh-title{font-size:clamp(3.2rem,7.4vw,7.6rem)}
.xh-title .xs{display:block;font-size:.42em;letter-spacing:-.03em;margin-top:.25em;color:#1B1A17}
.xh-title .xs em{color:#8E0B1B}
.xh-nav{display:flex;gap:4px;padding:5px;border-radius:999px;background:rgba(27,26,23,0.088);border:1px solid rgba(27,26,23,0.22);
  box-shadow:0 8px 32px rgba(0,0,0,.12),inset 0 0 0 1px rgba(255,255,255,.08);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.xh-nav a{color:rgba(27,26,23,0.75);text-decoration:none;font:600 .88rem var(--body);padding:8px 16px;border-radius:999px;transition:background .3s,color .3s}
.xh-nav a:hover,.xh-nav a.on{background:var(--tag);color:var(--navy)}
.xh-cta{background:rgba(255,246,227,0.4);color:#1B1A17;text-decoration:none;font:700 .9rem var(--body);padding:12px 22px;border-radius:999px;transition:background .3s,transform .3s}
.xh-cta:hover{background:rgba(255,246,227,0.65);transform:translateY(-2px)}
.xh-body{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:stretch;min-height:100vh;min-height:100svh;padding-top:110px;padding-bottom:48px}
html.xmas .xh-body{padding-top:150px}
.xh-left,.xh-right{position:relative;z-index:100;display:flex;flex-direction:column}
.xh-left{gap:26px;max-width:470px}
.xh-right{align-items:flex-end;justify-content:space-between;text-align:right;width:330px;pointer-events:none}
html.xmas .xh-right{width:384px}
html.xmas .xh-centre{padding-left:0;padding-right:1vw}
html.xmas .xh-card{width:118px;padding:66px 8px 14px}
html.xmas .xh-card .art{width:78px;height:78px;margin-left:-39px;top:-30px}
.xh-title{font:800 clamp(3.6rem,8.4vw,8.6rem)/.86 var(--display);letter-spacing:-.05em;margin:0;white-space:nowrap}
.xh-title em{font-style:normal;color:#7A5310}
.xh-desc{color:#655534;font-size:1.12rem;line-height:1.6;margin:0;max-width:390px}
.xh-go{display:inline-flex;align-items:center;gap:22px;width:fit-content;background:rgba(255,246,227,0.45);color:#1B1A17;text-decoration:none;font:700 1rem var(--body);
  padding:6px 6px 6px 24px;border-radius:999px;transition:background .3s,transform .3s}
.xh-go:hover{background:rgba(255,246,227,0.7);transform:translateY(-3px)}
.xh-go i{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--tag);color:var(--navy);font:900 1.5rem/1 var(--body);font-style:normal;padding-bottom:2px}
.xh-badge{display:flex;align-items:center;gap:14px;margin-top:auto}
.xh-badge .ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:rgba(27,26,23,0.066);border:1px solid rgba(27,26,23,0.154)}
.xh-badge small{display:block;font:600 .7rem var(--body);letter-spacing:.12em;color:rgba(27,26,23,0.65)}
.xh-badge b{font:700 .95rem var(--body)}
.xh .stores{margin-top:0}
.xh-centre{position:absolute;inset:0;padding-left:4vw;z-index:50;display:grid;place-items:center;pointer-events:none;perspective:1300px;opacity:0;animation:xhIn 1.4s ease-out .25s forwards}
@keyframes xhIn{to{opacity:1}}
.xh-float{animation:xhBob 6s ease-in-out infinite;transform-style:preserve-3d}
@keyframes xhBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
.xp{position:relative;width:290px;height:590px;transform-style:preserve-3d;will-change:transform,filter}
.xp .lay{position:absolute;inset:0;border-radius:46px;background:#B9BED8}
.xp .face{position:absolute;inset:0;border-radius:46px;background:#E7E9F4;padding:11px;box-shadow:inset 0 0 0 2px #fff;transform:translateZ(7px)}
.xp .scr{position:relative;width:100%;height:100%;border-radius:36px;background:#FFF6E3;overflow:hidden;color:#1B1A17;font:400 14px/1.4 var(--body)}
.xp .notch{position:absolute;top:10px;left:50%;width:88px;height:25px;margin-left:-44px;border-radius:14px;background:#FFF6E3;z-index:6}
.xp .sbar{display:flex;justify-content:space-between;padding:13px 22px 0;font:700 12px var(--body)}
.xp .abar{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px;border-bottom:1px solid #E2D9C6}
.xp .abar b{display:flex;align-items:center;gap:7px;font:800 17px var(--display)}
.xp .abar img{width:22px;height:22px}
.xp .k{position:absolute;inset:84px 0 0;padding:16px;opacity:0;transform:translateY(14px);transition:opacity .45s,transform .45s}
.xp .k.on{opacity:1;transform:none}
.xp h4{font:800 20px/1.1 var(--display);margin:2px 0 12px;letter-spacing:-.02em}
.xp .box{background:#fff;border:2px solid #E2D9C6;border-radius:14px;padding:12px}
.xp .inp{border:2px solid #FFF6E3;border-radius:10px;padding:9px 10px;font:500 13px var(--body);min-height:40px;white-space:nowrap;overflow:hidden}
.xp .car{display:inline-block;width:2px;height:15px;background:#FFF6E3;vertical-align:-2px;animation:xpBlink 1s steps(1) infinite}
@keyframes xpBlink{50%{opacity:0}}
.xp .btn{margin-top:10px;background:#F2B632;border-radius:10px;padding:10px;text-align:center;font-weight:700;box-shadow:0 2px 0 #E0A425;transition:transform .15s,box-shadow .15s}
.xp .btn.press{transform:translateY(2px);box-shadow:0 0 0 #E0A425}
.xp .prod{display:grid;grid-template-columns:50px 1fr;gap:10px;align-items:center;margin-top:12px;opacity:0;transform:translateY(10px);transition:all .5s}
.xp .prod.on{opacity:1;transform:none}
.xp .pic{width:50px;height:50px;border-radius:12px;background:#FFF3C4;display:grid;place-items:center}
.xp .pic svg{width:30px;height:30px}
.xp .prod b{display:block;font:700 14px/1.2 var(--display)}
.xp .prod span{font:800 20px var(--display)}
.xp .item{background:#fff;border:2px solid #E2D9C6;border-radius:16px;padding:12px}
.xp .row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.xp .big{font:800 32px/1 var(--display);letter-spacing:-.03em}
.xp .pill{font-size:11px;font-weight:700;background:#FFF6E3;border:1px solid #E2D9C6;border-radius:999px;padding:3px 8px;white-space:nowrap}
.xp .chk{font-size:12px;color:#5E584A;display:flex;align-items:center;gap:6px}
.xp .dot{width:8px;height:8px;border-radius:50%;background:#FFFDF7;animation:xpPulse 1.6s infinite}
@keyframes xpPulse{0%{box-shadow:0 0 0 0 rgba(30,138,90,.5)}100%{box-shadow:0 0 0 8px rgba(30,138,90,0)}}
.xp .chart{display:block;width:100%;height:80px;margin:10px 0 4px}
.xp .chart path{stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 2s ease .2s}
.xp .k.on .chart path{stroke-dashoffset:0}
.xp .ign{margin-top:10px;display:grid;gap:6px}
.xp .ign div{font-size:12px;color:#5E584A;text-decoration:line-through;text-decoration-color:#C8322A;opacity:0;transform:translateX(-8px);transition:all .4s}
.xp .k.on .ign div{opacity:1;transform:none}
.xp .k.on .ign div:nth-child(2){transition-delay:.5s}.xp .k.on .ign div:nth-child(3){transition-delay:1s}
.xp .notif{position:absolute;left:10px;right:10px;top:-130px;z-index:5;background:rgba(255,255,255,.97);border-radius:18px;padding:12px;box-shadow:0 14px 30px -10px rgba(27,26,23,.45);display:grid;grid-template-columns:34px 1fr;gap:10px;transition:top .6s cubic-bezier(.2,1.3,.4,1)}
.xp .notif.on{top:40px}
.xp .notif .ic{width:34px;height:34px;border-radius:9px;background:#FFF6E3;display:grid;place-items:center}
.xp .notif b{font-size:13px}.xp .notif p{margin:0;font-size:12px}
.xp .cmp{margin-top:10px;background:#fff;border:2px solid #E2D9C6;border-radius:16px;padding:10px 12px}
.xp .cmp-h{display:flex;align-items:center;gap:8px;font-size:12px;color:#5E584A;margin-bottom:6px}
.xp .cmp-h .pro{background:#FFF6E3;color:#8E650B;font:800 9px/1 var(--display);letter-spacing:.08em;padding:4px 6px;border-radius:5px}
.xp .srow{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12.5px;padding:5px 6px;border-radius:8px;transition:background .35s,color .35s}
.xp .srow .sh{color:#5E584A;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xp .srow .sh small{color:#5E584A;margin-left:4px}
.xp .srow .sp{font:800 14px var(--display);min-width:46px;text-align:right}
.xp .srow .sp.wait{color:#373E62;font-weight:600}
.xp .srow.best{background:#E3F4EC}.xp .srow.best .sh,.xp .srow.best .sp{color:#3D6B55}
.xp .at{font-size:12px;color:#3D6B55;font-weight:700;margin-top:6px}
.xp .was{text-decoration:line-through;text-decoration-color:#C8322A;text-decoration-thickness:3px;color:#5E584A;font:700 18px var(--display)}
.xp .save{text-align:center;padding-top:40px}
.xp .save .yk{font:700 13px var(--body);letter-spacing:.14em;color:#5E584A}
.xp .save .amt{font:800 74px/1 var(--display);letter-spacing:-.05em;margin:8px 0;color:#1B1A17}
.xp .save .amt em{font-style:normal;color:#3D6B55}
.xp .save .hit{display:inline-block;background:#F2B632;border-radius:999px;padding:6px 12px;font:700 13px var(--body)}
.xp .k.on .amt{animation:xpPop .6s cubic-bezier(.2,1.5,.4,1)}
@keyframes xpPop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.xp.buzz{animation:xpBuzz .6s ease 2}
@keyframes xpBuzz{0%,100%{translate:0 0}20%{translate:-6px 0}40%{translate:6px 0}60%{translate:-4px 0}80%{translate:4px 0}}
.xh-burst{position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);margin:calc(var(--s)/-2);border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2B632 45%,#E0A425);
  display:grid;place-items:center;color:#1B1A17;font:800 calc(var(--s)*.45) var(--display);pointer-events:none;z-index:60;animation:xhBurst 1.4s cubic-bezier(.15,.7,.3,1) forwards}
@keyframes xhBurst{0%{transform:translate(0,0) scale(.2);opacity:0}15%{opacity:1}100%{transform:translate(var(--x),var(--y)) scale(1) rotate(var(--r));opacity:0}}
.xh-glow{position:absolute;width:62vmin;height:62vmin;border-radius:50%;background:radial-gradient(circle,rgba(255,211,78,.18),transparent 65%);pointer-events:none}
.xh-layer{position:absolute;inset:0;pointer-events:none;will-change:transform}
.xh-layer.bg{z-index:1}.xh-layer.fg{z-index:110}
.xh-obj{position:absolute;display:grid;place-items:center;will-change:transform;filter:drop-shadow(0 12px 18px rgba(0,0,0,.35))}
.xh-obj .disc{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#DADDF1,#F3EBD8 60%,#D8DBF3);border:1px solid rgba(27,26,23,0.154)}
.xh-obj .disc svg{width:52%;height:52%}
.xh-obj .gold{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2B632 45%,#E0A425);color:var(--navy);font:800 1.1em var(--display)}
.xh-obj .mini{background:var(--tag);color:var(--navy);font:800 1rem var(--display);padding:8px 14px 8px 22px;border-radius:8px;white-space:nowrap;clip-path:polygon(12px 0,100% 0,100% 100%,12px 100%,0 50%)}
.xh-obj .mini.ghost{background:#F5ECD6;color:#232D76}
.xh-cards{display:flex;gap:14px;pointer-events:auto}
.xh-card{position:relative;width:142px;padding:76px 14px 16px;border-radius:26px;text-align:center;cursor:pointer;color:#1B1A17;font:inherit;
  background:rgba(27,26,23,0.066);border:1px solid rgba(27,26,23,0.154);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background .4s,border-color .4s,transform .4s cubic-bezier(.175,.885,.32,1.275)}
.xh-card:hover{background:rgba(27,26,23,0.132);border-color:rgba(255,255,255,.4)}
.xh-card.on{border-color:var(--tag)}
.xh-card .art{position:absolute;left:50%;top:-38px;width:96px;height:96px;margin-left:-48px;border-radius:24px;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2B632 50%,#E0B030);box-shadow:0 20px 35px rgba(0,0,0,.45);transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.xh-card .art svg{width:54%;height:54%}
.xh-card:hover .art{transform:translateY(-14px) rotate(-10deg) scale(1.08)}
.xh-card b{display:block;font:700 .95rem var(--body)}
.xh-card span{display:block;font-size:.8rem;color:rgba(27,26,23,0.7);margin-top:2px}
.xh-arrows{display:flex;gap:10px;pointer-events:auto;margin-top:16px;justify-content:flex-end}
.xh-arrows button{width:40px;height:40px;border-radius:50%;cursor:pointer;color:#1B1A17;background:rgba(27,26,23,0.066);border:1px solid rgba(27,26,23,0.154);font-size:1rem;transition:background .3s}
.xh-arrows button:hover{background:rgba(27,26,23,0.154)}
.xh-pick{font:600 .8rem var(--body);letter-spacing:.12em;color:rgba(27,26,23,0.6);margin:0 0 46px}
.xh-side{font:800 clamp(2.8rem,5.2vw,5.4rem)/.88 var(--display);letter-spacing:-.045em;margin:0}
.xh-side em{font-style:normal;color:#7A5310}

/* ---------- Black Friday (html.bf, set by hero.js through November) ---------- */
html.bf body,html.bf footer{background:#FFF6E3}
html.bf .xh-body{padding-top:150px}
html.bf .xh-right{width:384px}
html.bf .xh-centre{padding-left:0;padding-right:1vw}
html.bf .xh-card{width:118px;padding:66px 8px 14px}
html.bf .xh-card .art{width:78px;height:78px;margin-left:-39px;top:-30px}
html.bf .xh-title{font-size:clamp(3.2rem,7.4vw,7.6rem)}
html.bf .xh-title .xs em{color:#FF3B4E}
html.bf .xh-obj .disc{background:radial-gradient(circle at 35% 30%,#FFFDF7,#FFF6E3 60%,#FFF6E3);border-color:rgba(255,211,78,.25)}
html.bf .xh-obj .mini.ghost,html.bf .amb .mini.ghost{background:#FFF6E3;color:#8E650B;box-shadow:inset 0 0 0 1px rgba(255,211,78,.4)}
.xh-card.bf-card .art{background:radial-gradient(circle at 35% 30%,#FFFDF7,#FFF6E3 70%);box-shadow:0 20px 35px rgba(0,0,0,.6),inset 0 0 0 2px rgba(255,211,78,.5)}
.xh-logo .bfdot{position:absolute;right:-9px;top:-9px;width:20px;height:20px;border-radius:50%;background:#F9D2D6;color:#1B1A17;font:800 11px/20px var(--display);text-align:center;transform:rotate(-12deg);box-shadow:0 2px 6px rgba(0,0,0,.45)}
.bf-tape{position:absolute;left:-2%;right:-2%;top:92px;z-index:119;overflow:hidden;background:#F2B632;color:#0B0B0F;transform:rotate(-1.2deg);
  box-shadow:0 12px 30px -10px rgba(0,0,0,.8);border-top:3px solid #FFF6E3;border-bottom:3px solid #FFF6E3;pointer-events:none}
.bf-tape div{display:flex;align-items:center;width:max-content;animation:bfTape 40s linear infinite}
.bf-tape span{font:800 .92rem/1 var(--display);letter-spacing:.08em;padding:9px 18px;white-space:nowrap}
.bf-tape i{font-style:normal;font-size:.8rem}
@keyframes bfTape{to{transform:translateX(-50%)}}
.sr-bf{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;margin:-1px}
.bftag{position:absolute;top:-40px;font:800 var(--fs) var(--display);color:#0B0B0F;background:#F2B632;padding:4px 10px 4px 16px;border-radius:5px;
  clip-path:polygon(9px 0,100% 0,100% 100%,9px 100%,0 50%);pointer-events:none;opacity:var(--o);animation:bfFall var(--t) linear forwards}
.bftag.r{background:#F9D2D6;color:#1B1A17}.bftag.w{background:#fff}
@keyframes bfFall{0%{transform:translate(0,0) rotate(var(--r0))}100%{transform:translate(var(--sx),112vh) rotate(var(--r1))}}
html.bf .dk{background:radial-gradient(ellipse at 50% 40%,#FFF6E3 0%,#FFF6E3 45%,#FFF6E3 100%)}
html.bf .dk.alt{background:radial-gradient(ellipse at 20% 30%,#F3D8DC 0%,#F1DADE 45%,#FFF6E3 100%)}
html.bf .brands{background:radial-gradient(ellipse at 50% 50%,#FFF6E3 0%,#FFF6E3 50%,#FFF6E3 100%)}
html.bf .brands .wrap::before{background:radial-gradient(ellipse at center,rgba(255,246,227,0.85) 30%,transparent 72%)}
html.bf .bflist{background:radial-gradient(ellipse at 50% 30%,#F2EFD9 0%,#EFEBDC 50%,#FFF6E3 100%)}
.drop.blk{background:#FFF6E3;color:#8E650B;box-shadow:0 14px 28px -12px rgba(0,0,0,.6),inset 0 0 0 2px rgba(255,211,78,.6)}
.drop.blk i{color:#8E650B}
.bf-foot{display:none}
html.bf .bf-foot{display:inline}
.bfcards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.bfc{position:relative;background:#fff;color:#0B0B0F;border-radius:18px;padding:24px 22px;display:flex;flex-direction:column;gap:12px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.bfc small{font:700 .72rem var(--body);letter-spacing:.14em;color:#5E584A}
.bfc .claim{margin:0;font:800 1.7rem/1.05 var(--display);letter-spacing:-.03em}
.bfc .claim s{text-decoration-color:#FF3B4E;text-decoration-thickness:3px}
.bfc dl{margin:0;display:grid;gap:6px;border-top:2px dashed #E2E3EC;padding-top:12px}
.bfc dl div{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.9rem}
.bfc dt{color:#5E584A}.bfc dd{margin:0;font:800 1.05rem var(--display)}
.bfc .verdict{margin-top:auto;align-self:flex-start;font:700 .82rem var(--body);padding:5px 11px;border-radius:999px;background:#FFFDF7;color:#1B1A17}
.bfc.meh .verdict{background:#E9EAF2;color:#0B0B0F}
.bfc.fake .verdict{background:#F9D2D6}
.bfc.fake::after{content:"NOT A DEAL";position:absolute;right:14px;top:18px;font:800 .7rem var(--display);letter-spacing:.12em;color:#FF3B4E;border:2px solid #F9D2D6;border-radius:6px;padding:3px 7px;transform:rotate(8deg)}
.bfc.gold{background:#F2B632;justify-content:center}
.bfc.gold small{color:#0B0B0F}
.bfc.gold b{font:800 2.6rem/1 var(--display);letter-spacing:-.04em}
.bfc.gold p{margin:0;font-weight:600}

@media (max-width:1000px){
  .xh-nav{display:none}
  .xh-xmas{position:relative;left:auto;top:auto;transform:none;margin:96px 16px 0;white-space:normal;font-size:.85rem;border-radius:16px}
  html.xmas .xh-body{padding-top:24px}
  html.xmas .xh-card{width:104px;padding:62px 8px 12px}
  html.xmas .xh-card .art{width:72px;height:72px;margin-left:-36px;top:-28px}
  html.xmas .xh-right{width:auto}
  html.xmas .xh-centre{padding-right:0}
  .bf-tape{top:84px}
  .bf-tape span{font-size:.8rem;padding:8px 14px}
  html.bf .xh-card{width:104px;padding:62px 8px 12px}
  html.bf .xh-card .art{width:72px;height:72px;margin-left:-36px;top:-28px}
  html.bf .xh-right{width:auto}
  html.bf .xh-centre{padding-right:0}
  .xh-body{flex-direction:column;align-items:stretch;padding-top:104px;padding-bottom:40px;gap:0}
  html.bf .xh-body{padding-top:146px}
  .xh-left{max-width:none;gap:18px}
  .xh-title{font-size:clamp(3.2rem,15vw,5rem)}
  .xh-centre{position:relative;inset:auto;height:540px;margin:6px 0 20px;padding-left:0}
  .xp{scale:.78}
  .xh-layer{scale:.5;opacity:.5}
  .xh-layer.fg{z-index:1}
  .xh-right{width:auto;align-items:center;text-align:center;pointer-events:auto}
  .xh-pick{margin:0 0 50px}
  .xh-side,.xh-badge{display:none}
  .xh-arrows{justify-content:center}
}
@media (max-width:900px){.bfcards{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.bfcards{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.xh-float,.xh-centre{animation:none;opacity:1}.lights .b{animation:none}.bf-tape div{animation:none}}