.note{align-items:flex-start;gap:var(--sp-3);border:1px solid var(--line);border-radius:var(--r-card);background:var(--canvas);color:var(--ink);padding-block:12px;padding-inline:14px;font-size:15px;line-height:22px;display:flex}.note:lang(ar){line-height:26px}.note-icon{width:20px;height:20px;color:var(--ink-2);stroke-width:1.75px;flex:none;margin-block-start:1px}.note:lang(ar) .note-icon{margin-block-start:3px}.note-body{flex:1;min-width:0}.note-title{margin:0;font-weight:600}.note-title+.note-text{color:var(--ink-2);margin-block-start:2px}.note-text>p+p{margin-block-start:var(--sp-2)}.note-action{flex:none;align-self:center}.note[data-tone=success]{border-color:var(--success-line);background:var(--success-tint)}.note[data-tone=success] .note-icon{color:var(--success)}.note[data-tone=warning]{border-color:var(--warning-line);background:var(--warning-tint)}.note[data-tone=warning] .note-icon{color:var(--warning)}.note[data-tone=error]{border-color:var(--error-line);background:var(--error-tint)}.note[data-tone=error] .note-icon,.note[data-tone=error] .note-title{color:var(--error)}@media (max-width:479px){.note{flex-wrap:wrap}.note-action{flex-basis:100%;padding-inline-start:32px}}.empty{justify-items:center;gap:var(--sp-2);max-width:460px;padding-block:var(--sp-7);padding-inline:var(--sp-5);text-align:center;margin-inline:auto;display:grid}.empty[data-align=start]{text-align:start;justify-items:start;margin-inline:0}.empty[data-framed=true]{border:1px dashed var(--line-strong);border-radius:var(--r-card);max-width:none;margin-inline:0}.empty-icon{width:44px;height:44px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--paper);color:var(--ink);place-items:center;margin-block-end:var(--sp-2);display:grid}.empty-icon svg{stroke-width:1.75px;width:22px;height:22px}.empty-title{margin:0;font-size:17px;font-weight:600;line-height:24px}.empty-desc{max-width:56ch;color:var(--ink-2);text-wrap:pretty;margin:0;font-size:15px;line-height:22px}.empty-desc:lang(ar){line-height:26px}.empty-action{justify-content:center;gap:var(--sp-2);flex-wrap:wrap;margin-block-start:var(--sp-3);display:flex}.skel{background:var(--tint);border-radius:4px;max-inline-size:100%;display:block}.skel-text{width:100%;display:grid}.loading{width:100%}