body {
  margin: 0;
  font-family: -apple-system, system-ui, sans-serif;
  background: var(--tg-theme-bg-color, #fff);
  color: var(--tg-theme-text-color, #000);
}
nav { display: flex; }
nav button {
  flex: 1; padding: 12px; border: none; font-size: 15px;
  background: var(--tg-theme-secondary-bg-color, #f0f0f0);
  color: var(--tg-theme-hint-color, #777);
}
nav button.active {
  background: var(--tg-theme-bg-color, #fff);
  color: var(--tg-theme-text-color, #000);
  font-weight: 600;
}
section { padding: 12px; }
#search, label input, #save, #run {
  width: 100%; box-sizing: border-box; padding: 10px; margin: 6px 0;
  border: 1px solid var(--tg-theme-hint-color, #ccc); border-radius: 8px;
  background: var(--tg-theme-bg-color, #fff);
  color: var(--tg-theme-text-color, #000);
  font-size: 15px;
}
label { display: block; margin-top: 10px; font-size: 14px; }
label.inline { display: flex; align-items: center; gap: 8px; }
label.inline input[type="checkbox"] { width: 18px; height: 18px; margin: 0; }
ul { list-style: none; padding: 0; }
li {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 4px; border-bottom: 1px solid var(--tg-theme-secondary-bg-color, #eee);
}
li input[type="checkbox"] { width: 22px; height: 22px; }
#save, #run {
  background: var(--tg-theme-button-color, #2ea6ff);
  color: var(--tg-theme-button-text-color, #fff);
  border: none; margin-top: 16px;
}
#toast {
  position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
  background: rgba(0, 0, 0, .8); color: #fff; padding: 10px 16px;
  border-radius: 8px; font-size: 14px;
}
