.loading-spinner{display:inline-block;flex:none;width:21px;height:21px;border:2px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:orbit-loading-spin .8s linear infinite}
@keyframes orbit-loading-spin{to{transform:rotate(360deg)}}
button.is-loading{cursor:wait;position:relative}
button.is-loading::before{content:'';display:inline-block;flex:none;width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:orbit-loading-spin .8s linear infinite}
button.is-loading>.icon{display:none}
.operation-feedback,.form-loading{display:flex;align-items:flex-start;gap:12px;background:var(--surface);color:var(--ink);border:1px solid var(--border);border-radius:12px;padding:15px 17px;text-align:left;line-height:1.5}
.operation-feedback{position:fixed;bottom:20px;right:20px;z-index:160;width:360px;max-width:calc(100vw - 32px);box-shadow:0 8px 30px #0002;pointer-events:none}
.operation-feedback>div,.form-loading>div{min-width:0}
.operation-feedback strong,.form-loading strong{display:block;font-size:14px;font-weight:700}
.operation-feedback p,.form-loading p{font-size:13px;color:var(--muted);margin:4px 0;overflow-wrap:anywhere}
.operation-feedback small,.form-loading small{display:block;font-size:12px;color:var(--muted)}
.operation-feedback .loading-spinner,.form-loading .loading-spinner{margin-top:3px}
.form-loading{margin-top:14px;background:var(--bg);width:100%;grid-column:1/-1}
.boot .loading-spinner{margin-top:16px;width:25px;height:25px}
@media(max-width:600px){.operation-feedback{right:16px;bottom:16px;padding:12px 14px;width:calc(100vw - 32px)}.form-loading{padding:12px}}
@media(prefers-reduced-motion:reduce){.loading-spinner,button.is-loading::before{animation:none}}