
/* Shared blue controls: machined face, recessed edge and tactile press. */
html body .button{
 position:relative;isolation:isolate;
 background:linear-gradient(165deg,#6197ff 0%,#387bff 38%,#2e68df 76%,#2453b9 100%);
 border:1px solid #76a5ff;border-bottom-color:#173d88;
 color:#fff;text-shadow:0 1px 1px #102b6555;
 box-shadow:inset 0 1px 0 #c5dbff88,inset 1px 0 0 #8db7ff44,inset 0 -5px 0 #163b8f,inset 0 -6px 0 #89adff55,0 5px 12px #0004;
 transition:transform 140ms ease,box-shadow 140ms ease,filter 140ms ease;
 transform:translateY(0);font-weight:600;
}
html body .button::before{content:"";position:absolute;inset:1px 2px 6px;border-radius:inherit;border-top:1px solid #dce9ff55;pointer-events:none;z-index:-1}
@media(hover:hover){html body .button:not(:disabled):not([aria-disabled="true"]):hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:inset 0 1px 0 #d6e5ffaa,inset 1px 0 0 #8db7ff55,inset 0 -6px 0 #163b8f,inset 0 -7px 0 #89adff55,0 7px 16px #0005}}
html body .button:not(:disabled):not([aria-disabled="true"]):active{transform:translateY(2px);filter:brightness(.98);box-shadow:inset 0 1px 3px #163b8f88,inset 0 -2px 0 #163b8f,0 1px 3px #0004}
html body .button:focus-visible{outline:3px solid #bfd6ff;outline-offset:4px;box-shadow:inset 0 0 0 2px #f2f7ff,inset 0 -5px 0 #163b8f}
html body .button:disabled,html body .button[aria-disabled="true"]{filter:saturate(.45);opacity:.6;transform:none;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){html body .button{transition:none}html body .button:not(:disabled):hover,html body .button:not(:disabled):active{transform:none}}
@media(forced-colors:active){html body .button{background:ButtonFace;color:ButtonText;border:2px solid ButtonText;box-shadow:none;text-shadow:none}.button::before{display:none}}
