/* buttons: existing family composition and intentional responsive variants. */
:root,
.light,
body.light {
  --button-bordered-black-color: #000;
  --button-bordered-black-hover: rgb(0 0 0 / 0.05);
}

:root.dark,
.dark,
body.dark {
  --button-bordered-black-color: #fff;
  --button-bordered-black-hover: rgb(255 255 255 / 0.05);
}

@media (prefers-color-scheme: dark) {
  :root:not(.light) {
    --button-bordered-black-color: #fff;
    --button-bordered-black-hover: rgb(255 255 255 / 0.05);
  }}

.button--bordered-black {
  border-color: var(--button-bordered-black-color, #000);
  color: var(--button-bordered-black-color, #000);
}

.button--bordered-black:hover {
  background-color: var(--button-bordered-black-hover, rgb(0 0 0 / 0.05));
}

/* Shared button appearance and interaction states.
   Markup/API: partials/blocks/button.hbs. Glass surfaces: primitives.css.
   Hero geometry: hero-card.css. */
.fs-button:is(.fs-button--primary,.fs-button--secondary) {
 min-height: 44px; box-sizing: border-box; gap: .5rem; max-width: 100%;
 border: 1px solid transparent; border-radius: var(--fs-radius-pill);
 font: inherit; font-weight: var(--fs-weight-medium,500); line-height: 1.4;
 text-align: center; text-decoration: none; white-space: normal;
}
.fs-button--primary { background: var(--accent); color: var(--accent-foreground); }
.fs-button--secondary { background: var(--muted); color: var(--foreground); }
.fs-button:is(.fs-button--primary,.fs-button--secondary):hover { opacity: .9; text-decoration: none; }
:is(button,a).fs-icon-button {
 display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;
 width:var(--fs-control-size);height:var(--fs-control-size);min-width:44px;min-height:44px;
 padding:0;border:1px solid transparent;border-radius:var(--fs-radius-pill);background:transparent;color:inherit;font:inherit;cursor:pointer;
}
:is(button,a).fs-icon-button:hover:where(:not(:disabled):not([aria-disabled="true"])) { background:color-mix(in srgb,currentColor 8%,transparent); }
.fs-button,.fs-button--glass,.fs-icon-button {
 transition-property:background-color,border-color,color,box-shadow,opacity,transform;
 transition-duration:var(--fs-motion-micro);transition-timing-function:var(--fs-motion-ease-standard);
}
.fs-button:focus-visible,.fs-button--glass:focus-visible,.fs-icon-button:focus-visible { outline:2px solid var(--accent);outline-offset:var(--fs-space-1); }
:is(button,a).fs-icon-button:is(:active,[aria-expanded="true"],[aria-pressed="true"]) { border-color:var(--accent); }
:is(.fs-button,.fs-button--glass,.fs-icon-button):is(:disabled,[aria-disabled="true"]) { opacity:.5;cursor:not-allowed; }
@media(prefers-reduced-motion:reduce){
 .fs-button,.fs-button--glass,.fs-icon-button { transition:none; }
}

/* Viewer close button appearance; glass surface remains authoritative, geometry stays in viewer.css. */
.work-case-player__close { display: block; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--border); border-radius: var(--fs-radius-pill); background: var(--background); color: inherit; font: inherit; cursor: pointer; }