/* Raised controls inspired by the reference. All colors follow theme-tokens.css.
   Shared inset highlights and contact shadows keep small controls legible;
   primary actions get the larger, softly colored outer glow. */
:is(body,#app-dialog) :where(button,a.button,a.icon-button,a.text-button){
 --button-fill:var(--theme-surface);
 --button-glow:color-mix(in srgb,var(--theme-accent) 9%,transparent);
 --button-radius:var(--theme-button-radius);
 background-image:linear-gradient(180deg,color-mix(in srgb,var(--button-fill) 88%,var(--theme-highlight)),var(--button-fill) 48%,color-mix(in srgb,var(--button-fill) 88%,var(--theme-shadow)))!important;
 box-shadow:inset 0 1px 0 var(--theme-button-highlight),inset 0 -2px 0 var(--theme-button-lower-edge),0 1px 2px var(--theme-button-contact-shadow),0 8px 24px -6px var(--button-glow)!important;
 border-radius:var(--button-radius);
 transition:background-color .16s,color .16s,box-shadow .16s,transform .12s;
}
:is(body,#app-dialog) :is(.button-primary,.rail-create,.swap-submit){
 --button-fill:var(--theme-accent);
 --button-glow:var(--theme-button-glow);
 color:var(--theme-on-accent);
}
:is(body,#app-dialog) :is(.discover-tabs button.active,.discover-view-toggle button[aria-pressed=true],.tabs button.active,.swap-periods button[aria-pressed=true]){
 --button-fill:color-mix(in srgb,var(--theme-accent) 18%,var(--theme-surface));
 --button-glow:color-mix(in srgb,var(--theme-accent) 16%,transparent);
}
:is(body,#app-dialog) .swap-sides button[aria-pressed=true]{--button-fill:var(--theme-accent);--button-glow:var(--theme-button-glow)}
:is(body,#app-dialog) .live-order[data-swap-direction=sell] :is(.swap-submit,.swap-sides button[aria-pressed=true]){
 --button-fill:var(--theme-negative);--button-glow:color-mix(in srgb,var(--theme-negative) 32%,transparent);
}
:is(body,#app-dialog) :is(button.text-button,a.text-button){padding:6px 10px;min-height:30px}
.desktop-nav button,.footer-links button{padding:6px 10px;min-height:30px}
:is(body,#app-dialog) :is(.rail-toggle,.dialog-close){--button-radius:50%}
:is(body,#app-dialog) :is(button,a.button,a.icon-button,a.text-button):hover:not(:disabled):not([aria-disabled=true]){
 box-shadow:inset 0 1px 0 var(--theme-button-highlight),inset 0 -2px 0 var(--theme-button-lower-edge),0 2px 3px var(--theme-button-contact-shadow),0 10px 26px -6px var(--button-glow)!important;
}
:is(body,#app-dialog) :is(button,a.button,a.icon-button,a.text-button):active:not(:disabled):not([aria-disabled=true]){
 transform:translateY(1px)!important;
 box-shadow:inset 0 1px 3px var(--theme-button-lower-edge),inset 0 -1px 0 var(--theme-shine),0 1px 2px var(--theme-button-contact-shadow)!important;
}
:is(body,#app-dialog) :is(button:disabled,[aria-disabled=true]){
 box-shadow:inset 0 1px 0 var(--theme-shine),inset 0 -1px 0 var(--theme-button-lower-edge)!important;
}
@media(prefers-reduced-motion:reduce){:is(body,#app-dialog) :is(button,a.button,a.icon-button,a.text-button){transition:none}}
.reduce-motion :is(button,a.button,a.icon-button,a.text-button){transition:none!important}
/* Sidebar menu actions share the flat navigation-link treatment. */
:is(body,#app-dialog) #app-sidebar nav>button{
 background-image:none!important;
 box-shadow:none!important;
 transform:none!important;
 border-radius:7px;
}