.corner-button{--corner-button-cut-size:10px;--corner-button-cut:var(--corner-button-cut-size);--corner-button-border:1px;isolation:isolate;background:var(--accent);color:var(--accent);cursor:pointer;border:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.corner-button:before{--corner-button-cut:calc(var(--corner-button-cut-size) - .5858 * var(--corner-button-border));z-index:-1;inset:var(--corner-button-border);background:color-mix(in srgb, var(--paper), transparent 16%);content:"";transition:background .25s;position:absolute}.corner-button[data-corner=top-left],.corner-button[data-corner=top-left]:before{clip-path:polygon(var(--corner-button-cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--corner-button-cut))}.corner-button[data-corner=top-right],.corner-button[data-corner=top-right]:before{clip-path:polygon(0 0, calc(100% - var(--corner-button-cut)) 0, 100% var(--corner-button-cut), 100% 100%, 0 100%)}.corner-button[data-corner=bottom-left],.corner-button[data-corner=bottom-left]:before{clip-path:polygon(0 0, 100% 0, 100% 100%, var(--corner-button-cut) 100%, 0 calc(100% - var(--corner-button-cut)))}.corner-button[data-corner=bottom-right],.corner-button[data-corner=bottom-right]:before{clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--corner-button-cut)), calc(100% - var(--corner-button-cut)) 100%, 0 100%)}.corner-button:hover:before{background:var(--accent)}.corner-button:hover{color:var(--paper)}.corner-button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.corner-button:disabled{cursor:default;opacity:.55}.corner-button-content{justify-content:center;align-items:center;display:inline-flex}