/* Dark panels follow the Bilibili layout supplied by the user. */
.xplayer-feature-dialog.layui-layer{max-width:calc(100vw - 24px);background:rgba(34,34,34,.96);color:#eee;border-radius:4px;box-shadow:none;font:14px/1.5 Arial,"Microsoft YaHei",sans-serif;overflow:hidden}
.xplayer-feature-dialog .layui-layer-title{height:42px;line-height:42px;text-align:center;padding:0 36px;background:transparent;border-bottom:1px solid #ffffff12;color:#eee;font-size:16px;font-weight:600}
.xplayer-feature-dialog .layui-layer-setwin{top:12px;right:14px}
.xplayer-feature-dialog .layui-layer-close1{background:none!important;width:18px;height:18px}
.xplayer-feature-dialog .layui-layer-close1:before{content:'×';display:block;color:#eee;font:27px/18px Arial;text-align:center}
.xplayer-feature-dialog .layui-layer-content{padding:18px 12px!important;max-height:calc(100vh - 165px);overflow:auto!important}
.xplayer-report-dialog .layui-layer-content{color:#eee;text-align:center;overflow-wrap:anywhere}
.xplayer-report-dialog .layui-layer-btn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px!important}
.xplayer-report-dialog .layui-layer-btn a{min-width:0;margin:0;padding:0 4px;height:32px;line-height:32px;background:#656565;color:#eee}
.xplayer-report-dialog .layui-layer-btn a:hover{background:var(--xplayer-theme,#00aeec)}
.xplayer-feature-dialog .layui-layer-btn{position:relative;padding:17px 12px!important;text-align:center;border-top:1px solid #ffffff12}
.xplayer-feature-dialog .layui-layer-btn a{min-width:76px;height:27px;line-height:27px;margin:0 5px;padding:0 14px;border:0;border-radius:0;background:#656565;color:#eee;font-size:13px;font-weight:400}
.xplayer-feature-dialog .layui-layer-btn a:hover,.xplayer-feature-dialog .btn-panel-box-btn:hover{background:#787878;color:#fff}
.xplayer-feature-content{color:#eee;font-size:14px;line-height:1.8;text-align:left}
.xplayer-feature-content [hidden]{display:none!important}
.xplayer-feature-row{display:flex;align-items:center;gap:9px;min-height:34px;margin:0}
.xplayer-feature-label{flex:none;min-width:4em}
.xplayer-feature-row input[type=range]{appearance:none;display:block;flex:1;min-width:0;height:2px;padding:0;margin:0;background:linear-gradient(to right,#00aeec 0 var(--range-fill,50%),#555 var(--range-fill,50%) 100%);cursor:pointer}
.xplayer-feature-row input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#00aeec;border:0;border-radius:50%}
.xplayer-feature-row input[type=range]::-moz-range-thumb{width:12px;height:12px;background:#00aeec;border:0;border-radius:50%}
.xplayer-feature-value{width:30px;flex:none;text-align:right;font-size:12px}
.xplayer-range-limit{font-size:12px;white-space:nowrap}
.xplayer-gain-track{position:relative;display:flex;align-items:center;flex:1;min-width:0}
.xplayer-gain-track input[type=range]{width:100%}
.xplayer-gain-tooltip{position:absolute;bottom:15px;transform:translateX(-50%);min-width:24px;padding:1px 5px;border-radius:3px;background:#151515;color:#fff;text-align:center;font:13px/18px Arial;pointer-events:none;white-space:nowrap}
.xplayer-feature-row select{flex:1;min-width:0;height:28px;padding:0 7px;box-sizing:border-box;border:1px solid #777;background:#444;color:#eee}
.xplayer-feature-dialog .btn-panel-box{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 42px;padding:2px 8px 14px;margin:0}
.xplayer-feature-dialog .btn-panel-box-btn{display:block;box-sizing:border-box;width:100%;height:26px;padding:0 5px;margin:0;cursor:pointer;background:#656565;border:0;color:#eee;font:13px/26px Arial,"Microsoft YaHei",sans-serif;white-space:nowrap}
.xplayer-feature-dialog .btn-panel-box-btn.selected{background:#00aeec;color:#fff}
.xplayer-feature-dialog button:disabled,.xplayer-feature-dialog input:disabled,.xplayer-feature-dialog select:disabled{opacity:.45;cursor:default}
.xplayer-feature-message{margin:10px 0 0;font-size:12px;line-height:1.6;color:#bbb}
.xplayer-feature-message:empty{display:none}
.xplayer-feature-dialog .xplayer-audio-custom{position:absolute;right:16px;bottom:10px;border:0;background:transparent;color:#eee;text-decoration:underline;cursor:pointer;font:13px/22px Arial,"Microsoft YaHei",sans-serif;padding:0}
.xplayer-shortcut-row{display:flex;justify-content:space-between;gap:20px;margin:0 10px;white-space:nowrap}
.xplayer-shortcut-row span:last-child{color:#aaa}
@media(max-width:380px){.xplayer-feature-dialog .btn-panel-box{gap:14px 18px}.xplayer-feature-row{gap:6px}.xplayer-range-limit{font-size:10px}}
@media(pointer:coarse){.xplayer-video-wrap{touch-action:none}}

/* The equalizer is a separate view matching the reference audio panel. */
.xplayer-equalizer-dialog.layui-layer{background:rgba(27,27,27,.9);border-radius:6px}
.xplayer-equalizer-dialog .layui-layer-content{padding:0!important;max-height:calc(100vh - 100px)}
.xplayer-equalizer-panel{font-size:18px;line-height:1.4}
.xplayer-eq-header{display:flex;align-items:center;gap:20px;height:68px;padding:0 24px;border-bottom:1px solid #ffffff12;box-sizing:border-box}
.xplayer-eq-header button{border:0;background:none;color:#eee;padding:0;cursor:pointer;font:inherit}
.xplayer-eq-back{flex:none;text-decoration:underline;font-weight:600!important;margin-right:auto}
.xplayer-eq-select-label,.xplayer-eq-count-label{display:flex;align-items:center;gap:10px;white-space:nowrap;font-weight:600}
.xplayer-eq-select-label select,.xplayer-eq-count-label select{height:35px;box-sizing:border-box;border:1px solid #ffffff30;border-radius:3px;background:transparent;color:#eee;font:inherit;padding:0 22px 0 10px;text-align:center;cursor:pointer}
.xplayer-eq-select-label select{width:148px}
.xplayer-eq-count-label{margin-left:auto}
.xplayer-eq-count-label select{width:91px}
.xplayer-eq-header select option{background:#303030;color:#eee;font-size:15px}
.xplayer-eq-close{flex:none;font:36px/30px Arial!important;margin-left:-8px}
.xplayer-eq-chart{display:grid;grid-template-columns:34px minmax(0,1fr);gap:20px;padding:32px 30px 14px}
.xplayer-eq-scale{height:232px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;font-size:18px;line-height:1}
.xplayer-eq-scale span:first-child{transform:translateY(-2px)}
.xplayer-eq-scale span:last-child{transform:translateY(2px)}
.xplayer-eq-bands{display:grid;grid-template-columns:repeat(var(--eq-band-count,10),minmax(0,1fr));gap:12px}
.xplayer-eq-band{display:flex;min-width:0;align-items:center;flex-direction:column;gap:14px;font-size:17px;line-height:22px}
.xplayer-eq-track{height:232px;display:flex;align-items:center;justify-content:center;width:26px}
.xplayer-eq-track input[type=range]{writing-mode:vertical-lr;direction:rtl;appearance:none;width:22px;height:232px;padding:0;margin:0;background:transparent;cursor:pointer;touch-action:none;outline:none}
.xplayer-eq-track input[type=range]::-webkit-slider-runnable-track{width:3px;height:100%;background:linear-gradient(to top,#00aeec 0 var(--eq-fill,50%),#555 var(--eq-fill,50%) 100%);border-radius:2px}
.xplayer-eq-track input[type=range]::-webkit-slider-thumb{appearance:none;width:20px;height:20px;background:#00aeec;border:0;border-radius:50%;margin-left:-8.5px}
.xplayer-eq-track input[type=range]::-moz-range-track{width:3px;height:100%;background:linear-gradient(to top,#00aeec 0 var(--eq-fill,50%),#555 var(--eq-fill,50%) 100%);border:0;border-radius:2px}
.xplayer-eq-track input[type=range]::-moz-range-thumb{width:20px;height:20px;background:#00aeec;border:0;border-radius:50%}
.xplayer-eq-track input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #ffffff55}
.xplayer-equalizer-dialog .layui-layer-btn{padding:14px!important}
.xplayer-equalizer-dialog .layui-layer-btn a{height:40px;line-height:40px;min-width:130px;font-size:18px;margin:0}
.xplayer-equalizer-panel>.xplayer-feature-message{margin:0 24px 12px;font-size:12px}
@media(max-width:680px){.xplayer-eq-header{height:56px;padding:0 16px;gap:12px}.xplayer-equalizer-panel{font-size:14px}.xplayer-eq-select-label,.xplayer-eq-count-label{gap:6px}.xplayer-eq-select-label select{width:108px}.xplayer-eq-count-label select{width:70px}.xplayer-eq-select-label select,.xplayer-eq-count-label select{height:30px;padding:0 5px}.xplayer-eq-close{font-size:30px!important;margin-left:0}.xplayer-eq-chart{grid-template-columns:28px minmax(0,1fr);gap:10px;padding:24px 18px 13px}.xplayer-eq-bands{gap:5px}.xplayer-eq-band{font-size:12px}.xplayer-eq-scale{font-size:14px}}
@media(max-width:430px){.xplayer-eq-header{padding:0 10px;gap:8px}.xplayer-equalizer-panel{font-size:12px}.xplayer-eq-select-label select{width:81px}.xplayer-eq-count-label select{width:56px}.xplayer-eq-close{font-size:25px!important}.xplayer-eq-chart{padding-left:10px;padding-right:10px;gap:6px}.xplayer-eq-bands{gap:2px}.xplayer-eq-track,.xplayer-eq-track input[type=range],.xplayer-eq-scale{height:180px}.xplayer-eq-track input[type=range]::-webkit-slider-thumb{width:14px;height:14px;margin-left:-5.5px}.xplayer-eq-track input[type=range]::-moz-range-thumb{width:14px;height:14px}.xplayer-equalizer-dialog .layui-layer-btn a{min-width:100px;height:32px;line-height:32px;font-size:15px}}

/* Both audio views occupy the same stable frame, including on smaller viewports. */
.xplayer-audio-dialog.layui-layer,.xplayer-equalizer-dialog.layui-layer{display:flex;flex-direction:column;container-type:inline-size}
.xplayer-audio-dialog .layui-layer-title,.xplayer-audio-dialog .layui-layer-btn,.xplayer-equalizer-dialog .layui-layer-btn{flex:none}
.xplayer-audio-dialog .layui-layer-content,.xplayer-equalizer-dialog .layui-layer-content{flex:1;min-height:0;height:auto!important;max-height:none;box-sizing:border-box}
.xplayer-audio-dialog .layui-layer-content{display:flex;align-items:center;justify-content:center}
.xplayer-audio-panel{width:100%;box-sizing:border-box}
.xplayer-equalizer-panel{height:100%;display:flex;flex-direction:column;font-size:14px}
.xplayer-eq-header{height:56px;flex:none;padding:0 16px;gap:12px}
.xplayer-eq-select-label,.xplayer-eq-count-label{gap:6px}
.xplayer-eq-select-label select,.xplayer-eq-count-label select{height:30px;padding:0 5px}
.xplayer-eq-select-label select{width:108px}
.xplayer-eq-count-label select{width:70px}
.xplayer-eq-close{font-size:30px!important;margin-left:0}
.xplayer-eq-chart{flex:1;min-height:0;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:22px 20px 12px}
.xplayer-eq-scale{height:auto;min-height:0;margin-bottom:32px;font-size:14px}
.xplayer-eq-bands{min-height:0;gap:5px}
.xplayer-eq-band{min-height:0;font-size:13px;gap:10px}
.xplayer-eq-track{flex:1;min-height:0;height:auto}
.xplayer-eq-track input[type=range]{height:100%;min-height:0}
.xplayer-eq-frequency{height:22px;line-height:22px;flex:none}
.xplayer-equalizer-panel>.xplayer-feature-message{flex:none}
.xplayer-audio-dialog .layui-layer-btn,.xplayer-equalizer-dialog .layui-layer-btn{box-sizing:border-box;height:62px;padding:14px!important}
.xplayer-audio-dialog .layui-layer-btn a,.xplayer-equalizer-dialog .layui-layer-btn a{height:32px;line-height:32px;min-width:100px;font-size:15px;margin:0}
@container(max-width:430px){.xplayer-equalizer-panel{font-size:12px}.xplayer-eq-header{padding:0 10px;gap:8px}.xplayer-eq-select-label select{width:81px}.xplayer-eq-count-label select{width:56px}.xplayer-eq-close{font-size:25px!important}.xplayer-eq-chart{padding-left:10px;padding-right:10px;gap:6px}.xplayer-eq-bands{gap:2px}.xplayer-eq-band{font-size:12px}.xplayer-eq-track input[type=range]::-webkit-slider-thumb{width:14px;height:14px;margin-left:-5.5px}.xplayer-eq-track input[type=range]::-moz-range-thumb{width:14px;height:14px}}