/* 040D20R1B — kid-facing moderation break modal.
   Presentation only: enforcement remains server-side in 040D20. */

.childBreakDialog{
  width:min(430px,calc(100vw - 32px));
  max-width:430px;
  margin:auto;
  padding:0;
  border:1px solid var(--auth-edge);
  border-radius:28px 25px 31px 27px;
  background:linear-gradient(180deg,var(--auth-card-strong),var(--auth-card));
  color:var(--forest);
  box-shadow:
    0 0 0 5px rgba(246,239,217,.78),
    0 0 0 7px rgba(227,167,59,.22),
    0 28px 80px rgba(18,34,17,.42);
}

.childBreakDialog::backdrop{
  background:rgba(7,18,10,.74);
  backdrop-filter:blur(2px);
}

.childBreakInner{
  display:grid;
  justify-items:center;
  gap:14px;
  padding:28px 26px 24px;
  text-align:center;
}

.childBreakCrest{
  width:78px;
  height:78px;
  object-fit:contain;
  filter:drop-shadow(0 5px 10px rgba(35,58,31,.20));
}

.childBreakDialog h2{
  margin:0;
  font-family:"Baloo 2",system-ui,sans-serif;
  font-size:29px;
  line-height:1.08;
  color:inherit;
}

.childBreakCopy{
  display:grid;
  gap:11px;
  color:var(--auth-muted);
  font-family:Quicksand,system-ui,sans-serif;
  font-size:16px;
  font-weight:600;
  line-height:1.48;
}

.childBreakCopy p{margin:0}
.childBreakCopy strong{color:var(--forest);font-weight:800}

.childBreakGotIt{
  width:min(220px,100%);
  margin-top:2px;
  cursor:pointer;
}

html[data-cranky-public-theme="dark"] .childBreakDialog{
  color:#f4e9c9;
  background:linear-gradient(180deg,rgba(28,46,31,.998),rgba(19,34,23,.998));
  border-color:rgba(243,194,94,.36);
  box-shadow:
    0 0 0 5px rgba(22,37,25,.90),
    0 0 0 7px rgba(227,167,59,.27),
    0 28px 80px rgba(0,0,0,.62);
}

html[data-cranky-public-theme="dark"] .childBreakDialog::backdrop{
  background:rgba(3,10,5,.82);
}

html[data-cranky-public-theme="dark"] .childBreakCopy{color:#d8c9aa}
html[data-cranky-public-theme="dark"] .childBreakCopy strong{color:#f4e9c9}

@media(max-width:520px){
  .childBreakDialog{width:calc(100vw - 24px);border-radius:24px 22px 27px 23px}
  .childBreakInner{padding:24px 20px 20px;gap:12px}
  .childBreakCrest{width:68px;height:68px}
  .childBreakDialog h2{font-size:25px}
  .childBreakCopy{font-size:15px}
}
