.phone-main {
  max-width: 480px;
  margin: 0 auto;
  padding: 1rem 16px calc(2rem + env(safe-area-inset-bottom));
  display: grid;
  gap: 1.25rem;
}
.phone-head { display: flex; justify-content: space-between; align-items: center; }
.brand { font-weight: 600; color: var(--ink-2); }
.phone-main h1 { font-size: 1.9rem; }
.phone-main h2 { font-size: 1.2rem; }
.options { display: grid; gap: 0.75rem; }
.btn-option { font-size: 1.3rem; min-height: 72px; }
.feedback { color: var(--ink-2); min-height: 1.5em; margin: 0; }

.controls { display: grid; grid-template-columns: 1fr 2fr; gap: 0.75rem; }
.notes {
  white-space: pre-line;
  background: var(--card);
  border-radius: var(--radius);
  padding: 1rem;
  font-size: 1.05rem;
}
.notes:empty { display: none; }
.question, .toggles, .danger { display: grid; gap: 0.5rem; }
.counts, .latest { margin: 0; padding-left: 1.2rem; }
.switch { display: flex; gap: 0.5rem; align-items: center; min-height: 44px; }
.switch input { width: 22px; height: 22px; accent-color: var(--green); }

form { display: grid; gap: 0.75rem; }
label { font-weight: 600; }
input[type="password"] {
  font: inherit;
  min-height: 48px;
  padding: 0 0.75rem;
  border-radius: var(--radius);
  border: 1px solid var(--line-2);
  background: var(--card);
}
