/* GIF 拆分帧 */
.gc-drop{position:relative;display:flex;align-items:center;justify-content:center;min-height:15rem;padding:1rem;
  border:2px dashed #d7dce5;border-radius:.75rem;background:#fafbfd;cursor:pointer;text-align:center;
  transition:border-color .2s,background-color .2s}
.gc-drop:hover,.gc-drop.hover,.gc-drop:focus{border-color:var(--site-primary);background:var(--site-tint);outline:0}
.gc-drop-hint i{display:block;margin-bottom:.5rem;color:var(--site-primary);font-size:2.5rem;line-height:1}
.gc-drop-hint p{font-size:.9375rem}
.gc-preview{display:block;max-width:100%;max-height:20rem;border-radius:.5rem;box-shadow:0 1px 6px rgba(16,24,40,.12)}

.gs-info{margin-top:1rem;padding:.75rem .875rem;border:1px solid #eef1f5;border-radius:.5rem;background:#fafbfd;
  font-size:.8125rem;color:#5c636a;display:flex;flex-wrap:wrap;gap:.35rem 1.25rem}
.gs-info b{font-weight:600;color:#1d2939}

.gs-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.gs-frame{padding:.5rem;border:1px solid #eef1f5;border-radius:.6rem;background:#fff;text-align:center}
.gs-thumb{display:flex;align-items:center;justify-content:center;min-height:6.5rem;padding:.3rem;border-radius:.5rem;
  background:linear-gradient(45deg,#f7f8fa 25%,transparent 25%,transparent 75%,#f7f8fa 75%),
             linear-gradient(45deg,#f7f8fa 25%,#fff 25%,#fff 75%,#f7f8fa 75%);
  background-size:16px 16px;background-position:0 0,8px 8px}
.gs-thumb img{display:block;max-width:100%;max-height:13rem;height:auto;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.gs-name{margin-top:.4rem;font-size:.75rem;color:#4d5259;word-break:break-all}
.gs-size{color:#a7b0bb;font-size:.6875rem}

@media (max-width:575.98px){
  .gs-grid{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr))}
}