@layer components{.x-confirm{--confirm-danger:var(--danger);z-index:30;box-sizing:border-box;padding:calc(var(--pad) * 2);pointer-events:auto;background:var(--scrim);animation:x-confirm-backdrop-in var(--motion-view) ease both;place-items:center;display:grid;position:absolute;inset:0}.x-confirm-card{box-sizing:border-box;width:min(18.5em,100%);padding:calc(var(--pad) * 1.8);border:1px solid var(--line-soft);border-radius:var(--menu-radius);color:var(--fg);background:var(--surface-dialog);box-shadow:var(--shadow-float);text-align:left;transform-origin:50%;animation:x-confirm-card-in var(--motion-view) var(--ease-enter) both}.x-confirm .x-confirm-card h2{opacity:1;margin:0;font-family:inherit;font-size:1em;font-style:normal;font-weight:700;line-height:1.2}.x-confirm-message{gap:calc(var(--pad) * .45);margin:calc(var(--pad) * 1.05) 0 0;color:color-mix(in oklch, var(--fg), transparent 26%);font-size:.9em;line-height:1.45;display:grid}.x-confirm-name{color:var(--fg);overflow-wrap:anywhere;font-weight:700}.x-confirm-actions{gap:calc(var(--pad) * .65);margin-top:calc(var(--pad) * 1.55);grid-template-columns:1fr 1fr;display:grid}.x-confirm-button{width:100%;padding:calc(var(--pad) * .75) calc(var(--pad) * 1.25);border:1px solid var(--line-soft);color:var(--fg);background:var(--surface-control);font:inherit;cursor:pointer;transition:color var(--motion-fast) ease, background var(--motion-fast) ease, border-color var(--motion-fast) ease, transform var(--motion-fast) var(--ease-sticky);border-radius:999px;font-size:.88em;font-weight:700;transform:translateY(0)scale(1)}.x-confirm-button:first-child{color:color-mix(in oklch, var(--fg), transparent 12%);background:color-mix(in srgb, var(--surface-control) 72%, transparent)}.x-confirm-button:is(:hover,:focus-visible){border-color:color-mix(in oklch, var(--fg), transparent 60%);background:var(--surface-message);transform:translateY(var(--motion-hover-y)) scale(1.01);outline:none}.x-confirm-button:active{transform:translateY(var(--motion-press-y)) scale(var(--motion-press-scale))}.x-confirm-button[data-tone=danger]{border-color:color-mix(in srgb, var(--confirm-danger) 78%, transparent);color:var(--fg);background:color-mix(in srgb, var(--confirm-danger) 34%, var(--surface-message))}.x-confirm-button[data-tone=danger]:is(:hover,:focus-visible){border-color:var(--confirm-danger);background:color-mix(in srgb, var(--confirm-danger) 44%, var(--surface-message))}@keyframes x-confirm-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes x-confirm-card-in{0%{opacity:0;transform:translateY(var(--motion-entrance-y)) scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}}