/* Parent zone: plainer and denser than the child's screens, same materials. */
.parent, .parent-gate { max-width: 46rem; width: 100%; margin: 0 auto; }
.parent h1 { font-size: var(--text-xl); text-shadow: 0 3px 0 var(--white); }
.parent h3 { font-size: var(--text-base); margin: var(--s-4) 0 var(--s-2); }
.parent-tabs button { flex: 1; }
.gate { max-width: 24rem; margin: var(--s-5) auto 0; width: 100%; }
.gate-lock { display: grid; place-items: center; }
.gate-lock svg { width: 64px; height: auto; }
.gate h1 { font-size: var(--text-xl); }

details { border-top: 2px dotted var(--paper-2); padding-top: var(--s-3); margin-top: var(--s-3); }
summary { cursor: pointer; font-weight: 700; min-height: 32px; }
details[open] > summary { margin-bottom: var(--s-3); }
.danger-zone summary { color: var(--bad); }

.kid-head { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; margin-bottom: var(--s-3); }
.kid-head > svg { width: 64px; height: auto; flex: none; }
.kid-head h2 { margin: 0; }
.kid-thumb svg { width: 48px; height: auto; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-2); }
.stat { background: var(--white); border: 2px solid var(--ink); border-radius: var(--radius); padding: var(--s-2) var(--s-3); display: flex; flex-direction: column; }
.stat strong { font-size: var(--text-xl); }
.stat span { font-size: var(--text-xs); }
.chips { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.data { width: 100%; border-collapse: collapse; font-size: var(--text-sm); font-variant-numeric: tabular-nums; }
.data th, .data td { text-align: left; padding: var(--s-2) var(--s-2); border-bottom: 2px dotted var(--paper-2); }
.data th { font-size: var(--text-xs); color: var(--ink-soft); }
.ledger { display: flex; flex-direction: column; font-size: var(--text-sm); }
.ledger li { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-1) 0; border-bottom: 2px dotted var(--paper-2); }
.ledger .neg { color: var(--bad); }
.ledger .pos { color: var(--good); }
.request { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; padding: var(--s-2) 0; border-bottom: 2px dotted var(--paper-2); }
.request:last-child { border-bottom: 0; }