/* 22.com boost layer */
:root{--bx-ease-out:cubic-bezier(.23,1,.32,1);--bx-ease-drawer:cubic-bezier(.32,.72,0,1);--bx-ease-pop:cubic-bezier(.34,1.56,.64,1);--bx-gold:#e2bc57;--bx-gold2:#f6e3a1;--bx-ink:#07080d;--bx-panel:rgba(14,16,26,.92);--bx-line:rgba(226,188,87,.22)}

/* ---------- Lobby: aurora + card tilt/shine ---------- */
.bx-aura{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:0;transition:opacity .8s;mix-blend-mode:screen;overflow:hidden}
.bx-lobby .bx-aura{opacity:1}
.bx-aura i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(90px);opacity:.16}
.bx-aura i:nth-child(1){background:#e2bc57;left:-15vmax;top:-20vmax}
.bx-aura i:nth-child(2){background:#7c3aed;right:-20vmax;top:10vmax}
.bx-aura i:nth-child(3){background:#2563eb;left:20vmax;bottom:-30vmax;opacity:.12}

a[href^="/play/"][class*="aspect-"].bx-tilt{transform:perspective(800px) rotateX(var(--bx-rx,0)) rotateY(var(--bx-ry,0)) translateY(-4px) scale(1.02)!important;transition:transform .14s var(--bx-ease-out)!important;box-shadow:0 30px 60px -20px rgba(0,0,0,.9),0 0 40px -10px rgba(226,188,87,.55)!important;z-index:5}
a[href^="/play/"][class*="aspect-"]{transition:transform .3s var(--bx-ease-out),box-shadow .3s ease!important}
a[href^="/play/"][class*="aspect-"]::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:20;opacity:0;transition:opacity .2s ease;
  background:radial-gradient(circle at var(--bx-mx,50%) var(--bx-my,50%),rgba(255,240,200,.35),transparent 45%),linear-gradient(115deg,transparent 30%,rgba(255,255,255,.18) 45%,transparent 60%)}
a[href^="/play/"][class*="aspect-"].bx-tilt::after{opacity:1}
.bx-lobby h1{background:linear-gradient(100deg,#fff 0%,#f6e3a1 30%,#e2bc57 45%,#fff 55%,#f6e3a1 70%,#c99a3c 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@keyframes bx-sheen{to{background-position:-250% 0}}

/* ---------- FX ---------- */
.bx-fx{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:9998}
#root.bx-shake{animation:bx-shake .6s cubic-bezier(.36,.07,.19,.97)}
@keyframes bx-shake{10%,90%{transform:translate(calc(var(--bx-shake)*-.3),0)}20%,80%{transform:translate(calc(var(--bx-shake)*.6),calc(var(--bx-shake)*.2))}30%,50%,70%{transform:translate(calc(var(--bx-shake)*-1),calc(var(--bx-shake)*-.3))}40%,60%{transform:translate(var(--bx-shake),calc(var(--bx-shake)*.3))}}

.bx-bigwin{position:fixed;inset:0;z-index:9997;display:grid;place-items:center;background:radial-gradient(circle,rgba(0,0,0,.55),rgba(0,0,0,.85));cursor:pointer;animation:bx-in .3s ease-out}
.bx-bigwin-rays{position:absolute;width:160vmax;height:160vmax;background:repeating-conic-gradient(from 0deg,rgba(246,227,161,.13) 0deg 8deg,transparent 8deg 22deg);animation:bx-spin 18s linear infinite;mask:radial-gradient(circle,#000 10%,transparent 55%);-webkit-mask:radial-gradient(circle,#000 10%,transparent 55%)}
.bx-bigwin-card{position:relative;text-align:center;animation:bx-materialize .6s var(--bx-ease-pop)}
.bx-bigwin-label{font:800 clamp(40px,9vw,110px)/1 "Cormorant Garamond",serif;letter-spacing:.04em;background:linear-gradient(180deg,#fff8dc,#f6e3a1 35%,#e2bc57 60%,#8f5f17);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 6px 0 rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(226,188,87,.7));animation:bx-pulse 1.2s ease-in-out infinite}
.bx-bigwin-amount{margin-top:10px;font:700 clamp(32px,6vw,72px)/1 "JetBrains Mono",monospace;color:#fff;text-shadow:0 0 30px rgba(226,188,87,.9),0 4px 0 #000}
.bx-bigwin-mult{display:inline-block;margin-top:14px;padding:6px 16px;border-radius:999px;font:700 18px "JetBrains Mono",monospace;color:#1a1204;background:linear-gradient(180deg,#f6e3a1,#c99a3c);box-shadow:0 0 30px rgba(226,188,87,.6)}
.bx-bigwin-hint{margin-top:22px;font:600 11px Inter,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.bx-tier-super .bx-bigwin-label{background:linear-gradient(180deg,#fff,#a5f3fc 35%,#22d3ee 60%,#0e7490);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 6px 0 rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(34,211,238,.8))}
.bx-tier-mega .bx-bigwin-label{background:linear-gradient(180deg,#fff,#f5d0fe 35%,#d946ef 60%,#701a75);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 6px 0 rgba(0,0,0,.6)) drop-shadow(0 0 50px rgba(217,70,239,.85))}
.bx-tier-legend .bx-bigwin-label{background:linear-gradient(90deg,#f87171,#fbbf24,#4ade80,#60a5fa,#c084fc,#f87171);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;animation:bx-pulse 1.2s ease-in-out infinite,bx-sheen 3s linear infinite}
.bx-out{animation:bx-fade .18s var(--bx-ease-out) forwards!important;pointer-events:none}
@keyframes bx-in{from{opacity:0}}
@keyframes bx-fade{to{opacity:0;transform:scale(.98)}}
@keyframes bx-zoom{from{transform:scale(.85);opacity:.4}}
@keyframes bx-materialize{from{transform:scale(.6);opacity:0;filter:blur(8px)}}
@keyframes bx-modal-in{from{opacity:0;transform:translateY(8px) scale(.96)}}
@keyframes bx-pulse{50%{transform:scale(1.06)}}
@keyframes bx-spin{to{transform:rotate(360deg)}}

/* ---------- Toasts ---------- */
.bx-toasts{position:fixed;top:84px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.bx-toast{padding:12px 20px;border-radius:14px;font:500 14px Inter,sans-serif;color:#f8f4e6;background:var(--bx-panel);border:1px solid var(--bx-line);box-shadow:0 20px 40px -10px rgba(0,0,0,.8),0 0 30px -10px rgba(226,188,87,.5);backdrop-filter:blur(12px);animation:bx-drop .32s var(--bx-ease-out)}
.bx-toast b{color:var(--bx-gold2)}
.bx-toast-level{border-color:rgba(192,132,252,.5);box-shadow:0 0 40px -6px rgba(192,132,252,.7)}
.bx-toast-err{border-color:rgba(248,113,113,.5)}
@keyframes bx-drop{from{opacity:0;transform:translateY(-12px) scale(.98)}}
.bx-toast.bx-out{animation:bx-toast-out .2s var(--bx-ease-out) forwards!important}
@keyframes bx-toast-out{to{opacity:0;transform:translateY(-10px) scale(.98)}}

/* ---------- Dock ---------- */
.bx-dock{position:fixed;right:18px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:80;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 8px;border-radius:999px;background:var(--bx-panel);border:1px solid var(--bx-line);box-shadow:0 20px 50px -12px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(14px);font-family:Inter,sans-serif;transform:translateY(140%);opacity:0;transition:transform .45s var(--bx-ease-drawer),opacity .3s ease}
.bx-dock.bx-show{transform:none;opacity:1}
.bx-level{position:relative;width:46px;height:46px;border:0;padding:0;background:none;cursor:pointer;flex:none}
.bx-level svg{position:absolute;inset:0;transform:rotate(-90deg)}
.bx-level circle{fill:none;stroke-width:3}
.bx-ring-bg{stroke:rgba(255,255,255,.08)}
.bx-ring{stroke:var(--bx-gold);stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:97.4;transition:stroke-dashoffset .8s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 0 4px rgba(226,188,87,.8))}
.bx-lvl-num{position:absolute;inset:6px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(180deg,#f6e3a1,#b8862d);color:#1a1204;font:800 15px "JetBrains Mono",monospace;box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}
.bx-level.bx-pop{animation:bx-zoom .45s var(--bx-ease-pop)}
.bx-level-info{line-height:1.15;padding-right:4px;min-width:84px}
.bx-rank{font-size:12px;font-weight:700;color:var(--bx-gold2);letter-spacing:.04em}
.bx-xp{font:500 10.5px "JetBrains Mono",monospace;color:#94a3b8}
.bx-btn{position:relative;display:flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#e2e8f0;font:600 13px Inter,sans-serif;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .12s var(--bx-ease-out);white-space:nowrap}
.bx-btn:active{transform:scale(.97)}
.bx-btn:focus-visible,.bx-level:focus-visible{outline:2px solid var(--bx-gold);outline-offset:2px}
.bx-ico{font-size:16px}
.bx-dot{display:none;position:absolute;top:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:#f43f5e;box-shadow:0 0 0 2px var(--bx-ink),0 0 12px #f43f5e}
.bx-daily.bx-ready{background:linear-gradient(180deg,#f6e3a1,#c99a3c);color:#1a1204;border-color:transparent;box-shadow:0 0 22px -4px rgba(226,188,87,.7)}
.bx-daily.bx-ready .bx-dot{display:block}
.bx-daily.bx-ready .bx-ico{animation:bx-wiggle .9s var(--bx-ease-out) 1}
@keyframes bx-wiggle{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-14deg)}80%{transform:rotate(12deg)}90%{transform:rotate(-6deg)}}

/* ---------- Modals ---------- */
.bx-modal-wrap{position:fixed;inset:0;z-index:9995;display:grid;place-items:center;padding:16px;background:rgba(3,4,8,.7);backdrop-filter:blur(6px);animation:bx-in .2s ease-out}
.bx-modal{position:relative;width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:28px;border-radius:24px;background:linear-gradient(180deg,rgba(24,26,40,.98),rgba(10,11,18,.98));border:1px solid var(--bx-line);box-shadow:0 40px 80px -20px #000,0 0 80px -30px rgba(226,188,87,.5);color:#e2e8f0;font-family:Inter,sans-serif;animation:bx-modal-in .24s var(--bx-ease-out)}
.bx-modal h2{margin:0 0 6px;font:700 32px/1.1 "Cormorant Garamond",serif;letter-spacing:-.01em;color:var(--bx-gold2)}
.bx-close{position:absolute;top:14px;right:16px;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#cbd5e1;font-size:20px;line-height:1;cursor:pointer;transition:background .15s ease,transform .12s var(--bx-ease-out)}
.bx-close:active{transform:scale(.94)}
.bx-sub{color:#94a3b8;font-size:14px;line-height:1.5;margin:0 0 18px}
.bx-sub b{color:#f8f4e6}
.bx-loading,.bx-err{color:#94a3b8;padding:20px 0}
.bx-err{color:#fca5a5}

.bx-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:22px}
.bx-day{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 2px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);font-size:10px;color:#94a3b8;text-align:center}
.bx-day b{font:700 12px "JetBrains Mono",monospace;color:#e2e8f0}
.bx-day i{font-style:normal;font-size:18px}
.bx-coin{display:inline-block;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff4c2,#e2bc57 45%,#9a6b1c);box-shadow:inset 0 0 0 1.5px rgba(120,80,20,.5);vertical-align:middle}
.bx-done{opacity:.55;border-color:rgba(74,222,128,.3)}
.bx-done i{color:#4ade80}
.bx-today{border-color:var(--bx-gold);background:rgba(226,188,87,.12);box-shadow:0 0 24px -4px rgba(226,188,87,.6)}
.bx-jackpot{background:linear-gradient(180deg,rgba(192,132,252,.15),rgba(255,255,255,.02));border-color:rgba(192,132,252,.35)}
.bx-pop{animation:bx-zoom .45s var(--bx-ease-pop)}
.bx-claim{width:100%;height:54px;border:0;border-radius:16px;background:linear-gradient(180deg,#f6e3a1,#c99a3c);color:#1a1204;font:800 16px Inter,sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:0 10px 30px -8px rgba(226,188,87,.7),inset 0 -3px 0 rgba(0,0,0,.2);transition:transform .12s var(--bx-ease-out),filter .15s ease}
.bx-claim:active:not(:disabled){transform:scale(.98)}
.bx-claim:disabled{background:rgba(255,255,255,.06);color:#64748b;box-shadow:none;cursor:default}

.bx-tabs{display:flex;gap:6px;margin:10px 0 18px;padding:4px;border-radius:14px;background:rgba(255,255,255,.04)}
.bx-tabs button{flex:1;height:34px;border:0;border-radius:10px;background:none;color:#94a3b8;font:600 13px Inter,sans-serif;cursor:pointer;transition:background .15s ease,color .15s ease,transform .12s var(--bx-ease-out)}
.bx-tabs button:active{transform:scale(.97)}
.bx-tabs button.bx-on{background:rgba(226,188,87,.16);color:var(--bx-gold2)}
.bx-podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:10px;margin-bottom:16px}
.bx-pod{text-align:center;min-width:0}
.bx-crown{font-size:26px}
.bx-pod-1 .bx-crown{font-size:34px}
.bx-pod-name{font-weight:700;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-pod-val{font:600 11px "JetBrains Mono",monospace;color:var(--bx-gold2);margin:2px 0 6px}
.bx-pod-val small,.bx-val small{color:#64748b;font-size:10px}
.bx-pod-bar{display:grid;place-items:center;border-radius:12px 12px 4px 4px;font:800 22px "Cormorant Garamond",serif;color:#1a1204}
.bx-pod-1 .bx-pod-bar{height:96px;background:linear-gradient(180deg,#f6e3a1,#b8862d);box-shadow:0 0 30px -6px rgba(226,188,87,.7)}
.bx-pod-2 .bx-pod-bar{height:70px;background:linear-gradient(180deg,#f1f5f9,#94a3b8)}
.bx-pod-3 .bx-pod-bar{height:54px;background:linear-gradient(180deg,#fdba74,#b45309)}
.bx-me .bx-pod-name,li.bx-me .bx-name{color:var(--bx-gold2)}
.bx-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.bx-rows li{animation:bx-row .26s var(--bx-ease-out) both;display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.025);font-size:13px}
.bx-rows li.bx-me{background:rgba(226,188,87,.1);border:1px solid rgba(226,188,87,.3)}
.bx-pos{width:24px;font:700 12px "JetBrains Mono",monospace;color:#64748b}
.bx-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.bx-val{font:600 12px "JetBrains Mono",monospace;color:#e2e8f0;text-align:right}
.bx-foot{margin:14px 0 0;color:#64748b;font-size:12px;text-align:center}
.bx-foot b{color:var(--bx-gold2)}

@media (max-width:640px){
  .bx-dock{left:50%;right:auto;bottom:calc(76px + env(safe-area-inset-bottom));transform:translate(-50%,140%);gap:6px;padding:6px 8px 6px 6px}
  .bx-dock.bx-show{transform:translateX(-50%)}
  .bx-level-info{display:none}
  .bx-btn{padding:0 11px}
  .bx-days{grid-template-columns:repeat(4,1fr)}
  .bx-modal{padding:22px 16px}
}
@media (prefers-reduced-motion:reduce){.bx-aura i,.bx-bigwin-rays,.bx-bigwin-label,.bx-today,.bx-daily.bx-ready,.bx-daily.bx-ready .bx-ico,.bx-lobby h1{animation:none!important}}
html.reduce-motion .bx-aura i,html.reduce-motion .bx-bigwin-rays,html.reduce-motion .bx-lobby h1{animation:none!important}

/* Desktop: park the dock in the sidebar's empty bottom area so it never covers game controls */
@media (min-width:1024px){
  .bx-dock{left:12px;right:auto;bottom:14px;width:208px;flex-wrap:wrap;gap:8px;border-radius:20px;padding:10px}
  .bx-level-info{flex:1}
  .bx-btn{flex:1;justify-content:center;padding:0 8px;font-size:12px;gap:4px}
}

/* ---------- polish: hover only for real pointers, staggered rows, accessibility ---------- */
@media (hover:hover) and (pointer:fine){
  .bx-btn:hover{background:rgba(226,188,87,.12);border-color:rgba(226,188,87,.4)}
  .bx-close:hover{background:rgba(255,255,255,.1)}
  .bx-claim:hover:not(:disabled){filter:brightness(1.08)}
  .bx-tabs button:hover:not(.bx-on){color:#e2e8f0}
}
@keyframes bx-row{from{opacity:0;transform:translateY(6px)}}
.bx-rows li:nth-child(2){animation-delay:30ms}.bx-rows li:nth-child(3){animation-delay:60ms}.bx-rows li:nth-child(4){animation-delay:90ms}
.bx-rows li:nth-child(5){animation-delay:120ms}.bx-rows li:nth-child(n+6){animation-delay:150ms}
@media (prefers-reduced-motion:reduce){
  .bx-modal,.bx-toast,.bx-bigwin-card,.bx-rows li,.bx-pop,.bx-level.bx-pop{animation:bx-in .2s ease!important}
  .bx-dock{transition:opacity .2s ease}
  .bx-btn:active,.bx-claim:active,.bx-close:active,.bx-tabs button:active{transform:none}
}
@media (prefers-reduced-transparency:reduce){
  .bx-dock,.bx-toast{background:#0e101a;backdrop-filter:none}
  .bx-modal-wrap{background:rgba(3,4,8,.92);backdrop-filter:none}
}

/* ================= App-wide polish (overrides Tailwind's @layer utilities, so no !important needed) ================= */
:root{
  --default-transition-timing-function:cubic-bezier(.23,1,.32,1); /* strong ease-out instead of the weak default */
  color-scheme:dark;
}
html{scrollbar-color:rgba(255,255,255,.16) transparent;scrollbar-width:thin;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{font-optical-sizing:auto;text-rendering:optimizeLegibility}
::selection{background:rgba(226,188,87,.35);color:#fff}
button,a,[role="button"]{touch-action:manipulation}
h1,h2{letter-spacing:-.015em}

/* App buttons (the shared Button component): name the animated properties, press with scale instead of a 1px nudge */
button.relative.inline-flex.select-none.items-center{transition-property:transform,translate,filter,background-color,border-color,color,box-shadow,opacity}
button.relative.inline-flex.select-none.items-center:active:not(:disabled){translate:none;transform:scale(.97);transition-duration:100ms}

/* Win banners: quick ease-out entrance from 92% instead of popping out of 60% with an overshoot */
.animate-pop{animation:.26s cubic-bezier(.23,1,.32,1) both bx-pop-in}
@keyframes bx-pop-in{from{opacity:0;transform:scale(.92)}}
.animate-fadeUp{animation:.3s cubic-bezier(.23,1,.32,1) both fadeUp}

/* Hero "Play now": calm, static glow instead of an endless pulse */
.animate-pulseGlow{animation:none;box-shadow:0 0 0 1px rgba(255,255,255,.35) inset,0 12px 34px -10px rgba(226,188,87,.75)}

/* Touch screens: hover lifts would stick after a tap */
@media (hover:none){
  [class*="hover:-translate"]:hover,.group:hover [class*="group-hover:-translate"],[class*="hover:scale"]:hover{translate:none;scale:none}
}

@media (prefers-reduced-transparency:reduce){
  .glass{background:#121624;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-reduced-motion:reduce){
  .animate-pop,.animate-fadeUp{animation:bx-in .2s ease both}
  button.relative.inline-flex.select-none.items-center:active:not(:disabled){transform:none}
}

/* VIP club (tiers by credits wagered) */
.bx-rank{color:var(--bx-tier,var(--bx-gold2))}
.bx-vip-gem{width:14px;height:14px;flex:none;transform:rotate(45deg);border-radius:3px;background:linear-gradient(135deg,rgba(255,255,255,.7),var(--t) 45%,rgba(0,0,0,.45));box-shadow:0 0 12px -2px var(--t)}
.bx-vip-now{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:16px;border:1px solid color-mix(in srgb,var(--t) 45%,transparent);background:color-mix(in srgb,var(--t) 9%,transparent)}
.bx-vip-now .bx-vip-gem{width:26px;height:26px;border-radius:6px}
.bx-vip-now b{display:block;font:700 26px/1.1 "Cormorant Garamond",serif;color:var(--t)}
.bx-vip-now small{color:#94a3b8;font-size:12.5px}
.bx-vip-bar{height:8px;margin:12px 0 18px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}
.bx-vip-bar i{display:block;height:100%;border-radius:inherit;box-shadow:0 0 12px rgba(255,255,255,.25)}
.bx-vip-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.bx-vip-list li{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid transparent;border-radius:12px;background:rgba(255,255,255,.025);font-size:13px}
.bx-vip-list .bx-name{flex:1;color:#e2e8f0}
.bx-vip-list .bx-val{color:#94a3b8}
.bx-vip-list li.bx-done{opacity:.5}
.bx-vip-list li.bx-on{border-color:var(--t);background:color-mix(in srgb,var(--t) 12%,transparent)}
.bx-vip-list li.bx-on .bx-name{color:var(--t);font-weight:700}
.bx-tier-tag{color:var(--t);font-weight:700}
/* Tips */
.bx-err[hidden]{display:none}
.bx-modal-tip .bx-err{padding:0 0 12px}
.bx-tipbtn{flex:none;height:28px;padding:0 9px;border-radius:999px;border:1px solid rgba(226,188,87,.3);background:rgba(226,188,87,.08);color:var(--bx-gold2);font:600 12px Inter,sans-serif;cursor:pointer;transition:background .15s ease,transform .12s ease}
.bx-tipbtn:hover{background:rgba(226,188,87,.18)}
.bx-tipbtn:active{transform:scale(.95)}
.bx-pod .bx-tipbtn{margin:0 auto 6px;display:block}
.bx-tip-open{margin-top:16px;height:46px}
.bx-field{display:block;margin:0 0 12px}
.bx-field span{display:block;margin:0 0 6px;font:600 12px Inter,sans-serif;color:#94a3b8;letter-spacing:.04em;text-transform:uppercase}
.bx-in{box-sizing:border-box;width:100%;height:46px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.35);color:#f8f4e6;font:600 15px "JetBrains Mono",monospace;outline:none}
.bx-in:focus{border-color:var(--bx-gold)}
.bx-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 16px}
.bx-chips button{height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#cbd5e1;font:600 12px "JetBrains Mono",monospace;cursor:pointer}
.bx-chips button:hover{color:#fff;border-color:rgba(226,188,87,.4)}