.hgpw-file-control{
  position:relative;
  display:grid;
  gap:12px;
  min-height:56px;
  padding:12px;
  border:1px solid var(--hgpw-form-input-border,#cbd7e1);
  border-radius:10px;
  background:var(--hgpw-form-input-bg,#fff);
}

.hgpw-file-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}

.hgpw-file-trigger,.hgpw-file-status,.hgpw-file-error,.hgpw-file-list{display:none}

.hgpw-js .hgpw-file-input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-height:0!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
}

.hgpw-js .hgpw-file-trigger{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 17px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--soft2);
  color:var(--ink);
  font:inherit;
  font-weight:650;
  line-height:1;
  cursor:pointer;
  transition:border-color .16s ease,color .16s ease,background-color .16s ease,opacity .16s ease;
}

.hgpw-file-trigger:hover:not(.is-disabled){border-color:var(--brand);color:var(--brand);background:#f4fafc}

.hgpw-file-trigger:focus-visible,.hgpw-file-remove:focus-visible{outline:3px solid rgba(42,113,143,.24);outline-offset:2px}

.hgpw-file-trigger.is-disabled{cursor:not-allowed;opacity:.55}

.hgpw-js .hgpw-file-status{
  display:inline;
  min-width:0;
  color:var(--muted);
  font-size:calc(var(--hgpw-body-size,15.5px) - 1px);
  font-weight:560;
  overflow-wrap:anywhere;
}

.hgpw-file-control.has-files .hgpw-file-status{color:var(--ink);font-weight:620}

.hgpw-js .hgpw-file-error{
  display:block;
  margin:0;
  padding:10px 12px;
  border:1px solid #c74444;
  border-radius:8px;
  background:#fff5f5;
  color:#8f1f1f;
  font-size:14px;
  line-height:1.45;
}

.hgpw-js .hgpw-file-error[hidden]{display:none}

.hgpw-file-control.has-error{border-color:#c74444}

.hgpw-js .hgpw-file-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.hgpw-file-list:empty{display:none}

.hgpw-file-item{
  display:grid;
  grid-template-columns:56px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-width:0;
  padding:9px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#fbfdfe;
}

.hgpw-file-preview{
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:8px;
  background:#edf5f8;
  color:var(--brand2);
  font-size:11px;
  font-weight:750;
  letter-spacing:.04em;
}

.hgpw-file-preview img{display:block;width:100%;height:100%;object-fit:cover}

.hgpw-file-preview.is-file-icon{padding:4px;text-align:center;overflow-wrap:anywhere}

.hgpw-file-details{display:grid;gap:3px;min-width:0}

.hgpw-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font-weight:620}

.hgpw-file-size{color:var(--muted);font-size:13px}

.hgpw-file-remove{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:74px;
  min-height:44px;
  padding:0 12px;
  border:1px solid #d5a7a7;
  border-radius:8px;
  background:#fff;
  color:#9a2d2d;
  font:inherit;
  font-size:14px;
  font-weight:650;
  cursor:pointer;
}

.hgpw-file-remove:hover{border-color:#a83a3a;background:#fff6f6}

.hgpw-file-item-native{display:block;color:var(--ink);overflow-wrap:anywhere}

.hgpw-file-control.uses-native-file-picker .hgpw-file-list{margin-top:2px}

@media(max-width:720px){
  .hgpw-file-actions{align-items:stretch;flex-direction:column}
  .hgpw-js .hgpw-file-trigger{width:100%;min-height:48px}
  .hgpw-file-item{grid-template-columns:48px minmax(0,1fr) auto;gap:10px;padding:8px}
  .hgpw-file-preview{width:48px;height:48px}
  .hgpw-file-remove{min-width:68px;padding:0 10px}
}

@media(max-width:399px){
  .hgpw-file-item{grid-template-columns:48px minmax(0,1fr)}
  .hgpw-file-remove{grid-column:1/-1;width:100%}
}

.hgpw-file-native-notice{
  margin:0;
  padding:10px 12px;
  border:1px solid #d8e2e8;
  border-radius:8px;
  background:#f7fafc;
  color:var(--muted,#657381);
  font-size:14px;
  line-height:1.5;
}
.hgpw-file-native-notice[hidden]{display:none}
.hgpw-file-control.uses-native-file-picker .hgpw-file-trigger{background:#fff}