/* Excavator Hunters – Optik (Patch 4.6): Baustelle in der Dämmerung, Stahlrahmen mit Nieten, LED-Anzeigen, Stufen-Themen */
#hx{ --hx-sky1:#0a1322; --hx-sky2:#22304d; --hx-sky3:#c4632c; --hx-s1:#16223a; --hx-s2:#0d1626; --hx-s3:#070b13; --hx-beam:255,226,170; --hx-acc:#ffd23f; --hx-lamp:#ffe9b0; }
#hx.fs3{ --hx-sky1:#160b28; --hx-sky2:#3a1d4d; --hx-sky3:#d4652a; --hx-s1:#2a1a3e; --hx-s2:#170e26; --hx-s3:#0b0614; --hx-beam:255,214,160; }
#hx.fs4{ --hx-sky1:#01030a; --hx-sky2:#071430; --hx-sky3:#0f3a55; --hx-s1:#0a1a30; --hx-s2:#050d1c; --hx-s3:#02060e; --hx-beam:210,235,255; --hx-acc:#7dffc4; --hx-lamp:#e8f6ff; }
#hx.fs5{ --hx-sky1:#160500; --hx-sky2:#4a1600; --hx-sky3:#ff7a1a; --hx-s1:#3a1505; --hx-s2:#220b02; --hx-s3:#120500; --hx-beam:255,190,120; --hx-acc:#ffb84d; }

