/* Generated square plates become caps. No hit target or interaction changes. */
html[data-buttons="cast"] {
  --cap-image:var(--cap-rest);
  --cap-rest:url('./materials/buttons/cast-rest.png');
  --cap-on:url('./materials/buttons/cast-on.png');
  --cap-selected:url('./materials/buttons/cast-selected.png');
  --cap-disabled:url('./materials/buttons/cast-disabled.png');
}
html[data-buttons="steel"] {
  --cap-image:var(--cap-rest);
  --cap-rest:url('./materials/buttons/steel-rest.png');
  --cap-on:url('./materials/buttons/steel-on.png');
  --cap-selected:url('./materials/buttons/steel-selected.png');
  --cap-disabled:url('./materials/buttons/steel-disabled.png');
}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button) {
  background:transparent!important;
  clip-path:none!important;
  border:0!important;
  box-shadow:none!important;
  color:#eee6ce;
  text-shadow:0 1px #20231c;
  translate:none;
}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button)::before {
  inset:0 0 2px;
  background:none;
  border:8px solid transparent;
  border-image:var(--cap-image) 4 fill / 8px / 0 stretch;
  clip-path:none!important;
  box-shadow:none!important;
  image-rendering:pixelated;
  pointer-events:none;
}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button)::after {
  content:'';
  position:absolute;
  inset:2px 0 0;
  background:#1a1d18;
  clip-path:polygon(0 6px,2px 6px,2px 2px,6px 2px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 2px) calc(100% - 6px),calc(100% - 2px) calc(100% - 2px),calc(100% - 6px) calc(100% - 2px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 6px),0 calc(100% - 6px));
  z-index:-2;
  pointer-events:none;
}
html:is([data-buttons="cast"],[data-buttons="steel"]) .toggle[aria-pressed="true"],
html:is([data-buttons="cast"],[data-buttons="steel"]) #identity-form #save-editor {--cap-image:var(--cap-on);color:#fff0ce}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(#parts button[aria-current="true"],.tone-tab[aria-selected="true"]) {--cap-image:var(--cap-selected)}
html:is([data-buttons="cast"],[data-buttons="steel"]) #parts button>span {color:#c2c3ad;border-color:#43493d}
html:is([data-buttons="cast"],[data-buttons="steel"]) #parts button[aria-current="true"] i {color:#e5b874}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle[aria-pressed="true"],#parts button[aria-current="true"],.tone-tab[aria-selected="true"])::before,
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button):active:not(:disabled)::before {inset:2px 0 0}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button):hover:not(:disabled)::before {filter:brightness(1.08)}
html:is([data-buttons="cast"],[data-buttons="steel"]) :is(.toggle,.tone-tab,.hardware-choice,.visual-action,.unit-art button,#parts button,#identity-form button,#menu-button,#unit-menu button,.unit-switcher button):focus-visible {outline:2px solid #e7c58e;outline-offset:2px}
html:is([data-buttons="cast"],[data-buttons="steel"]) .toggle:disabled {--cap-image:var(--cap-disabled);color:#b9bba9;text-shadow:none;cursor:not-allowed}
html:is([data-buttons="cast"],[data-buttons="steel"]) .toggle:disabled::before {inset:2px 0 0;filter:none}

html:is([data-buttons="cast"],[data-buttons="steel"]) .hardware-choice:is(:has(input:checked),[aria-current="true"]){--cap-image:var(--cap-selected);color:#ffd28a}