/*
 * Q 版金绿（2026-10-21 用户在 public/design/luxury.html 里选的方案 E）：保留绿呢 + 金色，换成卡通的样子——
 *   粗深棕描边、圆鼓鼓的果冻按钮（上面一道高光、底下一块贴纸阴影，按下去往下陷）、卡通描边金字、牌和头像都有描边。
 * 只在房间里（牌桌、结算、房间里的弹窗）生效：和 skin-gold*.css 一起由 app.js applySkin() 切换，加在 html.q 下面。
 * 最后加载，压过前面各游戏的样式（按钮、面板这些用了 !important，因为前面有的选择器写得很长）。
 */
html.q {
  --q-ink: #3a2205; /* 描边 */
  --q-gold-hi: #fff3a6;
  --q-gold: #ffcc33;
  --q-gold-lo: #f0a020;
  --q-red-hi: #ff8a7a;
  --q-red: #e8382a;
  --q-green-hi: #5fdc9a;
  --q-green: #1f9a5f;
}
html.q #stage { background:
  radial-gradient(circle, rgba(255, 255, 255, .07) 2px, transparent 3px) 0 0 / 22px 22px,
  radial-gradient(60% 70% at 50% 40%, #23a066, #0e5a38 70%, #073a24); }

/* ---------- 按钮：果冻 ---------- */
html.q .btn, html.q .wbtn, html.q .dbtn, html.q .tbtn, html.q .gtab, html.q .wsb, html.q .chip, html.q .sbtn, html.q .propbtn {
  border: 2.5px solid var(--q-ink) !important; border-radius: 14px !important; font-weight: 900 !important;
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, .45), 0 4px 0 var(--q-ink) !important;
  transition: transform .08s, box-shadow .08s; }
html.q .btn:active:not(:disabled), html.q .wbtn:active:not(:disabled), html.q .dbtn:active, html.q .tbtn:active:not(:disabled), html.q .gtab:active, html.q .wsb:active, html.q .chip:active {
  transform: translateY(3px) !important; box-shadow: inset 0 3px 0 rgba(255, 255, 255, .35), 0 1px 0 var(--q-ink) !important; }
/* 主按钮（出牌、准备、下一局、确定）：圆鼓鼓的金黄 */
html.q .btn.primary, html.q .btn.gold, html.q .wbtn.green, html.q .dbtn.ok, html.q .chip.on, html.q .gtab.on, html.q .tbtn.on {
  color: #5a3000 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, .5) !important;
  background: linear-gradient(var(--q-gold-hi), var(--q-gold) 55%, var(--q-gold-lo)) !important; }
/* 一般按钮：糖果绿 */
html.q .btn.ghost, html.q .btn.blue, html.q .wbtn, html.q .dbtn.cancel, html.q .tbtn, html.q .gtab, html.q .chip, html.q .sbtn, html.q .propbtn {
  color: #fff; text-shadow: 0 2px 0 var(--q-ink);
  background: linear-gradient(var(--q-green-hi), var(--q-green)) ; }
