/* Additions for the static (browser-only) build. Base styles come from style.css. */
.icon-btn { padding: 6px 10px; }
.settings {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  padding: 10px 16px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  color: var(--muted);
}
.settings[hidden] { display: none; }
.settings label { display: flex; align-items: center; gap: 6px; }
.settings #proxy { width: 340px; max-width: 70vw; font-family: var(--mono); font-size: 12px; }
.settings #delay { width: 80px; }
.settings .hint { flex-basis: 100%; margin: 0; }
.settings code { font-family: var(--mono); color: var(--accent); }
body:has(.settings:not([hidden])) { grid-template-rows: auto auto 1fr; }

.side-actions { display: flex; gap: 2px; }
.list li .del { margin-left: auto; opacity: 0; padding: 0 6px; }
.list li:hover .del, .list li .del:focus-visible { opacity: 1; }
.list .row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.empty-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 6px; }

@media (max-width: 860px) {
  body:has(.settings:not([hidden])) { grid-template-rows: auto auto auto; }
  .list li .del { opacity: 1; }
}