.upgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:.6rem;margin-top:.9rem}
.upgrid:empty{display:none}
.uptile{position:relative;display:flex;align-items:center;gap:.75rem;min-width:0;padding:.7rem .8rem;background:#fff;border:1px solid #e3dccf;border-radius:12px;box-shadow:0 1px 2px rgba(40,30,20,.05);text-align:left;font:inherit;color:#1c1917;transition:border-color .15s,box-shadow .15s}
.uptile:hover{border-color:#cdbfa6;box-shadow:0 6px 18px -12px rgba(40,30,20,.35)}
.uptile__type{flex:none;display:grid;place-items:center;width:38px;height:44px;border-radius:7px;color:#fff;font:700 .62rem/1 Arial,Helvetica,sans-serif;letter-spacing:.04em}
.uptile__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15rem}
.uptile__name{font-size:.88rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uptile__status{font-size:.74rem;color:#6b6459}
.uptile--error{border-color:#efb7ad;background:#fff7f5}
.uptile--error .uptile__status{color:#a4442e}
.uptile--done .uptile__status{color:#3f6b3f}
.upring{flex:none;width:28px;height:28px}
.upring svg{width:28px;height:28px;display:block;transform:rotate(-90deg)}
.upring circle{fill:none;stroke-width:2.6}
.upring__bg{stroke:#ebe4d8}
.upring__fg{stroke:#947c56;stroke-linecap:round;transition:stroke-dashoffset .25s ease}
.upring--wait .upring__fg{opacity:.35}
.upring--done svg,.upring--err svg{transform:none}
.upring--done circle{fill:#3f7a45;stroke:#3f7a45}
.upring--done path{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;animation:updraw .35s ease-out both}
.upring--err circle{fill:#b4432f;stroke:#b4432f}
.upring--err path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round}
@keyframes updraw{from{stroke-dasharray:24;stroke-dashoffset:24}to{stroke-dasharray:24;stroke-dashoffset:0}}
.uptile__x{position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:999px;border:1px solid #e3dccf;background:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .15s;box-shadow:0 2px 6px rgba(40,30,20,.15)}
.uptile__x svg{width:12px;height:12px;stroke:#1c1917;stroke-width:1.8;stroke-linecap:round}
.uptile:hover .uptile__x,.uptile__x:focus-visible{opacity:1}
@media (hover:none){.uptile__x{opacity:1}}
.uptile__btn{flex:none;border:1px solid #b4432f;background:#fff;color:#a4442e;border-radius:8px;padding:.3rem .6rem;font:600 .74rem/1 inherit;cursor:pointer}
.uptile--add{cursor:pointer;border-style:dashed;background:transparent;box-shadow:none;color:#6b6459}
.uptile--add:hover{border-color:#947c56;color:#1c1917}
.uptile__plus{flex:none;display:grid;place-items:center;width:38px;height:44px;border-radius:7px;background:#f3eee5;font-size:1.4rem;color:#947c56}
.upnote{margin:.6rem 0 0;font-size:.82rem;color:#a4442e}
.updraft{margin:0 0 1rem;padding:.65rem .9rem;border-left:3px solid #947c56;background:#fff;font-size:.85rem;color:#1c1917}
label[for="files"].is-drag{outline:2px dashed #947c56;outline-offset:4px}