/* ════════════════════════════════════════════════════════════════════ * BUILD 171 · 游戏里面的画质:牌桌先升级(21 点 / 百家乐 / 轮盘 / 骰宝 / 鱼虾蟹的筹码) * 素材是老板让用 GPT 画的(下载进项目,自己处理成网页用的小图): * felt-green / felt-navy.webp —— 真台呢的绒面(512 无缝砖,按 256px 平铺 = 手机上 2 倍清晰) * chip-*.webp —— 俯视真筹码(白 红 青 绿 蓝 黑 紫 金 橙 灰),面额颜色照真赌场 * card-back.webp —— 牌背(cards.js 用) dice-1..6.webp —— 骰子(骰宝用) * 只换「桌上的实物」(台呢 / 桌沿 / 筹码 / 牌 / 骰子);按钮、顶栏这些界面仍然是站内的主题色。 * 打光和暗角由这里的渐变加(素材本身已经拉平了光照),所以同一张绒面放在哪张桌都不会一边亮一边暗。 * ════════════════════════════════════════════════════════════════════ */ /* ── ① 筹码槽:真筹码图 ─────────────────────────────────────────────── */ #app .chipbtn,.chipbtn.chipfly{--chipimg:url(chip-red.webp?v=4fcaa20d); background:var(--chipimg) center/100% 100% no-repeat; box-shadow:0 3px 0 rgba(0,0,0,.42),0 8px 14px -6px rgba(0,0,0,.9)} #app .chipbtn::after,.chipbtn.chipfly::after{display:none} #app .chipbtn::before,.chipbtn.chipfly::before{text-shadow:0 1px 1px rgba(0,0,0,.75),0 0 3px rgba(0,0,0,.35)} #app .chipbtn.on{box-shadow:0 0 0 2px #070912,0 0 0 3.5px #f3dd8e,0 6px 0 rgba(0,0,0,.42),0 14px 22px -8px rgba(243,221,142,.55)} #app .chipbtn[data-v="1"],.chipbtn.chipfly[data-v="1"]{--chipimg:url(chip-white.webp?v=71f3d25c);--ct:#2a1d05} #app .chipbtn[data-v="5"],.chipbtn.chipfly[data-v="5"]{--chipimg:url(chip-red.webp?v=4fcaa20d)} #app .chipbtn[data-v="10"],.chipbtn.chipfly[data-v="10"]{--chipimg:url(chip-teal.webp?v=333850cc)} #app .chipbtn[data-v="25"],.chipbtn.chipfly[data-v="25"]{--chipimg:url(chip-green.webp?v=7aa92fb3)} #app .chipbtn[data-v="50"],.chipbtn.chipfly[data-v="50"]{--chipimg:url(chip-blue.webp?v=1a7ac2ff)} #app .chipbtn[data-v="100"],.chipbtn.chipfly[data-v="100"]{--chipimg:url(chip-black.webp?v=bbe09bb9);--ct:#f3dd8e} #app .chipbtn[data-v="200"],.chipbtn.chipfly[data-v="200"], #app .chipbtn[data-v="500"],.chipbtn.chipfly[data-v="500"]{--chipimg:url(chip-purple.webp?v=a8562e3b)} #app .chipbtn[data-v="1k"],.chipbtn.chipfly[data-v="1k"]{--chipimg:url(chip-gold.webp?v=ad75eaed);--ct:#2a1d05} #app .chipbtn[data-v="2k"],.chipbtn.chipfly[data-v="2k"],#app .chipbtn[data-v="2.5k"],.chipbtn.chipfly[data-v="2.5k"], #app .chipbtn[data-v="3k"],.chipbtn.chipfly[data-v="3k"]{--chipimg:url(chip-orange.webp?v=f1e96dec)} #app .chipbtn[data-v="5k"],.chipbtn.chipfly[data-v="5k"]{--chipimg:url(chip-grey.webp?v=764f0bd9);--ct:#1c1f26} #app .chipbtn[data-v="10k"],.chipbtn.chipfly[data-v="10k"]{--chipimg:url(chip-black.webp?v=bbe09bb9);--ct:#f3dd8e} /* 深色字的筹码(白 / 金 / 灰)字上压一层浅色,不要黑影 */ #app .chipbtn[data-v="1"]::before,#app .chipbtn[data-v="1k"]::before,#app .chipbtn[data-v="5k"]::before, .chipbtn.chipfly[data-v="1"]::before,.chipbtn.chipfly[data-v="1k"]::before,.chipbtn.chipfly[data-v="5k"]::before{text-shadow:0 1px 0 rgba(255,255,255,.55)} /* ── ② 押在注区上的那一枚:金筹码图(自己的注一律金色,一眼认得出哪些是我押的)────── */ #app .bcspot .my,#app .sbwrap .sbspot .my,#app .fswrap .fscell .my,#app .fswrap .fspair .my,#app .rlwrap .rls .rlchip,#app .rlwrap .rlgrid .rls .rlchip,#app .rlwrap .rlzero .rls .rlchip,#app .rlwrap .rls.o .rlchip, #app .bcspot .my.pend,#app .sbwrap .sbspot .my.pend,#app .fswrap .fscell .my.pend,#app .fswrap .fspair .my.pend,#app .rlwrap .rls.staged:not(.has) .rlchip{ background:url(chip-gold.webp?v=ad75eaed) center/100% 100% no-repeat;color:#2a1d05;text-shadow:0 1px 0 rgba(255,255,255,.55); box-shadow:0 2px 0 rgba(0,0,0,.38),0 4px 9px rgba(0,0,0,.6)} /* ── ③ 21 点:深蓝真台呢 + 皮革软包桌沿(一圈一圈深浅,像鼓起来的软包)+ 金色印线 ──────── */ #app .tablefelt{border:0; background: radial-gradient(90% 58% at 50% -6%,rgba(196,222,255,.17),transparent 62%), /* 顶灯 */ radial-gradient(125% 105% at 50% 38%,transparent 52%,rgba(0,0,0,.55) 100%), /* 暗角 */ url(felt-navy.webp?v=9d21144f) 0 0/256px 256px,#0c1f45; background-blend-mode:normal; box-shadow:inset 0 -24px 50px rgba(0,0,0,.45),inset 0 0 0 1px rgba(0,0,0,.55), 0 0 0 1px #000,0 0 0 2.5px rgba(214,178,106,.8),0 0 0 3.5px #0b0806, 0 0 0 5.5px #2a1d15,0 0 0 7.5px #3d2b20,0 0 0 9.5px #2a1d15,0 0 0 11px #0b0806, 0 20px 40px rgba(0,0,0,.75)} #app .tablefelt::before{border:1px solid rgba(243,221,142,.42); box-shadow:inset 0 0 0 3px rgba(0,0,0,.12),inset 0 0 0 4px rgba(243,221,142,.16),inset 0 0 26px rgba(0,0,0,.28)} #app .tablefelt.winglow{box-shadow:inset 0 0 60px rgba(95,245,177,.22), 0 0 0 1px #000,0 0 0 2.5px rgba(95,245,177,.85),0 0 0 3.5px #0b0806, 0 0 0 5.5px #2a1d15,0 0 0 7.5px #3d2b20,0 0 0 9.5px #2a1d15,0 0 0 11px #0b0806, 0 0 50px rgba(95,245,177,.35),0 20px 40px rgba(0,0,0,.75)} #app .feltmark span{color:rgba(243,221,142,.11);text-shadow:0 1px 0 rgba(255,255,255,.04),0 -1px 0 rgba(0,0,0,.5)} #app .feltmark i{color:rgba(243,221,142,.14)} /* 空座位:台呢上印的金线注框 + 金圈「入座」钮(以前是虚线玻璃框 + 青色圈,像手机按钮);有人坐的座位不变 */ #app .pod.empty{border:1.5px solid rgba(243,221,142,.36);background:rgba(0,0,0,.12);backdrop-filter:none;-webkit-backdrop-filter:none; box-shadow:inset 0 0 0 3px rgba(0,0,0,.08),inset 0 0 0 4px rgba(243,221,142,.1)} #app .pod.empty .podsit{border:1.5px solid rgba(243,221,142,.62);background:radial-gradient(circle at 50% 30%,rgba(243,221,142,.16),rgba(0,0,0,.35)); color:#f3dd8e;box-shadow:0 0 0 3px rgba(243,221,142,.06),0 3px 8px rgba(0,0,0,.45)} #app .pod.empty .podsit::after{color:rgba(243,221,142,.92)} #app .pod.empty:hover,#app .pod.sitting{border-color:rgba(243,221,142,.72);background:rgba(243,221,142,.06)} #app .pod.sitting .podsit{border-color:#f3dd8e} /* ── ④ 百家乐:深蓝台呢 + 细皮沿;注区照真台「印在台呢上」—— 金线框,底色只淡淡带一点 ─────── */ #app .bcfelt{border:0; background: radial-gradient(80% 52% at 50% -8%,rgba(196,222,255,.15),transparent 62%), radial-gradient(125% 110% at 50% 40%,transparent 52%,rgba(0,0,0,.5) 100%), url(felt-navy.webp?v=9d21144f) 0 0/256px 256px,#0c1f45; box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 4px #241812,inset 0 0 0 5px rgba(214,178,106,.6),inset 0 -26px 60px rgba(0,0,0,.4), 0 10px 26px rgba(0,0,0,.55)} #app .bcfelt::before{inset:10px 12px;border-color:rgba(243,221,142,.3);box-shadow:inset 0 0 0 3px rgba(0,0,0,.12),inset 0 0 0 4px rgba(243,221,142,.1)} #app .bcmark span{color:rgba(243,221,142,.09)} #app .bcmark i{color:rgba(243,221,142,.12)} #app .bcspot{background:rgba(0,0,0,.14);border:1.5px solid rgba(243,221,142,.34);box-shadow:inset 0 0 18px rgba(0,0,0,.22)} #app .bcspot.p{background:linear-gradient(180deg,rgba(95,178,255,.13),rgba(95,178,255,.02) 70%),rgba(0,0,0,.1);border-color:rgba(150,200,255,.5)} #app .bcspot.b{background:linear-gradient(180deg,rgba(255,100,114,.13),rgba(255,100,114,.02) 70%),rgba(0,0,0,.1);border-color:rgba(255,160,168,.5)} #app .bcspot.t{background:linear-gradient(180deg,rgba(63,211,154,.12),rgba(63,211,154,.02) 70%),rgba(0,0,0,.1);border-color:rgba(130,230,190,.45)} #app .cslot{border:1px solid rgba(243,221,142,.22);background:rgba(0,0,0,.12)} /* ── ⑤ 轮盘:绿台呢 + 皮沿 + 顶灯打在轮盘那边 ─────────────────────────────── */ #app .lsgrid.rlg{ background: radial-gradient(52% 80% at 19% 50%,rgba(255,250,225,.1),transparent 62%), radial-gradient(120% 110% at 50% 45%,transparent 50%,rgba(0,0,0,.5) 100%), url(felt-green.webp?v=5654f689) 0 0/256px 256px,#0b5a31; box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 4px #241812,inset 0 0 0 5px rgba(214,178,106,.6),inset 0 0 50px rgba(0,0,0,.4),0 10px 24px rgba(0,0,0,.5)} /* 0 号格:以前是一块亮绿塑料色,换成台呢上淡淡一层绿(绒面透得出来) */ #app .rlwrap .rlzero .rls{background:radial-gradient(90% 70% at 60% 40%,rgba(60,200,120,.34),rgba(10,110,55,.2)) !important} /* ── ⑥ 骰宝:绿台呢;注格改成「印在台呢上」的浅线框 ─────────────────────────── */ #app .sbwrap .sbboard{border:0; background: radial-gradient(80% 60% at 50% -5%,rgba(255,250,225,.1),transparent 62%), radial-gradient(120% 110% at 50% 45%,transparent 52%,rgba(0,0,0,.48) 100%), url(felt-green.webp?v=5654f689) 0 0/256px 256px,#0b5a31; box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 4px #241812,inset 0 0 0 5px rgba(214,178,106,.6),inset 0 0 40px rgba(0,0,0,.35),0 10px 24px rgba(0,0,0,.5)} #app .sbwrap .sbspot{background:rgba(0,0,0,.16);border:1px solid rgba(255,244,214,.34);box-shadow:inset 0 0 14px rgba(0,0,0,.18)} #app .sbwrap .sbhop .sbband.hb:nth-child(odd) .sbspot{background:rgba(0,0,0,.24)} #app .sbbl{background:rgba(0,0,0,.2);color:rgba(255,236,190,.75)} #app .sbwrap .sbspot i{color:rgba(255,236,190,.88)} #app .sbwrap .sbspot i.sub{color:rgba(230,240,232,.6)} /* ── ⑦ 21 点下注盘(BUILD 161 那块):同一种深蓝台呢 + 皮沿;六格边注改成「印在台呢上」的色框(不再是实心色块按钮)── */ #app .bp3 .felt{border:0; background: radial-gradient(80% 70% at 27% 40%,rgba(196,222,255,.1),transparent 62%), radial-gradient(125% 115% at 50% 45%,transparent 50%,rgba(0,0,0,.45) 100%), url(felt-navy.webp?v=9d21144f) 0 0/256px 256px,#0c1f45; box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 4px #241812,inset 0 0 0 5px rgba(214,178,106,.6),inset 0 12px 28px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.45)} #app .bp3 .rbar{box-shadow:inset 0 0 14px rgba(0,0,0,.25),0 1px 0 rgba(255,255,255,.04)} #app .bp3 .rbar.red{--tg:linear-gradient(180deg,rgba(208,50,70,.34),rgba(127,20,36,.24));--tb:rgba(255,140,150,.62);--tx:#ffdfe2;--ts:rgba(255,223,226,.78)} #app .bp3 .rbar.black{--tg:linear-gradient(180deg,rgba(0,0,0,.46),rgba(0,0,0,.32));--tb:rgba(235,208,138,.46);--tx:#f3e9cf;--ts:rgba(243,233,207,.72)} #app .bp3 .rbar.odd{--tg:linear-gradient(180deg,rgba(201,154,55,.3),rgba(118,82,26,.2));--tb:rgba(255,226,150,.62);--tx:#ffe7a8;--ts:rgba(255,231,168,.78)} #app .bp3 .rbar.even{--tg:linear-gradient(180deg,rgba(242,234,218,.24),rgba(203,189,154,.12));--tb:rgba(255,250,235,.62);--tx:#fff6df;--ts:rgba(255,246,223,.75)} #app .bp3 .rbar.small{--tg:linear-gradient(180deg,rgba(31,151,161,.32),rgba(11,77,86,.22));--tb:rgba(150,235,240,.58);--tx:#cdf8fb;--ts:rgba(205,248,251,.75)} #app .bp3 .rbar.big{--tg:linear-gradient(180deg,rgba(222,123,50,.32),rgba(132,58,16,.22));--tb:rgba(255,196,140,.62);--tx:#ffdcbd;--ts:rgba(255,220,189,.78)} #app .bp3 .rbar.red .rbpay{color:var(--ts)} #app .bp3 .rbar.has{border-color:#ffd166} /* 下注盘上的筹码也换成真筹码图(颜色照面额,跟筹码槽同一套) */ #app .bp3 .fchip{--chipimg:url(chip-red.webp?v=4fcaa20d);background:var(--chipimg) center/100% 100% no-repeat} #app .bp3 .fchip::after{display:none} #app .bp3 .fchip[data-v="1"]{--chipimg:url(chip-white.webp?v=71f3d25c)} #app .bp3 .fchip[data-v="5"]{--chipimg:url(chip-red.webp?v=4fcaa20d)} #app .bp3 .fchip[data-v="10"]{--chipimg:url(chip-teal.webp?v=333850cc)} #app .bp3 .fchip[data-v="25"]{--chipimg:url(chip-green.webp?v=7aa92fb3)} #app .bp3 .fchip[data-v="50"]{--chipimg:url(chip-blue.webp?v=1a7ac2ff)} #app .bp3 .fchip[data-v="100"],#app .bp3 .fchip[data-v="10k"]{--chipimg:url(chip-black.webp?v=bbe09bb9)} #app .bp3 .fchip[data-v="200"],#app .bp3 .fchip[data-v="500"]{--chipimg:url(chip-purple.webp?v=a8562e3b)} #app .bp3 .fchip[data-v="1k"]{--chipimg:url(chip-gold.webp?v=ad75eaed)} #app .bp3 .fchip[data-v="2k"],#app .bp3 .fchip[data-v="2.5k"],#app .bp3 .fchip[data-v="3k"]{--chipimg:url(chip-orange.webp?v=f1e96dec)} #app .bp3 .fchip[data-v="5k"]{--chipimg:url(chip-grey.webp?v=764f0bd9);--ct:#1c1f26} #app .bp3 .fchip[data-v="1"] .bv,#app .bp3 .fchip[data-v="1"] .rbv,#app .bp3 .fchip[data-v="1k"] .bv,#app .bp3 .fchip[data-v="1k"] .rbv, #app .bp3 .fchip[data-v="5k"] .bv,#app .bp3 .fchip[data-v="5k"] .rbv{text-shadow:0 1px 0 rgba(255,255,255,.55)} /* ── ⑧ 百家乐注区:印在台呢上 —— 金线双框,字是颜色,不再是一块块色底 ── */ #app .bcspot{background:rgba(0,0,0,.12);border:1.5px solid rgba(243,221,142,.38); box-shadow:inset 0 0 0 3px rgba(0,0,0,.08),inset 0 0 0 4px rgba(243,221,142,.1),inset 0 0 18px rgba(0,0,0,.2)} #app .bcspot.p{background:radial-gradient(90% 90% at 50% 40%,rgba(95,178,255,.12),transparent 75%),rgba(0,0,0,.1);border-color:rgba(150,200,255,.55)} #app .bcspot.b{background:radial-gradient(90% 90% at 50% 40%,rgba(255,100,114,.12),transparent 75%),rgba(0,0,0,.1);border-color:rgba(255,160,168,.55)} #app .bcspot.tie{background:radial-gradient(90% 90% at 50% 40%,rgba(63,211,154,.11),transparent 75%),rgba(0,0,0,.1);border-color:rgba(130,230,190,.5)} #app .bcspot.pp{border-color:rgba(150,200,255,.4)} #app .bcspot.bp{border-color:rgba(255,160,168,.4)} #app .bcspot.mine{box-shadow:inset 0 0 0 3px rgba(0,0,0,.08),inset 0 0 18px rgba(0,0,0,.2),0 0 0 1px rgba(255,209,102,.6),0 0 18px rgba(255,209,102,.18)} #app .bcspot.won{border-color:rgba(95,245,177,.95);box-shadow:0 0 0 1.5px rgba(95,245,177,.7),0 0 24px rgba(95,245,177,.35)} /* ── ⑨ 大屏(电脑 / 平板横放):台面大了,牌、骰子图标、字跟着放大 —— 手机横屏尺寸不变 ── */ @media(min-width:1100px) and (min-height:720px){ #app .bccard{width:74px} #app .cslot{width:74px;height:102px} #app .bcslots,#app .bccards{gap:9px} #app .bchead b{font-size:19px} #app .bchead u{min-width:38px;height:31px;font-size:19px} #app .sbwrap .sbspot b,#app .sbwrap .sbfull .sbspot b{font-size:18px} #app .sbwrap .sbspot b.lg,#app .sbwrap .sbfull .sbspot b.lg{font-size:30px} #app .sbwrap .sbspot.sum b,#app .sbwrap .sbfull .sbspot.sum b{font-size:22px} #app .sbwrap .sbspot.tany b,#app .sbwrap .sbfull .sbspot.tany b{font-size:15px} #app .sbwrap .sbspot i,#app .sbwrap .sbfull .sbspot i{font-size:11px} #app .sbwrap .sbspot i.sub,#app .sbwrap .sbfull .sbspot i.sub{font-size:10px} #app .sbwrap .sbspot .dd{gap:3px} #app .sbband{grid-template-columns:18px minmax(0,1fr)} #app .sbbl{font-size:10px} #app .sbband.b2 .sbmini svg,#app .sbband.b5 .sbmini svg{width:24px;height:24px} #app .sbband.b3 .sbmini svg{width:28px;height:28px} #app .sbband.b6 .sbmini svg{width:38px;height:38px} }