.control-bar{
  display: grid;
  grid-template-columns: 1.5fr 1.2fr 150px;
  background: var(--input-bg);
  border: 1px solid var(--border);
  margin-bottom: 16px;
}
.control-bar label{
  display:flex; flex-direction:column; gap:3px;
  padding: 10px 16px 12px;
  border-left: 1px solid var(--border);
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--label);
  transition: background-color 0.15s ease;
}
.control-bar label:first-child{ border-left: 0; }
.control-bar label:focus-within{ background: #24292E; box-shadow: inset 0 -2px 0 var(--green); }
.control-bar .opt{ text-transform: none; letter-spacing: 0; font-weight: 400; }
.control-bar input{
  background: transparent; border: 0; outline: none;
  color: var(--text); font-family: inherit; font-size: 14.5px;
  width: 100%; padding: 0; margin-top: 2px;
}
.control-bar input::placeholder{ color: var(--label); }

.field-error{
  margin: 0 0 14px;
  font-family: var(--mono); font-size: 12.5px; color: var(--red);
}
@keyframes shake{
  0%,100%{ transform: translateX(0); }
  25%{ transform: translateX(-4px); }
  75%{ transform: translateX(4px); }
}
.shake{ animation: shake 0.28s ease; }

.stamp-block{ margin: 0 0 30px; }
.stamp-row{ display:flex; gap: 10px; }
.stamp-row input{
  flex: 1; font-family: inherit; font-size: 14px;
  padding: 10px 14px; border: 1px solid var(--border-soft); border-radius: 6px;
  background: var(--input-bg); color: var(--text);
}
.stamp-row input::placeholder{ color: var(--label); }
.stamp-row input:focus{ outline: none; border-color: var(--green); }
.hint{
  display:block; min-height: 18px; margin: 6px 2px 0;
  font-family: var(--mono); font-size: 11.5px; color: var(--muted);
}

.gen-row{
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap: 16px 24px;
  margin-bottom: 30px;
}
.os-block{ display:flex; align-items:center; gap: 14px; flex-wrap: wrap; }
.os-label{ font-size: 12px; color: var(--label); font-weight: 500; }
.os-options{ display:flex; align-items:center; gap: 8px; }
.os-btn{
  display:flex; align-items:center; gap: 7px;
  padding: 8px 14px; border-radius: 6px;
  border: 1px solid var(--border-soft); background: var(--input-bg);
  color: var(--muted); cursor: pointer;
  font-family: inherit; font-size: 13px; font-weight: 500;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.os-btn:hover{ color: var(--text); border-color: var(--muted); }
.os-btn svg{ width: 16px; height: 16px; display:block; }
.os-btn.active{ border-color: var(--green); color: var(--text); background: #10291A; }
.badge{ font-size: 11.5px; color: var(--green); font-weight: 500; }

@media (max-width: 760px){
  .control-bar{ grid-template-columns: 1fr; }
  .control-bar label{ border-left: 0; border-top: 1px solid var(--border); }
  .control-bar label:first-child{ border-top: 0; }
  .gen-row{ flex-direction: column; align-items: flex-start; }
  .stamp-row{ flex-direction: column; }
}
