:root {
  --ink:#173a39;
  --muted:#718483;
  --teal:#0e7b77;
  --mint:#dff4ed;
  --cream:#f7faf8;
  --line:#dbe6e2;
  --red:#de6a65;
  --white:#fff;
  --shadow:0 20px 70px rgba(19,58,56,.10)
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"DM Sans",sans-serif;
  min-height:100vh;
  overflow-x:hidden
}
.ambient {
  position:fixed;
  border-radius:50%;
  filter:blur(2px);
  opacity:.45;
  pointer-events:none;
  z-index:-1
}
.ambient-a {
  width:420px;
  height:420px;
  background:#dff5ec;
  top:-190px;
  right:-120px
}
.ambient-b {
  width:320px;
  height:320px;
  background:#f6e8d8;
  left:-190px;
  bottom:-130px
}
.topbar {
  height:76px;
  max-width:1440px;
  margin:auto;
  padding:0 42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(23,58,57,.08)
}
.brand {
  display:flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
  color:var(--ink);
  font:700 18px Manrope
}
.brand b {
  color:var(--teal)
}
.brand-mark {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:12px;
  background:var(--teal);
  color:white;
  font:800 18px Manrope;
  box-shadow:0 7px 18px rgba(14,123,119,.22)
}
.top-actions,.secure {
  display:flex;
  align-items:center;
  gap:18px
}
.secure {
  font-size:12px;
  color:var(--muted);
  gap:7px
}
.secure i {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#42b88c;
  box-shadow:0 0 0 4px #dff4eb
}
.ghost,.icon-btn {
  border:1px solid var(--line);
  background:rgba(255,255,255,.66);
  border-radius:10px;
  color:var(--ink);
  padding:9px 14px;
  cursor:pointer
}
.ghost:hover,.icon-btn:hover {
  background:white;
  border-color:#bdd1ca
}
main {
  max-width:1440px;
  margin:auto;
  padding:42px
}
.intro {
  display:flex;
  align-items:end;
  justify-content:space-between;
  margin:0 auto 28px;
  max-width:1310px
}
.intro h1 {
  font:800 clamp(36px,4vw,58px)/1.04 Manrope;
  margin:8px 0 0;
  letter-spacing:-2.5px
}
.intro h1 em {
  font-style:normal;
  color:var(--teal)
}
.intro>p {
  max-width:410px;
  color:var(--muted);
  font-size:15px;
  line-height:1.65;
  margin:0 5px 5px
}
.eyebrow,.section-label {
  font:700 10px/1.2 Manrope;
  letter-spacing:1.7px;
  color:var(--teal)
}
.workspace {
  display:grid;
  grid-template-columns:170px minmax(460px,1fr) 355px;
  gap:18px;
  max-width:1310px;
  margin:auto
}
.steps {
  padding:22px 0
}
.step {
  position:relative;
  display:flex;
  gap:12px;
  align-items:center;
  padding:11px 0;
  color:#9badaa
}
.step:not(:nth-child(3)):after {
  content:"";
  position:absolute;
  height:18px;
  border-left:1px dashed #c8d8d4;
  left:15px;
  top:43px
}
.step>span {
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  border-radius:50%;
  border:1px solid #cddbd7;
  font:700 11px Manrope;
  background:var(--cream)
}
.step b {
  display:block;
  font-size:13px
}
.step small {
  font-size:10px;
  color:#a0aeac
}
.step.active {
  color:var(--ink)
}
.step.active>span {
  background:var(--teal);
  color:white;
  border-color:var(--teal);
  box-shadow:0 5px 15px rgba(14,123,119,.2)
}
.trust {
  margin-top:90px;
  padding:15px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.5);
  font-size:10px;
  line-height:1.45;
  color:var(--muted)
}
.trust span {
  color:var(--teal);
  font-size:17px
}
.trust p {
  margin:5px 0
}
.trust b {
  color:var(--ink)
}
.viewer-card,.form-card {
  background:rgba(255,255,255,.87);
  border:1px solid rgba(209,224,219,.85);
  border-radius:20px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(12px)
}
.viewer-card {
  padding:20px;
  display:flex;
  flex-direction:column;
  min-height:650px
}
.viewer-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 2px 12px
}
.viewer-head span {
  color:#a2b0ae;
  font:600 9px Manrope;
  letter-spacing:1.4px
}
.viewer-head h2 {
  font:700 18px Manrope;
  margin:4px 0
}
.icon-btn {
  font-size:20px;
  width:37px;
  height:37px;
  padding:0
}
#mouth3d {
  position:relative;
  flex:1;
  min-height:430px;
  overflow:hidden;
  border-radius:15px;
  background:radial-gradient(circle at 50% 46%,#fbfdfc 0,#f1f8f5 56%,#e7f2ee 100%)
}
#mouth3d canvas {
  display:block;
  width:100%;
  height:100%
}
.loading {
  position:absolute;
  inset:0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  color:var(--muted);
  font-size:12px;
  z-index:2
}
.loading span {
  width:17px;
  height:17px;
  border-radius:50%;
  border:2px solid #b9d9cf;
  border-top-color:var(--teal);
  animation:spin .8s linear infinite
}
@keyframes spin {
  to {
    transform:rotate(360deg)
  }
}
.hint {
  position:absolute;
  bottom:15px;
  left:50%;
  transform:translateX(-50%);
  background:rgba(255,255,255,.85);
  border:1px solid var(--line);
  box-shadow:0 5px 16px rgba(23,58,57,.07);
  border-radius:20px;
  padding:8px 13px;
  font-size:10px;
  color:var(--muted);
  white-space:nowrap;
  pointer-events:none;
  transition:.3s
}
.hint span {
  color:var(--teal)
}
.tooth-tag {
  display:none;
  position:absolute;
  padding:6px 9px;
  border-radius:7px;
  background:var(--ink);
  color:white;
  font-size:10px;
  pointer-events:none;
  transform:translate(10px,-28px)
}
.view-controls {
  display:flex;
  justify-content:center;
  gap:6px;
  margin:12px 0
}
.view {
  border:0;
  border-radius:8px;
  padding:7px 11px;
  background:transparent;
  color:var(--muted);
  font:600 10px Manrope;
  cursor:pointer
}
.view.active {
  background:var(--mint);
  color:var(--teal)
}
.selected-bar {
  display:flex;
  align-items:center;
  gap:9px;
  background:#f4f8f6;
  border-radius:10px;
  padding:10px 13px;
  font-size:11px;
  color:var(--muted)
}
.selected-bar .pulse {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#b7c5c1
}
.selected-bar.has-selection .pulse {
  background:var(--teal);
  box-shadow:0 0 0 4px #d9eee8
}
.selected-bar button {
  margin-left:auto;
  border:0;
  background:none;
  color:var(--teal);
  font-size:10px;
  cursor:pointer
}
.form-card {
  padding:22px;
  max-height:650px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:#d4e3df transparent
}
.report-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px
}
.report-head h2 {
  margin:5px 0 0;
  font:700 18px Manrope
}
#reportLimit {
  border-radius:20px;
  padding:7px 10px;
  background:var(--mint);
  color:var(--teal);
  font:700 11px Manrope
}
.report-empty {
  min-height:180px;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:8px;
  border:1px dashed #c8d8d3;
  border-radius:14px;
  color:#78908b;
  text-align:center;
  line-height:1.55
}
.report-empty span {
  font-size:25px;
  color:var(--teal)
}
.report-items {
  display:grid;
  gap:10px;
  margin-bottom:18px
}
.report-item {
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--line);
  border-left:4px solid var(--teal);
  border-radius:12px;
  padding:12px;
  background:#f8fbfa
}
.report-item div {
  min-width:0;
  flex:1
}
.report-item strong {
  display:block;
  font:700 13px/1.35 Manrope
}
.report-item p {
  margin:5px 0 0;
  color:var(--muted);
  font-size:11px;
  line-height:1.45
}
.report-item button,.danger-action {
  border:0;
  background:transparent;
  color:var(--teal);
  font-weight:700;
  cursor:pointer
}
.tooth-dialog {
  width:min(610px,calc(100% - 28px))
}
.tooth-situation {
  border:1px solid var(--line);
  border-radius:12px;
  margin:0 0 20px;
  padding:12px 14px
}
.tooth-situation legend {
  color:var(--teal);
  font:700 10px Manrope;
  letter-spacing:1px;
  padding:0 5px
}
.tooth-situation label {
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:8px 0;
  cursor:pointer
}
.tooth-situation input {
  flex:0 0 20px;
  min-height:20px
}
.tooth-situation b,.tooth-situation small {
  display:block
}
.tooth-situation b {
  font-size:13px
}
.tooth-situation small {
  color:var(--muted);
  margin-top:3px;
  line-height:1.4
}
.tooth-dialog-actions {
  display:grid;
  grid-template-columns:auto auto 1fr;
  align-items:center;
  gap:8px;
  margin-top:20px
}
.danger-action {
  color:#a33b3b;
  padding:10px
}
.summary-item+.summary-item {
  border-top:1px solid var(--line);
  margin-top:14px;
  padding-top:14px
}