/* Bühne */
#hx .hx-game{ padding:16px 18px 16px; border-radius:6px; background:linear-gradient(180deg, var(--hx-sky1) 0%, var(--hx-sky2) 38%, var(--hx-sky3) 82%, var(--hx-sky3) 100%); box-shadow:0 14px 34px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.04); transition:background .8s; isolation:isolate; }
#hx .hx-game::after{ height:12px; background:repeating-linear-gradient(-45deg,#f2b705 0 14px,#111 14px 28px); box-shadow:0 -2px 0 rgba(0,0,0,.4); z-index:1; }
.hx-scene{ position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.hx-sil{ position:absolute; left:0; right:0; bottom:0; width:100%; height:70%; }
.hx-sil .s1{ fill:var(--hx-s1); } .hx-sil .s2{ fill:var(--hx-s2); } .hx-sil .s3{ fill:var(--hx-s3); }
.hx-sil .hx-scaf, .hx-sil .hx-lat, .hx-sil .hx-cab{ fill:none; stroke:var(--hx-s2); stroke-width:2.5; }
.hx-sil .s2 .hx-scaf{ stroke:var(--hx-s1); stroke-width:2; opacity:.9; }
.hx-sil .hx-lat{ stroke:var(--hx-s1); stroke-width:2; }
.hx-sil .hx-cab{ stroke:var(--hx-s1); }
.hx-sil .hx-hookp{ fill:none; stroke:var(--hx-s2); stroke-width:3; }
.hx-sil .hx-win rect{ fill:#ffcf6a; opacity:.55; animation:hxwinl 6s steps(1) infinite; } .hx-sil .hx-win rect:nth-child(2){ animation-delay:-2s; } .hx-sil .hx-win rect:nth-child(3){ animation-delay:-4s; }
@keyframes hxwinl{ 50%{ opacity:.12; } }
.hx-sil .hx-blink{ fill:#ff2a2a; filter:drop-shadow(0 0 6px #ff2a2a); animation:hxblink 1.6s steps(1) infinite; } .hx-sil .hx-blink.d2{ animation-delay:-.5s; } .hx-sil .hx-blink.d3{ animation-delay:-1.1s; }
@keyframes hxblink{ 50%{ opacity:.15; filter:none; } }
.hx-sil .hx-lamp{ fill:var(--hx-lamp); filter:drop-shadow(0 0 10px var(--hx-lamp)) drop-shadow(0 0 22px var(--hx-lamp)); }
.hx-sil .hx-crane{ transform-origin:207px 100px; animation:hxcrane 22s ease-in-out infinite alternate; }
@keyframes hxcrane{ to{ transform:translateX(-6px); } }
.hx-stars{ position:absolute; inset:0 0 40% 0; opacity:.25; transition:opacity .8s;
  background-image:radial-gradient(1px 1px at 12% 18%,#fff,transparent), radial-gradient(1px 1px at 28% 8%,#fff,transparent), radial-gradient(1.5px 1.5px at 44% 22%,#fff,transparent), radial-gradient(1px 1px at 61% 12%,#fff,transparent), radial-gradient(1px 1px at 77% 26%,#fff,transparent), radial-gradient(1.5px 1.5px at 89% 9%,#fff,transparent), radial-gradient(1px 1px at 6% 34%,#fff,transparent), radial-gradient(1px 1px at 53% 33%,#fff,transparent), radial-gradient(1px 1px at 36% 40%,#fff,transparent), radial-gradient(1px 1px at 70% 42%,#fff,transparent); }
.hx-moon{ position:absolute; right:9%; top:7%; width:46px; height:46px; border-radius:50%; background:radial-gradient(circle at 38% 38%,#fffbe8,#e6dcc0 60%,#bfb38f); box-shadow:0 0 30px rgba(255,248,220,.45); opacity:0; transition:opacity .8s; }
#hx.fs4 .hx-stars{ opacity:.95; } #hx.fs4 .hx-moon{ opacity:1; }
.hx-haze{ position:absolute; left:0; right:0; bottom:0; height:30%; background:linear-gradient(0deg, rgba(0,0,0,.55), transparent); }
.hx-sparks{ position:absolute; left:0; right:0; bottom:8%; height:50%; opacity:0; transition:opacity .8s; }
#hx.fs5 .hx-sparks{ opacity:1; }
.hx-sparks i{ position:absolute; bottom:0; width:3px; height:3px; border-radius:50%; background:#ffd27a; box-shadow:0 0 6px #ff9a2a, 0 0 12px #ff6a00; animation:hxspark 2s ease-out infinite; }
@keyframes hxspark{ 0%{ transform:translate(0,0); opacity:1; } 100%{ transform:translate(30px,-220px); opacity:0; } }
#hx .hx-sky i{ background:linear-gradient(180deg, rgba(var(--hx-beam),.26), rgba(var(--hx-beam),0)); width:190px; height:380px; filter:blur(8px); mix-blend-mode:screen; }
#hx.fs4 .hx-sky i{ background:linear-gradient(180deg, rgba(var(--hx-beam),.38), rgba(var(--hx-beam),0)); }

/* Logo */
#hx .hx-logo{ display:flex; align-items:center; gap:8px; text-shadow:none; }
.hx-logohook{ display:block; flex:none; width:34px; height:34px; color:#f2b705; filter:drop-shadow(0 2px 0 #000); } .hx-logohook svg{ width:100%; height:100%; display:block; }
#hx .hx-logo div>b, #hx .hx-logo div>span{ display:block; font-family:var(--cond); font-weight:700; line-height:.92; background:linear-gradient(180deg,#fff7d1 0%,#ffd23f 42%,#c98a00 58%,#ffe58a 100%); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:1.2px rgba(20,12,0,.85); filter:drop-shadow(0 3px 0 rgba(0,0,0,.65)); }
#hx .hx-logo div>b{ font-size:34px; letter-spacing:3px; } #hx .hx-logo div>span{ font-size:22px; letter-spacing:10.5px; background:linear-gradient(180deg,#ffd9b0 0%,#ff8a2a 45%,#b54d00 60%,#ffb36b 100%); -webkit-background-clip:text; background-clip:text; }

/* Freispiel-Leiste */
#hx .hx-fsbar{ gap:6px; } #hx .hx-fsbar[hidden]{ display:none !important; }
#hx .hx-fsbar>div{ background:#07090c; border:1px solid #2a2f37; border-radius:4px; box-shadow:inset 0 2px 8px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.04); padding:4px 12px; }
#hx .hx-fsbar small{ color:#8e9aab; font-size:10px; letter-spacing:1.5px; }
#hx .hx-fsbar b{ color:var(--hx-acc); text-shadow:0 0 10px color-mix(in srgb, var(--hx-acc) 60%, transparent); font-variant-numeric:tabular-nums; }
#hx .hx-mult3 b{ color:#ff9a3d; text-shadow:0 0 12px rgba(255,140,40,.7); }
#hx .hx-mult3[hidden]{ display:none; }
.hx-mult3.bump{ animation:hxbump .6s ease; }

/* Stahlrahmen */
#hx .hx-frame{ padding:12px; border-radius:6px; max-width:min(100%, 66vh); transition:max-width .7s cubic-bezier(.3,1.2,.4,1);
  background:linear-gradient(180deg,#f9c934 0%,#e8ad00 40%,#b98300 100%); box-shadow:inset 0 2px 0 rgba(255,255,255,.5), inset 0 -3px 0 rgba(0,0,0,.35), inset 2px 0 0 rgba(255,255,255,.18), inset -2px 0 0 rgba(0,0,0,.2), 0 0 0 3px #0c0c0c, 0 16px 34px rgba(0,0,0,.6); }
#hx .hx-frame::before{ content:''; position:absolute; left:18px; right:18px; top:3px; height:6px; border-radius:2px; background:repeating-linear-gradient(-45deg,#111 0 7px,transparent 7px 14px); opacity:.5; }
#hx .hx-frame::after{ content:''; position:absolute; left:18px; right:18px; bottom:3px; height:6px; border-radius:2px; background:repeating-linear-gradient(45deg,#111 0 7px,transparent 7px 14px); opacity:.5; }
#hx.six .hx-frame{ max-width:min(100%, 79vh); }
.hx-bolt{ position:absolute; width:9px; height:9px; border-radius:50%; background:radial-gradient(circle at 35% 35%,#fff6c9,#a87d00 72%,#5e4500); box-shadow:0 1px 1px rgba(0,0,0,.6); z-index:1; }
.hx-bolt.tl{ left:3px; top:3px; } .hx-bolt.tr{ right:3px; top:3px; } .hx-bolt.bl{ left:3px; bottom:3px; } .hx-bolt.br{ right:3px; bottom:3px; }
#hx .hx-reels{ grid-template-columns:repeat(var(--nr,5),1fr); gap:5px; background:#06080b; border-radius:3px; box-shadow:0 0 0 2px #1a1d22, inset 0 0 0 1px #000; }
#hx .hx-sticky{ inset:12px; grid-template-columns:repeat(var(--nr,5),1fr); gap:5px; }
#hx .hx-fx{ inset:12px; width:calc(100% - 24px); height:calc(100% - 24px); }
#hx .hx-reel{ border-radius:2px; background:linear-gradient(90deg,#10151c,#19212c 50%,#10151c); box-shadow:inset 0 14px 16px -8px rgba(0,0,0,.85), inset 0 -14px 16px -8px rgba(0,0,0,.85); }
#hx .hx-reel[data-r="5"], #hx .hx-sticky>div[data-r="5"]{ display:none; }
#hx.six .hx-reel[data-r="5"], #hx.six .hx-sticky>div[data-r="5"]{ display:block; }
#hx.six .hx-reel[data-r="5"]{ animation:hxreelin .8s cubic-bezier(.2,1.4,.4,1); }
@keyframes hxreelin{ from{ transform:translateX(60%) scaleX(.2); opacity:0; filter:brightness(2.5); } }
#hx .hx-cell{ padding:2px; }
#hx.fs4 .hx-reel[data-r="2"], #hx.fs5 .hx-reel[data-r="2"]{ box-shadow:inset 0 14px 16px -8px rgba(0,0,0,.85), inset 0 -14px 16px -8px rgba(0,0,0,.85), inset 0 0 0 2px rgba(255,154,61,.75), 0 0 16px rgba(255,140,40,.35); }
#hx.fsmode .hx-frame{ box-shadow:inset 0 2px 0 rgba(255,255,255,.5), inset 0 -3px 0 rgba(0,0,0,.35), 0 0 0 3px #0c0c0c, 0 0 34px color-mix(in srgb, var(--hx-acc) 55%, transparent), 0 16px 34px rgba(0,0,0,.6); }

/* Walze-3-Multi und Abrissbirne */
.hx-m3{ position:absolute; top:-18px; transform:translateX(-50%); z-index:6; min-width:86px; padding:2px 10px 4px; text-align:center; border-radius:5px; color:#ffcf80;
  background:linear-gradient(180deg,#3a414b,#1b2027); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 0 0 2px #0c0c0c, 0 6px 16px rgba(0,0,0,.6); transition:left .7s cubic-bezier(.3,1.2,.4,1); }
.hx-m3[hidden]{ display:none; }
.hx-m3 svg{ position:absolute; left:50%; top:-20px; width:22px; height:22px; transform:translateX(-50%); color:#9aa3ad; }
.hx-m3 small{ display:block; font-size:9px; letter-spacing:2px; color:#8e9aab; font-weight:700; }
.hx-m3 b{ display:block; font-family:var(--cond); font-size:26px; line-height:1; color:#ff9a3d; text-shadow:0 0 12px rgba(255,140,40,.8); font-variant-numeric:tabular-nums; }
.hx-m3.bump{ animation:hxm3 .55s cubic-bezier(.2,1.6,.4,1); }
@keyframes hxm3{ 30%{ transform:translateX(-50%) scale(1.45); box-shadow:0 0 0 2px #0c0c0c, 0 0 36px rgba(255,140,40,.95); } }
.hx-ball{ position:absolute; left:0; top:0; width:46px; height:46px; margin:-23px 0 0 -23px; border-radius:50%; z-index:7; pointer-events:none;
  background:radial-gradient(circle at 34% 30%,#d6dde4,#4a535e 52%,#0b0d10); box-shadow:0 8px 16px rgba(0,0,0,.6), 0 0 0 3px rgba(242,183,5,.7), 0 0 26px rgba(255,180,60,.5); }
.hx-ball::after{ content:''; position:absolute; inset:9px; border-radius:50%; border:3px dashed rgba(242,183,5,.85); }
.hx-cell.hxbirne{ animation:hxbirne .35s ease-in-out infinite alternate; }
@keyframes hxbirne{ to{ transform:rotate(-8deg) scale(1.08); filter:drop-shadow(0 0 12px #ffd23f); } }
.hx-cell.hxgone{ opacity:.25; animation:none; }
#hx .hx-reel.hxhit::after{ content:''; position:absolute; inset:0; z-index:3; pointer-events:none; animation:hxcrack .9s ease-out forwards;
  background:radial-gradient(circle at 50% 8%, rgba(255,236,190,.95), rgba(255,170,60,.35) 30%, transparent 62%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 400' preserveAspectRatio='none'%3E%3Cpath d='M50 0 L44 40 L58 70 L40 110 L55 150 M44 40 L20 60 L8 95 M58 70 L82 92 L95 130 M40 110 L22 140 M55 150 L70 190' stroke='%23fff' stroke-opacity='.7' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") center top/100% 100% no-repeat; }
@keyframes hxcrack{ 0%{ opacity:1; } 100%{ opacity:0; } }
#hx .hx-game.shake{ animation:hxshake .42s cubic-bezier(.36,.07,.19,.97); }
@keyframes hxshake{ 10%,90%{ transform:translate(-1px,1px); } 20%,80%{ transform:translate(3px,-2px); } 30%,50%,70%{ transform:translate(-5px,2px); } 40%,60%{ transform:translate(5px,-1px); } }
.hx-float{ position:absolute; transform:translate(-50%,-50%); z-index:8; pointer-events:none; font-family:var(--cond); font-weight:700; font-size:36px; color:#ffb84d; -webkit-text-stroke:1.5px #2a1200; text-shadow:0 0 18px rgba(255,140,40,.9); animation:hxfloat 1.15s ease-out forwards; }
@keyframes hxfloat{ 0%{ opacity:0; transform:translate(-50%,-30%) scale(.5); } 20%{ opacity:1; transform:translate(-50%,-50%) scale(1.25); } 100%{ opacity:0; transform:translate(-50%,-150%) scale(1); } }

/* Meldungen in Metallschrift */
#hx .hx-msg{ background:linear-gradient(180deg,#fffbe0 0%,#ffd23f 45%,#c98a00 56%,#ffe27a 100%); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:2px #1a1100; text-shadow:none; filter:drop-shadow(0 4px 0 #000) drop-shadow(0 0 18px rgba(255,190,40,.55)); z-index:8; }
#hx .hx-msg.hunt{ background:linear-gradient(180deg,#eafff5,#7dffc4 50%,#13a06c 58%,#b8ffe0); -webkit-background-clip:text; background-clip:text; filter:drop-shadow(0 4px 0 #000) drop-shadow(0 0 18px rgba(125,255,196,.5)); }
#hx .hx-msg.hit{ background:linear-gradient(180deg,#fff0e0,#ffb84d 45%,#d24a00 58%,#ffcf8a); -webkit-background-clip:text; background-clip:text; filter:drop-shadow(0 4px 0 #000) drop-shadow(0 0 22px rgba(255,120,30,.75)); }
#hx .hx-msg.oil{ background:linear-gradient(180deg,#fff2d6,#e8b24a 50%,#7a5200 60%,#ffd88a); -webkit-background-clip:text; background-clip:text; }

/* LED-Gewinnzeile und Bedienpult */
#hx .hx-winline{ margin:12px auto 10px; max-width:min(100%, 79vh); min-height:34px; padding:6px 12px; border-radius:4px; background:#07090c; color:#c9a85a; box-shadow:inset 0 2px 10px rgba(0,0,0,.85), 0 0 0 1px #262b33; font-family:var(--cond); letter-spacing:.6px; font-size:16px; }
#hx .hx-winline.won{ color:#fff1c7; } #hx .hx-winline b{ color:#ffcf3d; text-shadow:0 0 10px rgba(255,190,40,.6); }
#hx .hx-ctrl{ position:relative; padding:12px 14px 14px; border-radius:6px; background:linear-gradient(180deg,#262d36,#151a20); box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px #000, 0 8px 20px rgba(0,0,0,.4); }
#hx .hx-led{ background:#07090c; border-radius:4px; box-shadow:inset 0 2px 10px rgba(0,0,0,.85), 0 0 0 1px #262b33; padding:6px 12px; }
#hx .hx-bal b, #hx .hx-betbox b{ color:#ffcf3d; text-shadow:0 0 10px rgba(255,190,40,.55); font-variant-numeric:tabular-nums; }
#hx .hx-bal small, #hx .hx-betbox small{ color:#8e9aab; }
#hx .hx-btn{ background:linear-gradient(180deg,#323b47,#1e242c); color:#e9edf2; border:1px solid #0a0c0f; border-radius:4px; box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 2px 0 #06080a; }
#hx .hx-btn:hover{ background:linear-gradient(180deg,#3b4553,#242b34); }
#hx .hx-btn:active{ transform:translateY(1px); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
#hx .hx-btn.on{ background:linear-gradient(180deg,#ffe066,#f2b705); color:#1a1300; border-color:#7a5a00; }
#hx .hx-btn svg{ width:15px; height:15px; vertical-align:-2px; }
#hx .hx-btn.ic{ width:40px; padding:6px 0; } #hx .hx-btn.ic svg{ width:18px; height:18px; }
#hx .hx-btn.gold{ position:relative; overflow:hidden; background:linear-gradient(180deg,#ffe066,#f2b705 55%,#c88f00); color:#1a1300; border-color:#7a5a00; box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 2px 0 #5c4300, 0 0 16px rgba(242,183,5,.35); }
#hx .hx-btn.gold::after{ content:''; position:absolute; top:0; bottom:0; width:40%; left:-60%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent); animation:hxshine 3.2s ease-in-out infinite; }
@keyframes hxshine{ 60%,100%{ left:130%; } }
#hx .hx-spin{ position:relative; isolation:isolate; width:90px; height:90px; border:0; color:#141006; background:radial-gradient(circle at 36% 30%,#fff1a8,#ffcc1a 45%,#d99a00 75%,#9a6a00); box-shadow:0 6px 0 #6b4a00, 0 12px 22px rgba(0,0,0,.55), inset 0 -4px 8px rgba(0,0,0,.25); }
.hx-spinring{ position:absolute; inset:-7px; border-radius:50%; background:repeating-conic-gradient(#f2b705 0 15deg,#111 15deg 30deg); -webkit-mask:radial-gradient(circle, transparent 45px, #000 46px); mask:radial-gradient(circle, transparent 45px, #000 46px); z-index:-1; box-shadow:0 0 0 2px #000; }
#hx .hx-spin.busy .hx-spinring{ animation:hxrot 1.2s linear infinite; }
#hx .hx-spin svg{ position:relative; }

/* Kachel-Effekte */
#hx .hx-cell.hxw{ animation:hxwin2 .6s ease-in-out infinite alternate; }
@keyframes hxwin2{ to{ transform:scale(1.07); filter:drop-shadow(0 0 10px #ffd23f) brightness(1.2); } }
#hx .hx-cell.hxd{ opacity:.3; filter:grayscale(.7) brightness(.8); }

/* Overlays: Big Win, Stufen, Kaufmenü */
#hx .hx-big{ background:radial-gradient(ellipse at 50% 45%, rgba(20,16,8,.7), rgba(4,6,10,.92)); }
.hx-bigband{ position:absolute; left:-10%; right:-10%; top:50%; height:120px; transform:translateY(-60%) rotate(-4deg); background:repeating-linear-gradient(-45deg, rgba(242,183,5,.22) 0 26px, rgba(0,0,0,.22) 26px 52px); box-shadow:0 0 0 3px rgba(242,183,5,.35); z-index:1; pointer-events:none; }
#hx .hx-bigt{ background:linear-gradient(180deg,#fffbe0 0%,#ffd23f 44%,#c98a00 56%,#ffe27a 100%); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:2px #1a1100; text-shadow:none; filter:drop-shadow(0 5px 0 #000) drop-shadow(0 0 30px rgba(255,180,40,.6)); }
#hx .hx-bigt.sm{ font-size:clamp(26px,4.4vw,40px); }
#hx .hx-big.mega .hx-bigt{ background:linear-gradient(180deg,#fff0e0,#ffb84d 44%,#d24a00 56%,#ffcf8a); -webkit-background-clip:text; background-clip:text; }
#hx .hx-big.epic .hx-bigt{ background:linear-gradient(180deg,#ffe8fb,#ff6bd8 44%,#a1007e 56%,#ffb3ee); -webkit-background-clip:text; background-clip:text; }
#hx .hx-big.jack .hx-bigt{ background:linear-gradient(180deg,#eafff5,#7dffc4 44%,#0d8a5a 56%,#c4ffe6); -webkit-background-clip:text; background-clip:text; animation:hxwin2 .45s infinite alternate; }
#hx .hx-big.fs .hx-bigt{ background:linear-gradient(180deg,#f6ecff,#cfa8ff 44%,#6b2fb0 56%,#e7d2ff); -webkit-background-clip:text; background-clip:text; }
#hx .hx-big.t4 .hx-bigt{ background:linear-gradient(180deg,#eafff5,#7dffc4 44%,#0d8a5a 56%,#c4ffe6); -webkit-background-clip:text; background-clip:text; }
#hx .hx-big.t5 .hx-bigt{ background:linear-gradient(180deg,#fff0e0,#ffb84d 44%,#d24a00 56%,#ffcf8a); -webkit-background-clip:text; background-clip:text; }
#hx .hx-bigv{ color:#fff1c7; text-shadow:0 0 18px rgba(255,190,40,.55); font-variant-numeric:tabular-nums; }
#hx .hx-big i{ font-size:0; width:12px; height:12px; }
#hx .hx-big i.p0{ border-radius:50%; background:radial-gradient(circle at 35% 35%,#fff3b0,#e6a800 60%,#8a6000); box-shadow:0 0 8px rgba(255,200,60,.7); }
#hx .hx-big i.p1{ width:10px; height:10px; background:#b8c2cc; clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%); }
#hx .hx-big i.p2{ width:16px; height:6px; border-radius:2px; background:repeating-linear-gradient(-45deg,#f2b705 0 4px,#111 4px 8px); }
#hx .hx-big i.p3{ width:4px; height:14px; border-radius:2px; background:#fff3c4; box-shadow:0 0 10px #ffd23f; }
.hx-buy .hx-bigin{ width:min(94%, 760px); }
.hx-bcards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin:16px 0 14px; }
.hx-bcard{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:4px; text-align:left; padding:14px 14px 12px; border-radius:6px; cursor:pointer; color:#e9edf2; font:inherit;
  background:linear-gradient(180deg,#2b323c,#151a20); border:1px solid #0a0c0f; box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 2px var(--bc,#f2b705), 0 10px 24px rgba(0,0,0,.5); transition:transform .15s, box-shadow .15s; }
.hx-bcard:hover:not(:disabled), .hx-bcard:focus-visible{ transform:translateY(-3px); box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 2px var(--bc,#f2b705), 0 0 26px color-mix(in srgb, var(--bc,#f2b705) 60%, transparent); outline:none; }
.hx-bcard:disabled{ opacity:.45; cursor:not-allowed; }
.hx-bcard.tz{ --bc:#f2b705; } .hx-bcard.t4{ --bc:#7dffc4; } .hx-bcard.t5{ --bc:#ff8a2a; }
.hx-bcbadge{ font-size:10px; font-weight:700; letter-spacing:2px; padding:2px 8px; border-radius:3px; background:var(--bc); color:#0d0d0d; }
.hx-bcard b{ font-family:var(--cond); font-size:24px; letter-spacing:.5px; color:#fff; }
.hx-bcard ul{ list-style:none; padding:0; margin:2px 0 6px; font-size:13px; color:#c3ccd6; } .hx-bcard li{ padding:1px 0; } .hx-bcard li::before{ content:'▸ '; color:var(--bc); }
.hx-bcard em{ font-style:normal; font-size:12px; color:#8e9aab; margin-top:auto; } .hx-bcard strong{ font-family:var(--cond); font-size:26px; color:#ffcf3d; text-shadow:0 0 10px rgba(255,190,40,.5); font-variant-numeric:tabular-nums; }
.hx-bcard small{ color:#ff8a7a; font-size:12px; }
#hx .hx-roul>div{ border-radius:6px; background:linear-gradient(180deg,#2b323c,#151a20); border-color:#3a4250; }
#hx .hx-feats li::before{ color:var(--hx-acc); }
@media (max-width:620px){ #hx .hx-logo div>b{ font-size:26px; } #hx .hx-logo div>span{ font-size:17px; letter-spacing:8px; } .hx-logohook{ width:26px; height:26px; } #hx .hx-spin{ width:80px; height:80px; } .hx-spinring{ -webkit-mask:radial-gradient(circle, transparent 40px, #000 41px); mask:radial-gradient(circle, transparent 40px, #000 41px); } }
@media (prefers-reduced-motion:reduce){ #hx .hx-game.shake, .hx-sil .hx-crane, .hx-sparks i, #hx .hx-btn.gold::after{ animation:none !important; } }