html.q .btn.ghost, html.q .wbtn:not(.green), html.q .dbtn.cancel, html.q .tbtn:not(.on), html.q .gtab:not(.on), html.q .chip:not(.on), html.q .sbtn, html.q .propbtn {
  background: linear-gradient(var(--q-green-hi), var(--q-green)) !important; color: #fff !important; text-shadow: 0 2px 0 var(--q-ink) !important; }
/* 危险 / 解散 / 倒水：番茄红 */
html.q .btn.danger, html.q .btn.gdanger, html.q .dbtn.foulbtn {
  color: #fff !important; text-shadow: 0 2px 0 #7a1208 !important; background: linear-gradient(var(--q-red-hi), var(--q-red)) !important; }
html.q .btn:disabled, html.q .wbtn:disabled, html.q .tbtn:disabled {
  background: linear-gradient(#9cb8a8, #6f8b7c) !important; color: rgba(255, 255, 255, .7) !important; text-shadow: none !important; opacity: 1; }
/* 五十K右下小按钮：原来是斜切的，改成圆角糖果块 */
html.q .wsb { transform: none !important; background: linear-gradient(#ffb15a, #e0782a) !important; color: #fff !important; }
html.q .wsb > * { transform: none !important; }
html.q .wsb span { text-shadow: 0 2px 0 var(--q-ink) !important; }
html.q .wsb svg { stroke: #fff !important; filter: none !important; }
/* 麻将吃碰杠胡：圆形果冻 */
html.q .mjbtn { border: 3px solid var(--q-ink) !important; box-shadow: inset 0 4px 0 rgba(255, 255, 255, .4), 0 5px 0 var(--q-ink) !important; }
html.q .mjbtn:active { transform: translateY(3px); box-shadow: inset 0 4px 0 rgba(255, 255, 255, .3), 0 2px 0 var(--q-ink) !important; }
html.q .mjbtn.hu { background: linear-gradient(var(--q-red-hi), var(--q-red)) !important; }
/* 聊天按钮 */
html.q .chatfab { border: 3px solid var(--q-ink); box-shadow: inset 0 3px 0 rgba(255, 255, 255, .4), 0 4px 0 var(--q-ink); background: linear-gradient(#ffb15a, #e0782a); color: #fff; }
/* 主按钮隔一会儿弹一下，提醒该你了 */
@keyframes qJelly { 0%, 80%, 100% { scale: 1 1; } 85% { scale: 1.1 .9; } 90% { scale: .95 1.06; } 95% { scale: 1.02 .98; } }
html.q .wactsbox .wbtn.green:not(:disabled), html.q .donebar .dbtn.ok, html.q .tablecenter .btn.primary, html.q .mjrbar .btn.primary, html.q .dyrbar .btn.primary { animation: qJelly 2.6s ease-in-out infinite; }

/* ---------- 牌、头像：描边 + 贴纸阴影 ---------- */
html.q .card { box-shadow: 0 0 0 1.5px var(--q-ink), 0 3px 0 rgba(58, 34, 5, .85) !important; }
html.q .card.mini { box-shadow: 0 0 0 1px var(--q-ink), 0 2px 0 rgba(58, 34, 5, .7) !important; }
html.q .card.selected, html.q .wc.sel .card, html.q .dyh .card.selected { box-shadow: 0 0 0 2.5px var(--q-gold), 0 0 0 4px var(--q-ink), 0 0 14px rgba(255, 210, 80, .9) !important; }
html.q .card.slot { box-shadow: none !important; }
html.q .avatar { border: 2.5px solid var(--q-ink) !important; box-shadow: 0 0 0 2px var(--q-gold), 0 3px 0 2px var(--q-ink) !important; }

/* ---------- 牌桌：粗棕边 + 金圈 + 上面一道高光 ---------- */
html.q .mjtable, html.q .dytable {
  box-shadow: inset 0 0 0 3px var(--q-ink), inset 0 0 0 7px var(--q-gold), inset 0 0 0 9px var(--q-ink), inset 0 10px 0 rgba(255, 255, 255, .1), inset 0 0 30px rgba(0, 0, 0, .35) !important; }

/* ---------- 面板、弹窗：圆角卡通框 ---------- */
html.q .sheet, html.q .gpanel, html.q .dyrpanel, html.q .mjrpanel, html.q .dysheetbox, html.q .jkbox, html.q .panel, html.q .rblock {
  border: 3px solid var(--q-ink) !important; border-radius: 18px !important;
  box-shadow: inset 0 0 0 3px var(--q-gold), 0 6px 0 var(--q-ink), 0 12px 24px rgba(0, 0, 0, .35) !important; }
html.q .topbar { border-bottom: 3px solid var(--q-ink) !important; box-shadow: 0 3px 0 rgba(255, 204, 51, .55), 0 4px 10px rgba(0, 0, 0, .35) !important; }

/* ---------- 小牌子：名字、分数、张数、鱼篓、标签 ---------- */
html.q .dywho, html.q .mjinfo, html.q .wscore, html.q .wpot, html.q .dyfish, html.q .dypl, html.q .dyhint, html.q .tlab .tn, html.q .tag {
  border: 2px solid var(--q-ink) !important; box-shadow: 0 2px 0 var(--q-ink) !important; }
html.q .wcount { border: 2px solid var(--q-ink) !important; box-shadow: 0 2px 0 var(--q-ink) !important; }

/* ---------- 大字：卡通描边金字（标题、牌型横幅、飘字） ---------- */
html.q .gtitle, html.q .fx-title, html.q .hr-title, html.q .dyfloat, html.q .wvs b, html.q .mjfx b, html.q .dyrhead b, html.q .sheethead b {
  color: #ffe066 !important; -webkit-text-fill-color: #ffe066 !important; background: none !important;
  -webkit-text-stroke: 2px var(--q-ink); paint-order: stroke fill; text-shadow: 0 3px 0 var(--q-ink) !important; filter: none !important; }
html.q .fx-title, html.q .hr-title { -webkit-text-stroke-width: 3px; }
/* 上面给牌加了描边，钓鱼「能钓的鱼」和钓到时的发光要单独保留 */
html.q .dyp.catch .card { box-shadow: 0 0 0 2.5px var(--q-gold), 0 0 0 4px var(--q-ink), 0 0 16px rgba(255, 210, 80, 1) !important; }
html.q .dyghost.glow .card { box-shadow: 0 0 0 2.5px #fff3c4, 0 0 0 4px var(--q-ink), 0 0 22px rgba(255, 210, 90, 1) !important; }