/* Leitura confortável, especialmente para pacientes idosos. */
.tooth-dialog {
  font-size:16px;
  line-height:1.5
}
.tooth-dialog .eyebrow,
.tooth-dialog .section-label,
.tooth-situation legend {
  font-size:14px;
  letter-spacing:.7px
}
.tooth-dialog .dialog-sub {
  font-size:17px;
  line-height:1.5
}
.tooth-dialog .label-row small {
  font-size:14px
}
.tooth-dialog .chips button {
  font-size:16px;
  line-height:1.35;
  min-height:58px;
  padding:12px 10px
}
.tooth-dialog .tooth-situation b {
  font-size:16px
}
.tooth-dialog .tooth-situation small {
  font-size:15px
}
.tooth-dialog .field output {
  font-size:16px
}
.tooth-dialog .range-labels,
.tooth-dialog .counter {
  font-size:14px
}
.tooth-dialog select,
.tooth-dialog textarea,
.tooth-dialog .ghost,
.tooth-dialog .danger-action,
.tooth-dialog .primary {
  font-size:16px
}
.report-item strong {
  font-size:15px
}
.report-item p,
.report-item button {
  font-size:14px
}
.form-section {
  padding:0 0 18px;
  margin-bottom:18px;
  border-bottom:1px solid #e7eeeb
}
.form-section.compact {
  border:0;
  margin:0;
  padding:0
}
.tooth-empty {
  margin-top:11px;
  border:1px dashed #c8d8d3;
  border-radius:11px;
  padding:16px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:11px;
  color:#9badab;
  text-align:center;
  font-size:11px;
  line-height:1.4
}
.tooth-empty span {
  font-size:18px;
  color:#90aaa3
}
.tooth-selected {
  margin-top:11px;
  display:flex;
  gap:12px;
  align-items:center;
  background:#edf7f3;
  border-radius:11px;
  padding:12px
}
.mini-tooth {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  background:white;
  border-radius:10px;
  color:var(--teal);
  font-size:24px
}
.tooth-selected strong,.tooth-selected small {
  display:block
}
.tooth-selected strong {
  font:700 14px Manrope
}
.tooth-selected small {
  color:var(--muted);
  font-size:10px;
  margin-top:3px
}
.label-row {
  display:flex;
  justify-content:space-between;
  align-items:center
}
.label-row small,.section-label small {
  letter-spacing:0;
  color:#9baba8;
  font:500 9px DM Sans
}
.symptoms.disabled,.compact.disabled {
  opacity:.38;
  pointer-events:none
}
.chips {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:12px
}
.chips button {
  display:flex;
  align-items:center;
  gap:7px;
  border:1px solid var(--line);
  border-radius:9px;
  background:white;
  padding:9px;
  text-align:left;
  color:#57706d;
  font:500 10px DM Sans;
  cursor:pointer;
  transition:.17s
}
.chips button span {
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:6px;
  background:#f0f6f4;
  color:var(--teal)
}
.chips button:hover {
  border-color:#94c8bb
}
.chips button.active {
  background:#e9f7f2;
  border-color:#52aa98;
  color:var(--ink);
  font-weight:600
}
.chips button.active span {
  background:var(--teal);
  color:white
}
.field {
  margin-bottom:15px
}
.field .section-label {
  display:block;
  margin-bottom:9px
}
.field output {
  font:700 10px Manrope;
  color:var(--teal)
}
input[type=range] {
  width:100%;
  accent-color:var(--teal)
}
.range-labels {
  display:flex;
  justify-content:space-between;
  color:#9aaba7;
  font-size:8px
}
select,textarea {
  width:100%;
  border:1px solid var(--line);
  border-radius:9px;
  padding:10px;
  background:white;
  color:var(--ink);
  font:11px DM Sans;
  outline:none
}
select:focus,textarea:focus {
  border-color:#79b9aa;
  box-shadow:0 0 0 3px #e7f5f1
}
textarea {
  height:58px;
  resize:vertical;
  padding-right:38px
}
.field:has(textarea) {
  position:relative
}
.counter {
  position:absolute;
  right:8px;
  bottom:7px;
  font-size:8px;
  color:#9baba8
}
.counter b {
  font-weight:500
}
.primary,.whatsapp {
  width:100%;
  border:0;
  border-radius:11px;
  background:var(--teal);
  color:white;
  padding:13px 16px;
  font:700 11px Manrope;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(14,123,119,.2);
  transition:.2s
}
.primary {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px
}
.primary span {
  font-size:16px
}
.primary:hover:not(:disabled) {
  background:#096b68;
  transform:translateY(-1px)
}
.primary:disabled {
  background:#c5d2cf;
  box-shadow:none;
  cursor:not-allowed
}
.how {
  max-width:760px;
  margin:35px auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px
}
.how div {
  display:flex;
  align-items:center;
  gap:10px
}
.how div>span {
  font:800 24px Manrope;
  color:#d0ded9
}
.how p {
  font-size:10px;
  color:var(--muted);
  line-height:1.5
}
.how b {
  color:var(--ink);
  font-size:11px
}
.how i {
  width:55px;
  border-top:1px dashed #b7ccc6
}
.medical-note {
  max-width:920px;
  margin:0 auto 15px;
  text-align:center;
  font-size:10px;
  line-height:1.5;
  color:#829390
}
dialog {
  width:min(540px,calc(100% - 28px));
  border:0;
  border-radius:20px;
  padding:30px;
  color:var(--ink);
  box-shadow:0 30px 100px rgba(10,40,39,.28)
}
dialog::backdrop {
  background:rgba(15,44,43,.48);
  backdrop-filter:blur(4px)
}
dialog h2 {
  font:800 28px Manrope;
  margin:8px 0 4px
}
.dialog-sub {
  color:var(--muted);
  font-size:12px
}
.dialog-close {
  position:absolute;
  right:18px;
  top:15px;
  border:0;
  background:none;
  font-size:27px;
  color:#8a9a97;
  cursor:pointer
}
.summary-card {
  margin:20px 0;
  background:#f3f8f6;
  border-radius:14px;
  padding:18px;
  font-size:12px;
  line-height:1.65
}
.summary-card h3 {
  font:700 14px Manrope;
  margin:0 0 10px
}
.summary-card b {
  color:var(--teal)
}
.summary-card .symptom-list {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:9px 0
}
.summary-card .symptom-list span {
  background:white;
  border:1px solid var(--line);
  padding:5px 8px;
  border-radius:7px;
  font-size:10px
}
.share-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px
}
.whatsapp {
  background:#25a866;
  box-shadow:none
}
.privacy-note {
  font-size:9px;
  text-align:center;
  color:#93a19f;
  margin:14px 15px 0;
  line-height:1.5
}
@media(max-width:1080px) {
  .workspace {
    grid-template-columns:1fr 340px
  }
  .steps {
    display:none
  }
  .intro {
    align-items:start
  }
  .viewer-card {
    min-height:620px
  }
}
@media(max-width:790px) {
  .topbar {
    padding:0 18px
  }
  .secure {
    display:none
  }
  main {
    padding:25px 14px
  }
  .intro {
    display:block
  }
  .intro h1 {
    font-size:37px;
    letter-spacing:-1.7px
  }
  .intro>p {
    margin-top:16px
  }
  .workspace {
    display:block
  }
  .viewer-card {
    min-height:530px
  }
  .form-card {
    margin-top:14px;
    max-height:none
  }
  .viewer-card #mouth3d {
    min-height:350px
  }
  .how {
    gap:10px
  }
  .how i {
    width:18px
  }
  .share-actions {
    grid-template-columns:1fr
  }
}
@media(max-width:430px) {
  .chips {
    grid-template-columns:1fr
  }
  .viewer-card {
    padding:13px
  }
  .viewer-card #mouth3d {
    min-height:310px
  }
  .how {
    display:none
  }
  .medical-note {
    margin-top:26px
  }
  .brand {
    font-size:15px
  }
  .tooth-dialog {
    width:100%;
    max-width:none;
    margin:auto 0 0;
    border-radius:22px 22px 0 0;
    max-height:88dvh
  }
  .tooth-dialog-actions {
    grid-template-columns:1fr 1fr
  }
  .tooth-dialog-actions .danger-action {
    grid-column:1/-1;
    order:3
  }
}
/* Acabamento responsivo: mantém a identidade e a geometria aprovadas. */ [hidden] {
  display: none !important;
}
button, input, select, textarea {
  font: inherit;
}
button, select, input[type="range"] {
  min-height: 44px;
}
:focus-visible {
  outline: 3px solid #268d80;
  outline-offset: 3px;
}
.workspace {
  grid-template-columns: 155px minmax(0, 1fr) 370px;
  align-items: start;
}
.intro > p {
  font-size: 16px;
}
.eyebrow, .section-label {
  font-size: 12px;
  letter-spacing: .9px;
  line-height: 1.5;
}
.label-row {
  gap: 10px;
  flex-wrap: wrap;
}
.label-row small, .section-label small {
  font-size: 12px;
}
.step b {
  font-size: 14px;
}
.step small, .trust, .secure {
  font-size: 12px;
}
.viewer-card {
  min-width: 0;
  min-height: 700px;
}
.viewer-head h2 {
  font-size: 18px;
}
.viewer-head span {
  font-size: 12px;
}
#mouth3d {
  flex: none;
  height: 430px;
  min-height: 0;
}
#mouth3d canvas {
  touch-action: none;
}
.hint {
  font-size: 12px;
  white-space: normal;
  text-align: center;
  width: max-content;
  max-width: calc(100% - 20px);
}
.view-controls {
  gap: 4px;
}
.view {
  font-size: 12px;
  padding: 8px;
  flex: 1;
}
.selected-bar {
  font-size: 12px;
  line-height: 1.5;
  min-height: 52px;
}
.selected-bar .pulse {
  flex: 0 0 7px;
}
.selected-bar button {
  font-size: 12px;
}
.tooth-picker {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}
.tooth-picker label {
  font-size: 14px;
  font-weight: 600;
}
.tooth-picker small {
  font-size: 12px;
  color: #57706d;
}
.tooth-picker select {
  max-width: 100%;
  text-overflow: ellipsis;
}
.form-card {
  max-height: none;
  padding: 24px;
}
.form-section {
  padding-bottom: 20px;
  margin-bottom: 20px;
}
.chips {
  gap: 8px;
}
.chips button {
  font-size: 14px;
  padding: 10px 8px;
  line-height: 1.35;
  min-height: 54px;
}
.chips button span {
  flex: 0 0 20px;
}
.tooth-empty {
  font-size: 14px;
}
.tooth-selected strong {
  font-size: 16px;
}
.tooth-selected small {
  font-size: 12px;
}
.field output {
  font-size: 14px;
}
select, textarea, #shareLink {
  font-size: 16px;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 12px;
  background: white;
  color: var(--ink);
  width: 100%;
}
textarea {
  min-height: 96px;
  padding-bottom: 24px;
}
.range-labels, .counter {
  font-size: 12px;
}
.counter {
  bottom: 12px;
  right: 12px;
}
.primary, .whatsapp {
  font-size: 14px;
  min-height: 48px;
  line-height: 1.5;
}
.form-footnote {
  font-size: 12px;
  line-height: 1.6;
  color: #57706d;
  margin: 14px 0 0;
}
.how p, .how b {
  font-size: 14px;
}
.medical-note {
  font-size: 12px;
  color: #526e69;
}
dialog {
  width: min(600px, calc(100% - 28px));
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
}
.dialog-close {
  min-width: 44px;
}
.dialog-sub, .summary-card {
  font-size: 14px;
}
.summary-card h3 {
  font-size: 16px;
}
.summary-card .symptom-list span {
  font-size: 12px;
}
.summary-notes {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.privacy-note {
  text-align: left;
  font-size: 12px;
  color: #526e69;
  margin: 16px 0 0;
}
#shareLink {
  margin: 8px 0 16px;
  font-size: 12px;
}
#shareFeedback {
  font-size: 14px;
  color: var(--teal);
}
.toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translate(-50%, 20px);
  opacity: 0;
  pointer-events: none;
  z-index: 10;
  width: max-content;
  max-width: calc(100% - 32px);
  padding: 14px 20px;
  background: #173a39;
  color: white;
  border-radius: 12px;
  box-shadow: var(--shadow);
  font-size: 14px;
  transition: .2s;
}
.toast.visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
.loading {
  padding: 24px;
  text-align: center;
  flex-wrap: wrap;
}
@media (max-width: 1190px) {
  .workspace {
    grid-template-columns: minmax(0,1fr) 350px;
  }
  .steps {
    display: none;
  }
}
@media (max-width: 850px) {
  .workspace {
    grid-template-columns: minmax(0,1fr);
  }
  .intro {
    display: block;
  }
  .intro > p {
    margin-top: 18px;
  }
  .form-card {
    margin-top: 0;
  }
  .viewer-card {
    min-height: 0;
  }
  main {
    padding: 24px 16px;
  }
}
@media (max-width: 430px) {
  .chips {
    grid-template-columns: 1fr 1fr;
  }
  .chips button {
    font-size: 13px;
  }
  .form-card {
    padding: 18px;
  }
  #mouth3d {
    height: 340px;
  }
  .viewer-card #mouth3d {
    min-height: 0;
  }
  .intro h1 {
    font-size: 32px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Modal odontológico compacto: preserva leitura e alvo tátil mínimo de 44 px. */
.tooth-dialog {
  line-height: 1.35;
}
.tooth-dialog .dialog-sub {
  font-size: 15px;
  line-height: 1.35;
  margin-bottom: 12px;
}
.tooth-dialog .form-section {
  padding-bottom: 12px;
  margin-bottom: 12px;
}
.tooth-dialog .chips {
  gap: 6px;
  margin-top: 7px;
}
.tooth-dialog .chips button {
  min-height: 44px;
  padding: 5px 8px;
  font-size: 14px;
  line-height: 1.2;
}
.tooth-dialog .chips button span {
  width: 18px;
  height: 18px;
  flex-basis: 18px;
}
.tooth-dialog .tooth-situation {
  margin-bottom: 12px;
  padding: 8px 12px;
}
.tooth-dialog .tooth-situation label {
  padding: 5px 0;
}
.tooth-dialog .tooth-situation small {
  margin-top: 1px;
  font-size: 13px;
  line-height: 1.3;
}
.tooth-dialog .field {
  margin-bottom: 10px;
}
.tooth-dialog .field .section-label {
  margin-bottom: 5px;
}
.tooth-dialog select {
  min-height: 44px;
  padding: 8px 10px;
}
.tooth-dialog textarea {
  height: 66px;
  min-height: 66px;
  padding: 8px 10px 20px;
}
.tooth-dialog-actions {
  margin-top: 12px;
}

@media (max-width: 430px) {
  .tooth-dialog {
    padding: 22px 20px 18px;
  }
}