/* Solid console surface in the existing theme palette. */
html[data-theme] .player-card{
 background-color:var(--g-paper);
 background-image:none;
 image-rendering:pixelated;
}
html[data-theme] .player-card::before,html[data-theme] .player-card::after{content:none}
.case-corners{position:absolute;inset:9px;pointer-events:none;z-index:1}
.case-corners i{position:absolute;width:12px;height:12px;border-top:2px solid var(--g-line);border-left:2px solid var(--g-line)}
.case-corners i::after{content:'';position:absolute;top:3px;left:3px;width:4px;height:4px;background:var(--g-metal);box-shadow:1px 1px 0 var(--g-shadow),inset 1px 1px 0 var(--key-top)}
.case-corners i:nth-child(1){top:0;left:0}
.case-corners i:nth-child(2){top:0;right:0;transform:rotate(90deg)}
.case-corners i:nth-child(3){bottom:0;right:0;transform:rotate(180deg)}
.case-corners i:nth-child(4){bottom:0;left:0;transform:rotate(270deg)}
html[data-theme] .now-display{
 background:var(--g-inset);
 border:3px double var(--g-metal);
 box-shadow:0 -1px 0 var(--g-line),0 1px 0 var(--key-top),inset 3px 3px 0 var(--g-shadow),inset 5px 5px 0 var(--g-panel),inset -2px -2px 0 var(--g-paper);
}
html[data-theme] .now{font-size:28px;line-height:1.4;margin-top:8px;text-shadow:1px 1px 0 var(--g-panel)}
html[data-theme] .display-line{letter-spacing:0;color:var(--g-muted)}
html[data-theme] .panel-heading{box-shadow:inset 0 1px 0 var(--key-top)}
html[data-theme] .seek{
 background:repeating-linear-gradient(90deg,var(--g-panel) 0 8px,var(--g-inset) 8px 11px);
 box-shadow:inset 0 2px 0 var(--g-metal),0 1px 0 var(--key-top);
}
html[data-theme] .seek #progress{background:repeating-linear-gradient(90deg,var(--g-accent) 0 8px,transparent 8px 11px)}
html[data-theme] .visualizer{gap:3px}
html[data-theme] .visualizer i{width:8px;flex:none;background:var(--g-accent);mask-image:repeating-linear-gradient(0deg,#000 0 4px,transparent 4px 6px)}
html[data-theme] .pixel-range::-webkit-slider-runnable-track{background:repeating-linear-gradient(90deg,var(--g-panel) 0 8px,var(--g-inset) 8px 11px);border-color:var(--g-line);box-shadow:inset 0 1px 0 var(--g-metal),0 1px 0 var(--key-top)}
html[data-theme] .pixel-range::-moz-range-track{background:repeating-linear-gradient(90deg,var(--g-panel) 0 8px,var(--g-inset) 8px 11px);border-color:var(--g-line);box-shadow:inset 0 1px 0 var(--g-metal),0 1px 0 var(--key-top)}
html[data-theme] .art{
 --corner-ink:var(--g-metal);
 border:1px solid transparent;
 background-color:var(--g-inset);
 background-image:linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink)),linear-gradient(var(--corner-ink),var(--corner-ink));
 background-size:16px 2px,2px 16px,16px 2px,2px 16px,16px 2px,2px 16px,16px 2px,2px 16px;
 background-position:left top,left top,right top,right top,right bottom,right bottom,left bottom,left bottom;
 background-repeat:no-repeat;
}
/* Icon-only keys use equal padding and whole two-pixel SVG cells. */
html[data-theme][data-button-style=reliquary] .player-card :is(.transport button,.curse-step,.mute-button,.theme-toggle){padding:4px;display:grid;place-items:center}
html[data-theme][data-button-style=reliquary] .player-card :is(.transport button,.curse-step,.mute-button,.theme-toggle) :is(.pixel-icon,.theme-icon){display:block;width:24px;height:24px;flex:none}
html[data-theme] .player-card .settings-icon{width:24px;height:24px;flex:none}
html[data-theme] #themeToggle[aria-pressed=true] .theme-icon{transform:translateX(1px)}
html[data-theme] .track-slot{position:relative;line-height:1;align-self:center}
@media(max-width:740px){
 html[data-theme] .now{font-size:28px}
 .case-corners{inset:8px}
}
@media(max-width:360px){html[data-theme] .now{font-size:26px}}