/* ================= 顶栏声音图标 + 小面板（js/core/sound-ui.js） =================
   面板用 .panel 材质、开关用 .seg（components.css），这里只补位置、行距和音量推子 */
.snd-btn{padding:0 9px;}
.snd-btn .ic{width:16px;height:16px;}
.snd-btn.off{color:var(--cream-500);}
.snd-btn.open{border-color:var(--brass-700);color:var(--brass-100);}

.snd-pop{position:fixed;z-index:40;width:236px;padding:4px 14px;display:none;}
.snd-pop.on{display:block;}
.snd-pop::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--brass-100),transparent);opacity:.5;}
.snd-row{display:flex;align-items:center;justify-content:space-between;gap:12px;height:46px;border-bottom:1px solid var(--hairline);}
.snd-row:last-child{border-bottom:0;}
.snd-row>span{font-size:13px;color:var(--cream-300);letter-spacing:.06em;white-space:nowrap;}
.snd-row .seg button{height:28px;padding:0 13px;}
.snd-vn{font-family:var(--serif);font-weight:400;font-size:14px;color:var(--brass-100);min-width:26px;text-align:right;
  font-variant-numeric:tabular-nums lining-nums;}

/* 音量推子：黄铜推子帽 + 嵌进去的槽，已开的那段是黄铜色 */
.snd-vol{-webkit-appearance:none;appearance:none;flex:1;min-width:0;height:22px;margin:0;background:transparent;cursor:pointer;}
.snd-vol:focus{outline:none;}
.snd-vol:focus-visible{outline:1px solid var(--brass-500);outline-offset:3px;}
.snd-vol::-webkit-slider-runnable-track{height:4px;border-radius:2px;border:1px solid var(--brass-900);
  background:linear-gradient(90deg,var(--brass-500) 0,var(--brass-500) var(--p,80%),#0c0806 var(--p,80%));box-shadow:0 1px 2px rgba(0,0,0,.6) inset;}
.snd-vol::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:18px;margin-top:-8px;border-radius:2px;
  border:1px solid var(--brass-700);background:linear-gradient(180deg,var(--brass-100),var(--brass-300) 45%,var(--brass-500));
  box-shadow:0 1px 3px rgba(0,0,0,.7);}
.snd-vol::-moz-range-track{height:4px;border-radius:2px;border:1px solid var(--brass-900);background:#0c0806;}
.snd-vol::-moz-range-progress{height:4px;border-radius:2px;background:var(--brass-500);}
.snd-vol::-moz-range-thumb{width:10px;height:18px;border-radius:2px;border:1px solid var(--brass-700);
  background:linear-gradient(180deg,var(--brass-100),var(--brass-300) 45%,var(--brass-500));box-shadow:0 1px 3px rgba(0,0,0,.7);}

/* 手机：横屏（牌桌都是横屏）顶栏只剩图标，声音键放得下；竖屏（大厅 / 收银台）顶栏已经满了，375 宽会把抽屉键挤出屏幕，竖屏不放 */
html.m #topbar .btn.snd-btn:not(.m-x) > svg.ic{display:inline-block;}
html.m #topbar .snd-btn.btn{padding:0 10px;}
html.m.m-port #topbar .snd-btn.btn,html.m.m-port .snd-pop{display:none;}