/* 拧拧玩具铺 Tin Toy Twist - BNBG Black Gold per-game layer (linked after skin-bnbg.css). Everything is scoped under
   html[data-skin="bnbg"]; classic is untouched. Kit v1.2.1: every panel, plate and HUD box is stitched TRUE-BLACK leather with
   gold stitching; buttons stay the kit's gold primary / black-lacquer secondary. Screw, box and plate colours (and the
   colour-blind glyphs) are gameplay: they keep their exact hues. The coins stay play coins (游戏币仅供娱乐，无现金价值). */
html[data-skin="bnbg"]{
  --tt-well:linear-gradient(180deg,rgba(4,4,4,.42),rgba(12,12,11,.28)),var(--bnbg-leather-grain-sm) 0 0/120px 120px repeat,#141312;
  --tt-well-sh:inset 0 1px 3px rgba(0,0,0,.7),0 1px 0 rgba(255,240,210,.06)}
html[data-skin="bnbg"],html[data-skin="bnbg"] body{background:#0A0A0A}

/* ---------- grounds ---------- */
html[data-skin="bnbg"] #app.game{background:#0A0A0A}
html[data-skin="bnbg"] #scr-splash{background:radial-gradient(ellipse at 50% 46%,transparent 0,transparent 34%,rgba(5,5,4,.8) 78%,#050505 100%)}
html[data-skin="bnbg"] #scr-splash>.bnbg-mark{margin-bottom:10px}
html[data-skin="bnbg"] .logo{font-weight:900;letter-spacing:.08em}
html[data-skin="bnbg"] .logo i{color:transparent;-webkit-text-fill-color:transparent}
html[data-skin="bnbg"] .logo small{font-family:var(--bnbg-font);font-size:.2em;letter-spacing:.42em}
html[data-skin="bnbg"] #scr-splash .logo small{background:transparent;padding:0}
html[data-skin="bnbg"] .advisory b{color:var(--bnbg-eyebrow);font-weight:500;letter-spacing:.32em}
html[data-skin="bnbg"] #app.en .advisory b{letter-spacing:.12em}
html[data-skin="bnbg"] .age b{background:var(--bnbg-fill);color:var(--bnbg-ink);font-weight:600}
html[data-skin="bnbg"] .ver{opacity:.8}
html[data-skin="bnbg"] .lantern{display:none}
html[data-skin="bnbg"] #rotate{background:radial-gradient(ellipse at 50% 40%,#1C1B19,#0A0A0A 70%,#050505)}
html[data-skin="bnbg"] #rotate b{color:var(--bnbg-gold-hi);-webkit-text-stroke:0;text-shadow:none;font-weight:500}
html[data-skin="bnbg"] #rotate span{color:var(--bnbg-label)}
html[data-skin="bnbg"] #rotate .ph{border-color:var(--bnbg-gold)}html[data-skin="bnbg"] #rotate .ph:after{background:var(--bnbg-gold)}

/* ---------- home ---------- */
html[data-skin="bnbg"] .h-title .logo{-webkit-text-stroke:0;text-shadow:none}
html[data-skin="bnbg"] .chip-st{background:var(--bnbg-leather-sm);border:1px solid var(--bnbg-leather-edge);box-shadow:inset 0 0 0 2px var(--bnbg-leather-rim-sm),0 6px 14px rgba(0,0,0,.5);color:var(--bnbg-gold-hi);font-weight:500}
html[data-skin="bnbg"] .stage .lbl{background:var(--bnbg-leather-sm);border:1px solid var(--bnbg-leather-edge);color:var(--bnbg-gold-hi);font-weight:500}
html[data-skin="bnbg"] .stage .mascot{filter:drop-shadow(0 12px 22px rgba(0,0,0,.65))}
html[data-skin="bnbg"] .stage .say{background:var(--bnbg-leather-sm);color:var(--bnbg-text);border:1px solid var(--bnbg-leather-edge);box-shadow:inset 0 0 0 2px var(--bnbg-leather-rim-sm),0 8px 20px rgba(0,0,0,.55);font-weight:500;outline:1px dashed var(--bnbg-stitch-c-sm);outline-offset:-4px}
html[data-skin="bnbg"] .stage .say:before{border-top-color:var(--bnbg-leather-edge)}
html[data-skin="bnbg"] .cta>span:first-child{-webkit-text-stroke:0;text-shadow:0 1px 0 rgba(255,248,230,.35)}
html[data-skin="bnbg"] .cta .lv{background:#0B0B0A;color:var(--bnbg-gold-hi);border:1px solid var(--bnbg-gold);font-weight:500}
html[data-skin="bnbg"] .tile{color:var(--bnbg-text);font-weight:500;border-radius:var(--bnbg-r)}
html[data-skin="bnbg"] .tile:active{translate:none;transform:translateY(1px)}
html[data-skin="bnbg"] .tile small{color:var(--bnbg-muted);font-weight:400}
html[data-skin="bnbg"] .tile svg *{fill:transparent!important;stroke:var(--bnbg-gold-hi)!important}
html[data-skin="bnbg"] .tile svg{filter:drop-shadow(0 0 6px rgba(212,175,55,.3))}
html[data-skin="bnbg"] .dot{background:var(--bnbg-fill);border:1.5px solid #0A0A0A;box-shadow:0 0 10px rgba(241,210,122,.6)}
html[data-skin="bnbg"] .toybar b{color:var(--bnbg-text);font-weight:500}
html[data-skin="bnbg"] .toybar .parts i{background:#121211;border:1px solid var(--bnbg-well-line)}
html[data-skin="bnbg"] .toybar .parts i.on{background:var(--bnbg-fill);border-color:#0A0A0A}
html[data-skin="bnbg"] .pill .plus{background:var(--bnbg-fill);border:1px solid #0A0A0A;color:var(--bnbg-ink);font-weight:500}

/* ---------- game HUD ---------- */
html[data-skin="bnbg"] #g-top{background:linear-gradient(rgba(5,5,5,.94),rgba(5,5,5,.7) 70%,rgba(5,5,5,0))}
html[data-skin="bnbg"] #g-bottom{background:linear-gradient(rgba(5,5,5,0),rgba(5,5,5,.75) 40%,rgba(5,5,5,.94))}
html[data-skin="bnbg"] .lvpill{color:var(--bnbg-text);font-family:var(--bnbg-serif);font-weight:400;letter-spacing:.08em;border-radius:12px}
html[data-skin="bnbg"] .lvpill .tier{background:#0B0B0A;color:var(--bnbg-gold-hi);border:1px solid var(--bnbg-gold);font-family:var(--bnbg-font);font-weight:500;letter-spacing:.06em}
html[data-skin="bnbg"] .lvpill .tier.normal{color:var(--bnbg-label);border-color:var(--bnbg-line)}html[data-skin="bnbg"] .lvpill .tier.relief{color:#BFEBD6;border-color:rgba(34,217,154,.5)}
html[data-skin="bnbg"] .wlabel{background:rgba(10,10,10,.86);border:1px solid var(--bnbg-line);color:var(--bnbg-text);font-weight:500}
html[data-skin="bnbg"] .wlabel.done{background:rgba(18,58,44,.92);border-color:rgba(34,217,154,.5)}
html[data-skin="bnbg"] #addhole{border:1.5px dashed var(--bnbg-gold);background:rgba(10,10,10,.85);color:var(--bnbg-gold-hi);font-weight:400}
html[data-skin="bnbg"] #g-left{color:var(--bnbg-label);font-weight:500}
html[data-skin="bnbg"] #g-left b{color:var(--bnbg-gold-hi);font-weight:500;font-variant-numeric:tabular-nums}
html[data-skin="bnbg"] .prop{border:1.5px solid transparent;background:radial-gradient(circle at 50% 30%,#2A2926,#0D0D0C 72%) padding-box,var(--bnbg-rim) border-box;color:var(--bnbg-gold-hi);font-weight:500;box-shadow:inset 0 1px 0 rgba(255,240,183,.18),0 12px 26px rgba(0,0,0,.6),var(--bnbg-glow)}
html[data-skin="bnbg"] .prop:active{translate:none;transform:translateY(1px)}
html[data-skin="bnbg"] .prop.off{filter:grayscale(.6) brightness(.7)}
html[data-skin="bnbg"] .prop.armed{background:var(--bnbg-fill) padding-box,linear-gradient(158deg,#FFF3C8,#B8913A 50%,#F1D27A) border-box;color:var(--bnbg-ink);box-shadow:0 0 0 2px #0A0A0A,0 0 0 3.5px var(--bnbg-gold-bright),0 0 26px rgba(241,210,122,.55)}
html[data-skin="bnbg"] .prop .bd{background:#7A1A24;border:1px solid rgba(255,107,128,.6);color:#FFE6EA;font-weight:500}
html[data-skin="bnbg"] .prop .bd.own{background:#0B0B0A;color:var(--bnbg-gold-hi);border-color:var(--bnbg-gold)}
html[data-skin="bnbg"] .prop .bd.buy{background:var(--bnbg-fill);color:var(--bnbg-ink);border-color:#0A0A0A}
html[data-skin="bnbg"] #g-hammer{color:var(--bnbg-text);font-weight:500}
html[data-skin="bnbg"] #g-hammer small{color:var(--bnbg-muted);opacity:1}
html[data-skin="bnbg"] #g-side .panel b{color:var(--bnbg-gold-hi);font-weight:500}
html[data-skin="bnbg"] #coach .b small{color:var(--bnbg-eyebrow);font-weight:500;letter-spacing:.14em}
html[data-skin="bnbg"] #coach canvas{filter:drop-shadow(0 8px 16px rgba(0,0,0,.6))}
html[data-skin="bnbg"] #hand{filter:drop-shadow(0 4px 10px rgba(0,0,0,.7))}
html[data-skin="bnbg"] #banner{font-size:clamp(36px,10.5vw,72px)}
html[data-skin="bnbg"] #app.en #banner{font-size:clamp(28px,8vw,58px);letter-spacing:0}
html[data-skin="bnbg"] #banner small{color:var(--bnbg-label);font-family:var(--bnbg-font);font-weight:500;letter-spacing:.24em;text-shadow:none;-webkit-text-stroke:0;background:var(--bnbg-leather-sm);border:1px solid var(--bnbg-leather-edge)}
html[data-skin="bnbg"] .float{-webkit-text-stroke:0;text-shadow:0 2px 10px rgba(0,0,0,.85),0 0 1px #000;font-weight:600;font-variant-numeric:tabular-nums}
html[data-skin="bnbg"] .float.gain{color:var(--bnbg-gold-hi)}
html[data-skin="bnbg"] #flash{background:radial-gradient(circle at 50% 50%,#FFF3C8,rgba(212,175,55,.6) 45%,transparent 75%)}
html[data-skin="bnbg"] #app.nogl .stage{border:1px solid var(--bnbg-leather-edge);box-shadow:inset 0 0 0 6px var(--bnbg-leather-rim),0 20px 50px rgba(0,0,0,.6);background:var(--bnbg-leather)}

/* ---------- cards ---------- */
html[data-skin="bnbg"] .card:before,html[data-skin="bnbg"] .card:after{display:none}
html[data-skin="bnbg"] .x-close{border:1px solid var(--bnbg-line);background:radial-gradient(circle at 50% 30%,#22211F,#0B0B0A 75%);color:var(--bnbg-gold-hi);font-weight:400;box-shadow:inset 0 1px 0 rgba(255,240,183,.12),0 6px 14px rgba(0,0,0,.5)}
html[data-skin="bnbg"] .card p{color:var(--bnbg-text-2)}
html[data-skin="bnbg"] .card p.fine{color:var(--bnbg-muted);opacity:1}
html[data-skin="bnbg"] .panel{background:var(--tt-well);border:1px solid var(--bnbg-well-line);box-shadow:var(--tt-well-sh);color:var(--bnbg-text-2)}
html[data-skin="bnbg"] .panel>b{color:var(--bnbg-eyebrow);font-weight:500;letter-spacing:.2em}
html[data-skin="bnbg"] .set small{color:var(--bnbg-muted);opacity:1}
html[data-skin="bnbg"] .set span{font-weight:400}
html[data-skin="bnbg"] .set.skinrow .seg button{padding:0 14px}
html[data-skin="bnbg"] .stars svg{filter:drop-shadow(0 0 10px rgba(212,175,55,.45))}
html[data-skin="bnbg"] .rew div{border-bottom-color:rgba(183,157,98,.2);color:var(--bnbg-text-2);font-weight:500}
html[data-skin="bnbg"] .rew .g{color:var(--bnbg-gold-hi)}
html[data-skin="bnbg"] .rew .tot b{color:var(--bnbg-gold-hi);-webkit-text-stroke:0;font-family:var(--bnbg-num-light);font-weight:300}
html[data-skin="bnbg"] :is(.toyprog,.buy,.giftrow,.stat3 div){background:var(--tt-well);border:1px solid var(--bnbg-well-line);box-shadow:var(--tt-well-sh)}
html[data-skin="bnbg"] .toyprog .t b,html[data-skin="bnbg"] .buy b,html[data-skin="bnbg"] .giftrow{color:var(--bnbg-gold-hi);font-weight:500}
html[data-skin="bnbg"] .stat3 b{color:var(--bnbg-text);font-family:var(--bnbg-num-light);font-weight:300}
html[data-skin="bnbg"] .buy .ic{border:1.5px solid transparent;background:radial-gradient(circle at 50% 30%,#2A2926,#0D0D0C 72%) padding-box,var(--bnbg-rim) border-box;color:var(--bnbg-gold-hi)}
html[data-skin="bnbg"] .sday{background:var(--tt-well);border:1px solid var(--bnbg-well-line);box-shadow:var(--tt-well-sh);color:var(--bnbg-text-2);font-weight:500}
html[data-skin="bnbg"] .sday b{color:var(--bnbg-gold-hi);font-weight:500}
html[data-skin="bnbg"] .sday em{color:var(--bnbg-label)}
html[data-skin="bnbg"] .sday.today{border-color:var(--bnbg-gold);box-shadow:var(--tt-well-sh),0 0 0 1px var(--bnbg-gold),0 0 18px rgba(212,175,55,.4)}
html[data-skin="bnbg"] .sday.d7{background:linear-gradient(180deg,rgba(212,175,55,.16),rgba(212,175,55,.04)),var(--tt-well);border-color:var(--bnbg-gold)}
html[data-skin="bnbg"] .sday.d7 b{color:var(--bnbg-gold-bright)}html[data-skin="bnbg"] .sday.d7 em{color:var(--bnbg-label)}
html[data-skin="bnbg"] .sday.done{filter:none;opacity:.5}
html[data-skin="bnbg"] .sday.done:after{color:var(--bnbg-gold-bright);text-shadow:0 0 12px rgba(0,0,0,.9)}
html[data-skin="bnbg"] .cal .wd{color:var(--bnbg-muted);opacity:1;font-weight:500}
html[data-skin="bnbg"] .cal .d{background:#121211;border:1px solid var(--bnbg-line-soft);color:var(--bnbg-text-2);font-weight:400}
html[data-skin="bnbg"] .cal .d.today{border:1.5px solid var(--bnbg-gold);background:#1A1918;color:var(--bnbg-gold-hi)}
html[data-skin="bnbg"] .cal .d.stamp:after{border-color:var(--bnbg-gold);background:radial-gradient(rgba(212,175,55,.25),rgba(212,175,55,0))}
html[data-skin="bnbg"] .shelf .it{background:var(--tt-well);border:1px solid var(--bnbg-well-line);box-shadow:var(--tt-well-sh);color:var(--bnbg-text);font-weight:500}
html[data-skin="bnbg"] .shelf .it.lock{background:#0E0E0D;color:#7A7468}
html[data-skin="bnbg"] .shelf .it.lock canvas{filter:grayscale(1) brightness(.5)}
html[data-skin="bnbg"] .shelf .it .tag{background:var(--bnbg-fill);color:var(--bnbg-ink);border:1px solid #0A0A0A}
html[data-skin="bnbg"] .rules{color:var(--bnbg-text-2)}
html[data-skin="bnbg"] .rules li::marker{color:var(--bnbg-gold)}

/* =====================================================================================================================
   LEATHER PASS (kit v1.2.1 black leather): this game's own panels, plates and HUD boxes, same recipe as the kit (one shared
   pre-tiled grain per size, inset rim, top highlight, dashed gold stitch as an inset outline). The kit covers .card .pill #toast.
   Sizes: md = .advisory .toybar #g-side .panel #coach .b #g-hammer #rest #nogl | sm (chip) = .tile .lvpill #g-left
   ===================================================================================================================== */
html[data-skin="bnbg"] :is(.advisory,.toybar,#g-side .panel,#coach .b,#g-hammer,#rest,#nogl){--bnbg-l-rim:4px;--bnbg-l-rimc:var(--bnbg-leather-rim);--bnbg-l-inset:6px;--bnbg-l-stitch:var(--bnbg-stitch-c);--bnbg-l-drop:0 14px 34px rgba(0,0,0,.6)}
html[data-skin="bnbg"] :is(.tile,.lvpill,#g-left){--bnbg-l-rim:3px;--bnbg-l-rimc:var(--bnbg-leather-rim-sm);--bnbg-l-inset:4px;--bnbg-l-stitch:var(--bnbg-stitch-c-sm);--bnbg-l-drop:0 8px 20px rgba(0,0,0,.5)}
/* AA on the lightest grain: the lifted small-text tokens inside these surfaces (as the kit does inside its own leather) */
html[data-skin="bnbg"] :is(.advisory,.toybar,#g-side .panel,#coach .b,#g-hammer,#rest,#nogl,.tile,.lvpill,#g-left,.card){--bnbg-eyebrow:#DDC07A;--bnbg-label:#DCCDA4;--bnbg-muted:#DCD4C2;--bnbg-muted-2:#D8D0BD}
html[data-skin="bnbg"] :is(.advisory,.toybar,#g-side .panel,#coach .b,#g-hammer,#rest,#nogl,.tile,.lvpill,#g-left){
  background:var(--bnbg-leather);border:1px solid var(--bnbg-leather-edge);border-image:none;
  box-shadow:inset 0 0 0 var(--bnbg-l-rim) var(--bnbg-l-rimc),var(--bnbg-leather-hi),var(--bnbg-l-drop);
  outline:1px dashed var(--bnbg-l-stitch);outline-offset:calc(var(--bnbg-l-inset) * -1);
  color:var(--bnbg-text);-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-skin="bnbg"] :is(.tile,.lvpill,#g-left){background:var(--bnbg-leather-sm)}
html[data-skin="bnbg"] :is(.tile,.toybar):hover{border-color:var(--bnbg-leather-edge-hi);--bnbg-l-stitch:var(--bnbg-stitch-hi)}
html[data-skin="bnbg"] :is(.tile,.prop,.toybar):focus-visible{outline:1.5px solid var(--bnbg-gold-bright);outline-offset:2px}
html[data-skin="bnbg"] .advisory{color:var(--bnbg-text-2);border-radius:var(--bnbg-r)}
html[data-skin="bnbg"] #coach .b{color:var(--bnbg-text);font-weight:500;border-radius:var(--bnbg-r)}
html[data-skin="bnbg"] #g-hammer,html[data-skin="bnbg"] #rest,html[data-skin="bnbg"] #nogl{border-radius:var(--bnbg-r)}
html[data-skin="bnbg"] #rest{color:var(--bnbg-text)}
html[data-skin="bnbg"] .toybar{border-radius:var(--bnbg-r)}

/* BNBG power-ups (bnbg.js) */
html[data-skin="bnbg"] .prop .bd.bn{background:var(--bnbg-gold-hi,#E8C766);color:#0A0A0A;border-color:#0A0A0A}
html[data-skin="bnbg"] .bnchip{background:#0B0B0A;border:1px solid var(--bnbg-gold,#B8952E);color:var(--bnbg-gold-hi,#E8C766);font-family:var(--bnbg-font);font-weight:500;letter-spacing:.12em}
html[data-skin="bnbg"] .bnchip span{color:var(--bnbg-text,#eee)}
html[data-skin="bnbg"] .bnshop .bnbal,html[data-skin="bnbg"] .bnshop .bnbal b{color:var(--bnbg-gold-hi,#E8C766);font-family:var(--bnbg-font);font-weight:500}
html[data-skin="bnbg"] .bnshop .bnitem{background:#0B0B0A;border:1px solid rgba(212,175,55,.3);border-radius:12px;color:var(--bnbg-text-2,#ddd)}
html[data-skin="bnbg"] .bnshop .bnitem.want{border-color:var(--bnbg-gold-hi,#E8C766)}
html[data-skin="bnbg"] .bnshop .bnitem i{color:var(--bnbg-gold-hi,#E8C766)}
