:where(
  [data-surface="auth"],
  [data-surface="admin"],
  [data-surface="join"],
  [data-surface="class"]
) {
  --product-ink: #17181c;
  --product-ink-muted: #6d706f;
  --product-line: #e5e4df;
  --product-paper: #f6f5f1;
  --product-surface: #ffffff;
  --product-leaf: #1f5b45;
  --product-mint: #dff5e8;
  --product-sky: #dff0fb;
  --product-blue: #2f62d8;
  --product-apricot: #ff9b78;
  --product-radius-control: 1rem;
  --product-radius-surface: 1.5rem;
  --product-shadow-overlay: 0 1.5rem 3.75rem rgb(23 24 28 / 10%);
  --product-font: "Avenir Next", Assistant, "Arial Hebrew", sans-serif;
}

[data-surface="class"] {
  --class-theme-background: #dff5e8;
  --class-theme-action: #ffffff;
  --class-theme-accent: var(--product-leaf);
}

:where(
  [data-surface="auth"],
  [data-surface="admin"],
  [data-surface="join"],
  [data-surface="class"]
) {
  box-sizing: border-box;
  color: var(--product-ink);
  font-family: var(--product-font);
  font-weight: 450;
}

:where(
  [data-surface="auth"],
  [data-surface="admin"],
  [data-surface="join"],
  [data-surface="class"]
) *,
:where(
  [data-surface="auth"],
  [data-surface="admin"],
  [data-surface="join"],
  [data-surface="class"]
) *::before,
:where(
  [data-surface="auth"],
  [data-surface="admin"],
  [data-surface="join"],
  [data-surface="class"]
) *::after { box-sizing: inherit; }

.app-shell[data-surface] {
  inline-size: 100%;
  width: 100%;
  min-height: 100vh;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--product-paper);
}

.app-shell[data-surface] :focus-visible {
  outline: 3px solid rgb(47 98 216 / 24%);
  outline-offset: 3px;
}

.product-wordmark {
  color: var(--product-ink);
  font-size: .94rem;
  font-weight: 750;
  letter-spacing: -.035em;
  text-decoration: none;
}

.product-brand-logo {
  display: inline-flex;
  align-items: center;
  color: #1e2330;
  font-family: Rubik, "Arial Rounded MT Bold", "Arial Hebrew", sans-serif;
  font-size: 1.34rem;
  font-weight: 900;
  letter-spacing: -.065em;
  line-height: 1;
}

.product-kicker {
  margin: 2.5rem 0 .65rem;
  color: var(--product-blue);
  font-size: .75rem;
  font-weight: 700;
}

.product-lead {
  max-width: 38rem;
  margin: .75rem 0 2rem;
  color: var(--product-ink-muted);
  font-size: 1rem;
  line-height: 1.65;
}

.product-text-link {
  color: var(--product-ink-muted);
  font-size: .86rem;
  text-decoration-thickness: 1px;
  text-underline-offset: .25rem;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Private class hub */
.app-shell[data-surface="class"] { background: #eeede8; }

[data-surface="class"] .class-hub {
  width: min(100%, 31rem);
  min-height: 100vh;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 1.75rem;
  background: linear-gradient(155deg, #dff5e8 0%, #ccefdc 58%, #bfe7d2 100%);
}

[data-surface="class"] .class-hub.theme-calm_sage {
  background: linear-gradient(155deg, #dfff68 0%, #91e2d8 55%, #cdbdf2 100%);
}

[data-surface="class"] .class-hub.theme-calm_peach {
  background: linear-gradient(155deg, #f8f5ed 0%, #eee9dd 58%, #e4ddd0 100%);
}

[data-surface="class"] .hub-utility {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

[data-surface="class"] .icon-button {
  display: grid;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgb(255 255 255 / 64%);
  color: var(--product-ink);
  cursor: pointer;
  font-size: 1.1rem;
  backdrop-filter: blur(10px);
}

[data-surface="class"] .class-identity {
  padding: 1.65rem .75rem 1.8rem;
  text-align: center;
}

[data-surface="class"] .class-avatar {
  display: grid;
  width: 4.8rem;
  height: 4.8rem;
  margin: 0 auto .9rem;
  place-items: center;
  border-radius: 50%;
  background: var(--product-leaf);
  color: white;
  font-size: 1.3rem;
  font-weight: 650;
  letter-spacing: -.04em;
}

[data-surface="class"] .class-identity h1 {
  margin: 0;
  font-size: 1.85rem;
  font-weight: 620;
  letter-spacing: -.04em;
}

[data-surface="class"] .class-identity p {
  margin: .35rem 0 0;
  color: rgb(23 24 28 / 60%);
  font-size: .88rem;
}

[data-surface="class"] .hub-shortcuts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .3rem;
  margin: 0 -.2rem 1.25rem;
}

[data-surface="class"] .hub-shortcut {
  min-width: 0;
  padding: 0 .1rem;
  color: var(--product-ink);
  text-align: center;
  text-decoration: none;
}

[data-surface="class"] .shortcut-icon {
  position: relative;
  display: grid;
  width: 3rem;
  height: 3rem;
  margin: 0 auto .45rem;
  place-items: center;
  border-radius: 50%;
  background: rgb(255 255 255 / 72%);
  color: var(--product-leaf);
  transition: background .18s ease, transform .18s ease;
}

[data-surface="class"] .hub-shortcut:hover .shortcut-icon {
  background: white;
  transform: translateY(-2px);
}

[data-surface="class"] .shortcut-icon svg { width: 1.3rem; height: 1.3rem; }

[data-surface="class"] .shortcut-icon[data-count]::after {
  position: absolute;
  top: -.15rem;
  left: -.1rem;
  display: grid;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 .25rem;
  place-items: center;
  border: 2px solid #d4f0df;
  border-radius: 999px;
  background: var(--product-leaf);
  color: white;
  content: attr(data-count);
  font-size: .52rem;
  font-weight: 750;
}

[data-surface="class"] .hub-shortcut > span:last-child {
  display: block;
  overflow: hidden;
  font-size: .66rem;
  font-weight: 620;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-surface="class"] .hub-search {
  position: relative;
  margin: 0 0 .85rem;
}

[data-surface="class"] .hub-search > svg {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 1.05rem;
  width: 1.1rem;
  color: #737873;
  transform: translateY(-50%);
}

[data-surface="class"] .hub-search input {
  width: 100%;
  height: 3.45rem;
  padding: 0 2.9rem 0 1rem;
  border: 0;
  border-radius: 1.05rem;
  background: rgb(255 255 255 / 88%);
  color: var(--product-ink);
  font: inherit;
  font-size: .95rem;
}

[data-surface="class"] .hub-search input:focus { background: white; box-shadow: 0 0 0 3px rgb(31 91 69 / 12%); outline: 0; }
[data-surface="class"] .directory-list { display: grid; gap: .55rem; }
[data-surface="class"] .directory-row { overflow: hidden; border: 0; border-radius: 1.05rem; background: rgb(255 255 255 / 90%); box-shadow: none; }

[data-surface="class"] .directory-row-link {
  display: grid;
  min-height: 4.25rem;
  grid-template-columns: 2.65rem 1fr 1.5rem;
  gap: .75rem;
  align-items: center;
  padding: .55rem .9rem .55rem .7rem;
  border-radius: inherit;
  color: var(--product-ink);
  text-decoration: none;
  transition: background .18s ease, transform .18s ease;
}

[data-surface="class"] .directory-row-link:hover,
[data-surface="class"] .directory-row-link:focus-visible { background: white; transform: translateY(-1px); }
[data-surface="class"] .profile-avatar { display: grid; width: 2.65rem; height: 2.65rem; place-items: center; border-radius: 50%; font-weight: 650; }
[data-surface="class"] .avatar-peach { background: #ffb59d; }
[data-surface="class"] .avatar-sky { background: #b7e9ee; }
[data-surface="class"] .avatar-sage { background: #bcdac2; }
[data-surface="class"] .avatar-mauve { background: #e5c1e5; }
[data-surface="class"] .avatar-apricot { background: #f7d47f; }
[data-surface="class"] .directory-row-copy { display: grid; gap: .12rem; }
[data-surface="class"] .directory-row-copy strong { font-size: .95rem; font-weight: 620; }
[data-surface="class"] .directory-row-copy small { color: var(--product-ink-muted); font-size: .76rem; }
[data-surface="class"] .row-arrow { color: rgb(23 24 28 / 40%); font-size: 1.2rem; }
[data-surface="class"] .quiet-referral { margin: 1.3rem 0 0; text-align: center; }
[data-surface="class"] .quiet-referral a { color: rgb(23 24 28 / 52%); font-size: .72rem; }
[data-surface="class"] .privacy-last { margin: .8rem auto 0; color: rgb(23 24 28 / 42%); font-size: .63rem; line-height: 1.5; text-align: center; }
[data-surface="class"] .directory-empty { padding: 2rem 1rem; border: 0; border-radius: 1rem; background: rgb(255 255 255 / 62%); text-align: center; }

[data-surface="class"] .profile-sheet-target:empty { display: none; }
[data-surface="class"] .sheet-overlay {
  position: fixed;
  z-index: 50;
  inset: 0;
  display: flex;
  align-items: end;
  justify-content: center;
  padding: 0;
  background: rgb(23 24 28 / 24%);
}

[data-surface="class"] .profile-sheet {
  width: min(100%, 31rem);
  max-height: 90vh;
  overflow: auto;
  padding: .65rem 1.25rem 1.5rem;
  border-radius: 1.9rem 1.9rem 0 0;
  background: #fbfbf9;
  box-shadow: var(--product-shadow-overlay);
  animation: product-sheet-in .24s cubic-bezier(.22,.72,.24,1) both;
}

@keyframes product-sheet-in { from { transform: translateY(100%); } }
[data-surface="class"] .sheet-handle { width: 2.4rem; height: .25rem; margin: .1rem auto .75rem; border-radius: 99px; background: #d5d5d0; }
[data-surface="class"] .sheet-toolbar { display: flex; min-height: 2.6rem; align-items: center; justify-content: space-between; color: var(--product-ink-muted); font-size: .75rem; }
[data-surface="class"] .sheet-close { display: grid; width: 2.2rem; height: 2.2rem; padding: 0; place-items: center; border: 0; border-radius: 50%; background: #ecece8; color: var(--product-ink); cursor: pointer; font-size: 1.35rem; }
[data-surface="class"] .profile-head { padding: .5rem 0 1.2rem; text-align: center; }
[data-surface="class"] .profile-head .profile-photo { display: grid; width: 4.9rem; height: 4.9rem; margin: 0 auto .75rem; overflow: hidden; place-items: center; border: 3px solid white; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px var(--product-line); font-size: 1.35rem; font-weight: 650; }
[data-surface="class"] .profile-head h2 { margin: 0; font-size: 1.55rem; font-weight: 620; letter-spacing: -.035em; }
[data-surface="class"] .profile-head > p { margin: .25rem 0 0; color: var(--product-ink-muted); font-size: .82rem; }
[data-surface="class"] .profile-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin-top: .85rem; }
[data-surface="class"] .profile-fact { display: inline-flex; min-height: 1.85rem; align-items: center; padding: 0 .7rem; border-radius: 999px; background: #efefeb; color: #535754; font-size: .68rem; }
[data-surface="class"] .profile-fact.allergy { background: #fff0d9; color: #795421; }
[data-surface="class"] .guardians { padding-top: .25rem; border-top: 1px solid var(--product-line); }
[data-surface="class"] .guardians > h3 { margin: 1rem 0 .35rem; color: var(--product-ink-muted); font-size: .68rem; font-weight: 620; }
[data-surface="class"] .guardian-row { display: grid; min-height: 3.75rem; grid-template-columns: 1fr auto; gap: .75rem; align-items: center; border-bottom: 1px solid var(--product-line); }
[data-surface="class"] .guardian-copy strong { display: block; font-size: .9rem; font-weight: 620; }
[data-surface="class"] .guardian-copy small { display: block; margin-top: .1rem; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="class"] .guardian-actions { display: flex; gap: .4rem; align-items: center; direction: ltr; }
[data-surface="class"] .guardian-actions > small { color: var(--product-ink-muted); font-size: .65rem; }
[data-surface="class"] .guardian-action { display: grid; width: 2.2rem; height: 2.2rem; place-items: center; border-radius: 50%; background: #ecece8; color: #414440; text-decoration: none; }
[data-surface="class"] .guardian-action.whatsapp { background: #dff5e8; color: var(--product-leaf); }
[data-surface="class"] .guardian-action svg { width: 1rem; height: 1rem; }
[data-surface="class"] .sheet-back { width: 100%; min-height: 3rem; margin-top: .55rem; border: 0; background: transparent; color: var(--product-ink-muted); cursor: pointer; }

[data-surface="class"] .shortcut-detail-page { width: min(100%, 42rem); min-height: 100vh; margin: 0 auto; padding: 2rem 1.4rem 3rem; background: var(--product-surface); }
[data-surface="class"] .shortcut-detail-page h1 { margin: .4rem 0 0; font-size: clamp(2rem, 6vw, 3rem); font-weight: 560; letter-spacing: -.045em; }
[data-surface="class"] .shortcut-detail-list { display: grid; border-top: 1px solid var(--product-line); }
[data-surface="class"] .shortcut-detail { display: grid; min-height: 4.4rem; grid-template-columns: 2.4rem 1fr auto; gap: .7rem; align-items: center; padding: .55rem 0; border-bottom: 1px solid var(--product-line); color: var(--product-ink); text-decoration: none; }
[data-surface="class"] .shortcut-detail-icon { display: grid; width: 2.3rem; height: 2.3rem; place-items: center; border-radius: 50%; background: var(--product-mint); color: var(--product-leaf); font-size: .75rem; font-weight: 700; }
[data-surface="class"] .shortcut-detail strong { display: block; font-size: .9rem; font-weight: 620; }
[data-surface="class"] .shortcut-detail small { display: block; margin-top: .15rem; color: var(--product-ink-muted); font-size: .7rem; }
[data-surface="class"] .shortcut-child-links { display: flex; flex-wrap: wrap; justify-content: end; gap: .3rem; }
[data-surface="class"] .shortcut-child-links a { padding: .3rem .5rem; border-radius: 999px; background: var(--product-mint); color: var(--product-leaf); font-size: .65rem; text-decoration: none; }
[data-surface="class"] .medical-note { margin: 1rem 0 0; color: var(--product-ink-muted); font-size: .68rem; line-height: 1.55; }

/* Join, preview, and focused product forms */
.app-shell[data-surface="join"] { background: linear-gradient(160deg, #dff0fb 0%, #eaf6fb 52%, #f7f5ed 100%); }
.join-welcome { width: min(100%, 31rem); min-height: 100vh; margin: 0 auto; padding: 1.5rem 1.4rem 2rem; }
.join-top { display: flex; align-items: center; justify-content: space-between; color: rgb(23 24 28 / 52%); font-size: .75rem; }
.join-main { padding-top: clamp(3.5rem, 12vh, 7rem); }
.join-mark { display: grid; width: 4rem; height: 4rem; place-items: center; border-radius: 50%; background: var(--product-blue); color: white; font-size: 1.1rem; font-weight: 650; }
.join-main h1 { margin: 1.4rem 0 .7rem; font-size: clamp(2.2rem, 9vw, 3rem); font-weight: 520; letter-spacing: -.05em; line-height: 1.07; }
.join-main > p:not(.join-note):not(.join-status) { max-width: 20rem; margin: 0; color: rgb(23 24 28 / 64%); font-size: .95rem; line-height: 1.6; }
.join-value { display: grid; gap: .85rem; margin: 2.1rem 0; padding: 1.4rem 0; border-top: 1px solid rgb(23 24 28 / 12%); border-bottom: 1px solid rgb(23 24 28 / 12%); }
.join-value div { display: flex; gap: .7rem; align-items: center; font-size: .82rem; }
.join-value b { display: grid; width: 1.6rem; height: 1.6rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 64%); color: var(--product-blue); font-size: .68rem; }
.join-choice-actions { display: grid; gap: .45rem; }
.join-choice-actions .product-primary { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.join-choice-actions form { margin: 0; }
.text-button { width: 100%; min-height: 2.8rem; padding: 0; border: 0; background: transparent; color: var(--product-ink-muted); cursor: pointer; font: inherit; font-size: .75rem; }
.join-note { margin: .8rem auto 0 !important; color: rgb(23 24 28 / 48%) !important; font-size: .65rem !important; text-align: center; }
.product-page { width: min(calc(100% - 2rem), 46rem); margin: 0 auto; padding: 2rem 0 4rem; }
.product-page-heading { display: flex; align-items: center; justify-content: space-between; color: var(--product-ink-muted); font-size: .75rem; }
.product-page h1 { max-width: 36rem; margin: 0; font-size: clamp(2.25rem, 7vw, 3.7rem); font-weight: 520; letter-spacing: -.05em; line-height: 1.05; }
.product-form { display: grid; gap: 1rem; margin-top: 2.25rem; }
.form-step-section { display: grid; grid-template-columns: 2.25rem 1fr; gap: .8rem; align-items: start; margin-top: 1.4rem; padding-top: 1.4rem; border-top: 1px solid rgb(23 24 28 / 12%); }
.form-step-index { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 64%); color: var(--product-blue); font-size: .65rem; font-weight: 750; }
.form-step-section h2 { margin: 0; font-size: 1.35rem; font-weight: 590; letter-spacing: -.025em; }
.form-step-section p { margin: .2rem 0 0; color: var(--product-ink-muted); font-size: .78rem; }
.product-form fieldset { display: grid; gap: 1rem; margin: 0; padding: 1.25rem; border: 1px solid rgb(23 24 28 / 10%); border-radius: 1.15rem; background: rgb(255 255 255 / 58%); }
.product-form legend { padding: 0 .35rem; font-size: .78rem; font-weight: 650; }
.field { display: grid; gap: .4rem; }
.field > span, .field label { font-size: .75rem; font-weight: 620; }
.field input, .field select, .product-form input:not([type="checkbox"]):not([type="hidden"]), .product-form select { width: 100%; min-height: 3.25rem; padding: 0 .9rem; border: 1px solid rgb(23 24 28 / 14%); border-radius: .9rem; background: rgb(255 255 255 / 78%); color: var(--product-ink); font: inherit; }
.field input:focus, .field select:focus { border-color: var(--product-blue); background: white; outline: 0; }
.field-grid { display: grid; gap: .85rem; }
.field-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.visibility-choice { display: flex; align-items: start; gap: .55rem; color: var(--product-ink-muted); font-size: .72rem; line-height: 1.45; }
.visibility-choice input { width: 1rem; height: 1rem; flex: 0 0 auto; margin-top: .1rem; accent-color: var(--product-blue); }
.optional-details { display: grid; gap: .9rem; margin-top: .5rem; padding-top: 1rem; border-top: 1px solid rgb(23 24 28 / 10%); }
.optional-details h3 { margin: 0; font-size: .85rem; font-weight: 650; }
.birthday-fields, .contact-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.allergy-choices { display: flex; flex-wrap: wrap; gap: .45rem; }
.allergy-choices > span { width: 100%; font-size: .75rem; font-weight: 620; }
.allergy-choices label { padding: .45rem .65rem; border-radius: 999px; background: rgb(255 255 255 / 66%); font-size: .7rem; }
.contact-method { display: grid; gap: .5rem; }
.product-primary { min-height: 3.5rem; border: 0; border-radius: 1rem; background: var(--product-ink); color: white; box-shadow: none; font-weight: 650; }
.product-final-note { margin: 1.2rem auto 0; color: var(--product-ink-muted); font-size: .68rem; line-height: 1.55; text-align: center; }

/* Family intake: a class card in the making, not a database form */
.app-shell[data-surface="join"]:has(.family-card) { background: linear-gradient(180deg, #dff0fb 0, #e7f3f8 23rem, #f4f2eb 23rem, #f4f2eb 100%); }
.family-card { width: min(calc(100% - 2rem), 54rem); padding-top: 1.4rem; }
.family-card .product-page-heading { padding: 0 .2rem; }
.family-form-hero { position: relative; display: grid; min-height: 17rem; grid-template-columns: minmax(0, 1fr) 11rem; gap: 2rem; align-items: center; margin-top: 1.2rem; padding: clamp(1.6rem, 4vw, 2.7rem); overflow: hidden; border-radius: 1.8rem; background: #3265db; color: white; }
.family-form-hero::after { position: absolute; right: -5rem; bottom: -7rem; width: 19rem; height: 14rem; border-radius: 50%; background: rgb(145 226 216 / 55%); content: ""; transform: rotate(-14deg); }
.family-form-hero-copy { position: relative; z-index: 1; }
.family-form-hero .product-kicker { margin: 0 0 .7rem; color: #dfff68; }
.family-form-hero h1 { max-width: 28rem; color: white; font-size: clamp(2.35rem, 6vw, 4rem); font-weight: 560; line-height: .98; }
.family-form-hero .product-lead { max-width: 29rem; margin: 1rem 0 0; color: rgb(255 255 255 / 78%); font-size: .92rem; line-height: 1.58; }
.family-form-hero-art { position: relative; z-index: 1; display: grid; width: 9.5rem; height: 9.5rem; place-items: center; justify-self: center; border-radius: 50%; background: #dfff68; color: var(--product-ink); }
.family-form-hero-art > span { font-size: 2.25rem; font-weight: 700; }
.family-form-hero-art > i { position: absolute; right: -.6rem; bottom: .45rem; width: 2.9rem; height: 2.9rem; border: .45rem solid #3265db; border-radius: 50%; background: #ff9b78; }
.family-form-hero-art > b { position: absolute; top: -.45rem; left: .15rem; display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border-radius: 50%; background: white; color: #3265db; font-size: 1.25rem; font-weight: 570; }
.family-progress { display: grid; grid-template-columns: repeat(3, 1fr); margin: 1.1rem 0 0; border-bottom: 1px solid rgb(23 24 28 / 12%); }
.family-progress > span { position: relative; display: flex; min-height: 3.3rem; align-items: center; justify-content: center; gap: .5rem; color: rgb(23 24 28 / 46%); font-size: .72rem; font-weight: 620; }
.family-progress > span::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; border-radius: 3px 3px 0 0; background: transparent; content: ""; }
.family-progress > span.is-current { color: var(--product-ink); }
.family-progress > span.is-current::after { background: #3265db; }
.family-progress b { display: grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 62%); font-size: .62rem; }
.family-progress .is-current b { background: #dfff68; color: #234190; }
.family-card .product-form { gap: 1.25rem; margin-top: 1.2rem; }
.family-card .child-step-heading { margin-top: 0; padding-top: .7rem; border-top: 0; }
.child-step-heading .form-step-index { background: #dfff68; color: #234190; }
.child-step-heading > div { display: flex; flex-direction: column-reverse; }
.child-step-heading p { margin: 0 0 .2rem; color: #3265db; font-size: .68rem; font-weight: 700; }
.family-card .child-fieldset { gap: 1.5rem; padding: clamp(1.2rem, 3.5vw, 2rem); border: 1px solid rgb(23 24 28 / 9%); border-radius: 1.6rem; background: rgb(255 255 255 / 88%); }
.child-identity-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(15rem, .75fr); gap: 1rem; align-items: stretch; }
.child-name-field { align-content: center; min-height: 11.25rem; padding: 1.4rem; border-radius: 1.25rem; background: #f4f2eb; }
.child-name-field > span { font-size: .86rem; }
.child-name-field > small { margin-top: -.15rem; color: var(--product-ink-muted); font-size: .68rem; }
.child-name-field input { margin-top: .65rem; font-size: 1.05rem; }
.photo-picker { position: relative; display: grid; align-content: space-between; min-height: 11.25rem; padding: 1rem; border-radius: 1.25rem; background: #dff5e8; }
.photo-input { position: absolute; width: 1px !important; height: 1px; min-height: 0 !important; padding: 0 !important; overflow: hidden; clip: rect(0 0 0 0); border: 0 !important; white-space: nowrap; }
.photo-picker-label { display: grid; grid-template-columns: 3.4rem 1fr; gap: .8rem; align-items: center; padding: .25rem; color: var(--product-ink); cursor: pointer; }
.photo-picker-icon { display: grid; width: 3.35rem; height: 3.35rem; place-items: center; border-radius: 50%; background: white; color: #28684f; }
.photo-picker-icon svg { width: 1.45rem; height: 1.45rem; }
.photo-picker-preview { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.preview-edit-form { display: flex; justify-content: center; }
.preview-edit-form .product-text-link { border: 0; background: transparent; cursor: pointer; font: inherit; }
.photo-picker-label strong, .photo-picker-label small { display: block; }
.photo-picker-label strong { font-size: .8rem; font-weight: 680; }
.photo-picker-label small { margin-top: .15rem; color: #4c7665; font-size: .62rem; line-height: 1.4; }
.photo-input:focus-visible + .photo-picker-label { border-radius: .8rem; outline: 3px solid rgb(47 98 216 / 24%); outline-offset: 3px; }
.choice-switch { position: relative; display: grid; min-height: 3rem; grid-template-columns: 2.35rem 1fr; gap: .65rem; align-items: center; padding-top: .7rem; border-top: 1px solid rgb(23 24 28 / 9%); color: var(--product-ink); cursor: pointer; }
.choice-switch > input { position: absolute; width: 1px !important; height: 1px !important; min-height: 0 !important; opacity: 0; }
.choice-switch-control { position: relative; display: block; width: 2.25rem; height: 1.35rem; border-radius: 999px; background: #bec5c0; transition: background .16s ease; }
.choice-switch-control::after { position: absolute; top: .2rem; right: .2rem; width: .95rem; height: .95rem; border-radius: 50%; background: white; content: ""; transition: transform .16s ease; }
.choice-switch:has(input:checked) .choice-switch-control { background: #28684f; }
.choice-switch:has(input:checked) .choice-switch-control::after { transform: translateX(-.9rem); }
.choice-switch:has(input:focus-visible) .choice-switch-control { outline: 3px solid rgb(47 98 216 / 24%); outline-offset: 3px; }
.choice-switch strong, .choice-switch small { display: block; }
.choice-switch strong { font-size: .7rem; font-weight: 680; }
.choice-switch small { margin-top: .05rem; color: var(--product-ink-muted); font-size: .59rem; }
.family-card .optional-details { gap: 1rem; margin-top: 0; padding-top: 1.5rem; }
.optional-details-heading p { margin: 0 0 .2rem; color: #3265db; font-size: .66rem; font-weight: 700; }
.optional-details-heading h3 { font-size: 1.25rem; font-weight: 570; letter-spacing: -.025em; }
.child-details-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.child-detail-card { display: grid; gap: 1rem; align-content: start; min-height: 19rem; padding: 1.15rem; border-radius: 1.25rem; }
.birthday-card { background: #efffc0; }
.allergy-card { background: #fff0e9; }
.child-detail-card > header { display: grid; grid-template-columns: 2.45rem 1fr; gap: .7rem; align-items: center; }
.child-detail-card > header > span { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border-radius: .75rem; background: rgb(255 255 255 / 70%); color: #28543f; font-size: 1rem; font-weight: 750; }
.allergy-card > header > span { color: #a34e35; }
.child-detail-card > header svg { width: 1.2rem; height: 1.2rem; }
.child-detail-card h4 { margin: 0; font-size: .86rem; font-weight: 680; }
.child-detail-card header p { margin: .15rem 0 0; color: rgb(23 24 28 / 58%); font-size: .62rem; line-height: 1.4; }
.child-detail-card .birthday-fields { grid-template-columns: 5.25rem minmax(0, 1fr); gap: .55rem; }
.child-detail-card .field > span { font-size: .65rem; }
.child-detail-card .field input, .child-detail-card .field select { min-height: 2.9rem; border: 0; border-radius: .75rem; background: rgb(255 255 255 / 78%); font-size: .75rem; }
.allergy-choices { gap: .35rem; }
.allergy-chip { position: relative; display: inline-grid; min-height: 2rem; grid-template-columns: .8rem auto; gap: .35rem; align-items: center; padding: .35rem .55rem !important; border: 1px solid transparent; border-radius: 999px; background: rgb(255 255 255 / 68%) !important; color: #69463b; cursor: pointer; }
.allergy-chip input { position: absolute; width: 1px !important; height: 1px !important; min-height: 0 !important; opacity: 0; }
.allergy-chip > span { display: block; width: .7rem; height: .7rem; border: 1px solid rgb(105 70 59 / 35%); border-radius: 50%; background: white; }
.allergy-chip b { font-size: .64rem; font-weight: 620; }
.allergy-chip:has(input:checked) { border-color: #a34e35; background: #a34e35 !important; color: white; }
.allergy-chip:has(input:checked) > span { border: 3px solid white; background: #a34e35; }
.allergy-chip:has(input:focus-visible) { outline: 3px solid rgb(47 98 216 / 24%); outline-offset: 2px; }
.allergy-card:not(:has(input[value="other"]:checked)) .allergy-other { display: none; }
.child-detail-card .choice-switch { margin-top: auto; }
.allergy-card .choice-switch-control { background: #d7b2a7; }
.allergy-card .choice-switch:has(input:checked) .choice-switch-control { background: #a34e35; }
.family-card .guardian-fieldset { border-radius: 1.25rem; background: rgb(255 255 255 / 72%); }

.preview-page { max-width: 38rem; }
.profile-preview-card { margin: 2rem 0 1.25rem; padding: 1.4rem; border: 1px solid rgb(23 24 28 / 10%); border-radius: 1.35rem; background: rgb(255 255 255 / 75%); }
.profile-preview-head { display: flex; gap: .85rem; align-items: center; }
.profile-preview-head h2 { margin: 0; font-size: 1.35rem; font-weight: 620; }
.profile-preview-head p { margin: .2rem 0 0; color: var(--product-ink-muted); font-size: .75rem; }
.profile-fact-list { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1rem 0; }
.profile-fact-list span { padding: .4rem .65rem; border-radius: 999px; background: #efefeb; color: #535754; font-size: .68rem; }
.profile-fact-list .allergy { background: #fff0d9; color: #795421; }
.guardian-preview-list { margin-top: 1rem; border-top: 1px solid var(--product-line); }
.guardian-preview-list h3 { color: var(--product-ink-muted); font-size: .7rem; }
.guardian-preview-row { display: grid; min-height: 3.5rem; grid-template-columns: 1fr auto; align-items: center; border-bottom: 1px solid var(--product-line); }
.guardian-preview-row strong, .guardian-preview-row small { display: block; }
.guardian-preview-row small { color: var(--product-ink-muted); font-size: .68rem; }
.guardian-preview-actions { display: flex; gap: .35rem; }
.guardian-preview-actions > span:not(small) { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--product-mint); color: var(--product-leaf); font-size: .62rem; font-weight: 750; }
.guardian-preview-actions svg { width: 1rem; height: 1rem; }
.profile-fact-list .muted { opacity: .56; text-decoration: line-through; text-decoration-thickness: 1px; }
.confirmation-page { max-width: 36rem; text-align: center; }
.confirmation-page .product-wordmark { display: inline-block; margin-bottom: 3rem; }
.confirmation-mark { display: grid; width: 3.75rem; height: 3.75rem; margin: 0 auto 1.4rem; place-items: center; border-radius: 50%; background: var(--product-mint); color: var(--product-leaf); font-size: 1.6rem; }
.confirmation-page .product-lead { margin-inline: auto; }
.confirmation-page .product-primary { display: flex; width: 100%; margin-top: 1.2rem; align-items: center; justify-content: center; text-decoration: none; }
.edit-link-details { margin-top: 2rem; padding: 1rem 0; border-top: 1px solid var(--product-line); border-bottom: 1px solid var(--product-line); text-align: start; }
.edit-link-details summary { cursor: pointer; font-size: .78rem; font-weight: 620; }
.edit-link-details p { color: var(--product-ink-muted); font-size: .72rem; }

/* Sign in */
.app-shell[data-surface="auth"] { background: linear-gradient(145deg, #dff0fb 0%, #e8f5fb 52%, #f6f4ed 100%); }
[data-surface="auth"] .auth-layout { width: min(100% - 2rem, 68rem); min-height: 100vh; margin: 0 auto; padding: 1.5rem 0 3rem; }
[data-surface="auth"] .auth-top { display: flex; align-items: center; justify-content: space-between; }
[data-surface="auth"] .auth-top > a:last-child { color: var(--product-ink-muted); font-size: .72rem; text-decoration-thickness: 1px; text-underline-offset: .25rem; }
[data-surface="auth"] .auth-brand-word { font-family: Rubik, "Arial Rounded MT Bold", "Arial Hebrew", sans-serif; font-size: 1.34rem; font-weight: 900; letter-spacing: -.065em; line-height: 1; }
[data-surface="auth"] .auth-main { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr); gap: clamp(2rem, 8vw, 7rem); align-items: center; min-height: calc(100vh - 7rem); }
[data-surface="auth"] .auth-copy h1 { max-width: 34rem; margin: 0; font-size: clamp(3rem, 6.5vw, 5.4rem); font-weight: 520; letter-spacing: -.06em; line-height: .98; }
[data-surface="auth"] .auth-copy .product-lead { max-width: 32rem; }
[data-surface="auth"] .auth-points { display: grid; max-width: 30rem; margin-top: 2.2rem; border-top: 1px solid rgb(23 24 28 / 13%); }
[data-surface="auth"] .auth-points span { display: flex; min-height: 3.2rem; align-items: center; gap: .7rem; border-bottom: 1px solid rgb(23 24 28 / 13%); font-size: .75rem; }
[data-surface="auth"] .auth-points b { display: grid; width: 1.55rem; height: 1.55rem; flex: 0 0 auto; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 68%); color: var(--product-blue); font-size: .6rem; }
[data-surface="auth"] .auth-action { padding: clamp(1.5rem, 4vw, 2.2rem); border: 1px solid rgb(23 24 28 / 10%); border-radius: 1.35rem; background: rgb(255 255 255 / 78%); }
[data-surface="auth"] .auth-action h2 { margin: 0; font-size: 1.5rem; font-weight: 610; letter-spacing: -.03em; }
[data-surface="auth"] .auth-action > p { margin: .4rem 0 1.6rem; color: var(--product-ink-muted); font-size: .76rem; line-height: 1.55; }
[data-surface="auth"] .auth-action form { margin: 0; }
[data-surface="auth"] .auth-action button { display: flex; width: 100%; align-items: center; justify-content: center; gap: .6rem; }
[data-surface="auth"] .auth-google-logo { display: block; width: 1.2rem; height: 1.2rem; flex: 0 0 auto; }
[data-surface="auth"] .auth-note { margin: 1rem 0 0 !important; font-size: .64rem !important; text-align: center; }
[data-surface="auth"] .auth-error { padding: .75rem; border-radius: .75rem; background: #fff0e9; color: #7a3d2a !important; }

/* Admin shell and supporting pages */
.app-shell[data-surface="admin"] { padding: clamp(0rem, 3vw, 2.5rem); background: #efefec; }
[data-surface="admin"] .class-create-card.saved-draft,
[data-surface="admin"] .product-page.admin-subpage,
[data-surface="admin"] .admin-preview-card {
  width: min(100%, 66rem);
  margin: 0 auto;
  padding: clamp(1.5rem, 5vw, 4.25rem);
  border: 1px solid #deddd8;
  border-radius: 1.4rem;
  background: white;
  box-shadow: 0 1.5rem 3.75rem rgb(23 24 28 / 7%);
}

[data-surface="admin"] .admin-subpage h1,
[data-surface="admin"] .admin-preview-card h1 { margin: .5rem 0 0; font-size: clamp(2rem, 5vw, 3rem); font-weight: 530; letter-spacing: -.045em; }
[data-surface="admin"] .manager-list { display: grid; margin-top: 2rem; border-top: 1px solid var(--product-line); }
[data-surface="admin"] .manager-row { display: grid; min-height: 4.5rem; grid-template-columns: 2.5rem 1fr auto; gap: .8rem; align-items: center; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .manager-icon { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: 50%; background: var(--product-mint); color: var(--product-leaf); font-weight: 700; }
[data-surface="admin"] .manager-row strong { display: block; font-size: .9rem; font-weight: 620; }
[data-surface="admin"] .manager-row small { display: block; margin-top: .15rem; color: var(--product-ink-muted); font-size: .7rem; }
[data-surface="admin"] .manager-state { min-height: 2rem; padding: 0 .7rem; border: 0; border-radius: 999px; background: #efefeb; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .manager-state.live { background: var(--product-mint); color: var(--product-leaf); }
[data-surface="admin"] .compact-form { max-width: 44rem; padding: 1.25rem; border-radius: 1.1rem; background: var(--product-paper); }
[data-surface="admin"] .admin-operations, [data-surface="admin"] .review-page { max-width: 56rem; }
[data-surface="admin"] .roster-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; margin: 2rem 0; }
[data-surface="admin"] .roster-stats > span { padding: 1.1rem; border-radius: 1rem; background: var(--product-paper); }
[data-surface="admin"] .roster-stats strong, [data-surface="admin"] .roster-stats small { display: block; }
[data-surface="admin"] .roster-stats strong { font-size: 1.65rem; font-weight: 560; letter-spacing: -.04em; }
[data-surface="admin"] .roster-stats small { margin-top: .25rem; color: var(--product-ink-muted); font-size: .67rem; }
[data-surface="admin"] .review-priority { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; margin: 1.2rem 0 2.5rem; padding: 1.45rem 1.55rem; border-radius: 1.05rem; background: var(--product-mint); }
[data-surface="admin"] .review-priority small { color: var(--product-leaf); font-size: .65rem; font-weight: 740; }
[data-surface="admin"] .review-priority h2 { margin: .25rem 0 .15rem; font-size: 1.1rem; font-weight: 620; }
[data-surface="admin"] .review-priority p { margin: 0; color: var(--product-ink-muted); font-size: .72rem; }
[data-surface="admin"] .review-priority > a { display: inline-flex; min-height: 2.7rem; align-items: center; padding: 0 1rem; border-radius: .75rem; background: var(--product-leaf); color: white; font-size: .72rem; font-weight: 650; text-decoration: none; }
[data-surface="admin"] .quiet-success { margin: 1.2rem 0 2.5rem; padding: 1rem; border-radius: .9rem; background: var(--product-mint); color: var(--product-leaf); font-size: .75rem; }
[data-surface="admin"] .review-list { margin-top: 2rem; }
[data-surface="admin"] .review-row { display: grid; min-height: 4.25rem; grid-template-columns: 1.75rem 1fr auto; gap: .8rem; align-items: center; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .review-row > div strong, [data-surface="admin"] .review-row > div span { display: block; }
[data-surface="admin"] .review-row > div strong { font-size: .82rem; font-weight: 620; }
[data-surface="admin"] .review-row > div span { margin-top: .15rem; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .expected-size-form { display: grid; grid-template-columns: minmax(12rem, 1fr) 7rem auto; gap: .75rem; align-items: center; margin-top: 1rem; }
[data-surface="admin"] .expected-size-copy { display: grid; gap: .15rem; min-width: 0; }
[data-surface="admin"] .expected-size-copy label { font-size: .78rem; font-weight: 650; }
[data-surface="admin"] .expected-size-copy small { color: var(--product-ink-muted); font-size: .65rem; }
[data-surface="admin"] .expected-size-form input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 2.8rem; padding: 0 .7rem; border: 1px solid var(--product-line); border-radius: .7rem; font: inherit; }
[data-surface="admin"] .review-profile-card { max-width: 38rem; margin-top: 2.2rem; background: var(--product-paper); }
[data-surface="admin"] .review-contact-list { display: grid; gap: .35rem; justify-items: end; }
[data-surface="admin"] .review-contact { display: grid; grid-template-columns: 1.7rem auto auto; gap: .45rem; align-items: center; color: var(--product-ink-muted); font-size: .65rem; opacity: .52; }
[data-surface="admin"] .review-contact.visible { color: var(--product-leaf); opacity: 1; }
[data-surface="admin"] .review-contact b { display: grid; width: 1.55rem; height: 1.55rem; place-items: center; border-radius: 50%; background: #e5e5e1; font-size: .58rem; }
[data-surface="admin"] .review-contact b svg { width: .85rem; height: .85rem; }
[data-surface="admin"] .review-contact.visible b { background: var(--product-mint); }
[data-surface="admin"] .review-contact small { min-width: 2.5rem; font-size: .58rem; }
[data-surface="admin"] .decision-panel { display: grid; gap: 1rem; max-width: 38rem; margin-top: 1.5rem; padding: 1.2rem; border-radius: 1rem; background: var(--product-paper); }
[data-surface="admin"] .decision-panel form { margin: 0; }
[data-surface="admin"] .decision-panel .product-primary { width: 100%; }
[data-surface="admin"] .correction-form { display: grid; gap: .45rem; padding-top: 1rem; border-top: 1px solid var(--product-line); }
[data-surface="admin"] .correction-form label { font-size: .72rem; font-weight: 620; }
[data-surface="admin"] .correction-form > div { display: grid; grid-template-columns: 1fr auto; gap: .5rem; }
[data-surface="admin"] .correction-form input { min-height: 3rem; padding: 0 .8rem; border: 1px solid var(--product-line); border-radius: .75rem; font: inherit; }
[data-surface="admin"] .review-tools { max-width: 38rem; }
[data-surface="admin"] .review-tools .review-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1rem; }
[data-surface="admin"] .baseline-details { max-width: 38rem; margin-top: 1.5rem; padding: .85rem 0; border-bottom: 1px solid var(--product-line); color: var(--product-ink-muted); font-size: .72rem; }
[data-surface="admin"] .baseline-details summary { color: var(--product-ink); cursor: pointer; font-weight: 620; }
[data-surface="admin"] .decision-panel.horizontal { grid-template-columns: 1fr auto; align-items: center; }

[data-surface="admin"] .admin-app { width: min(100%, 66rem); min-height: calc(100vh - 5rem); margin: 0 auto; overflow: hidden; border: 1px solid #deddd8; border-radius: 1.4rem; background: white; box-shadow: 0 1.5rem 3.75rem rgb(23 24 28 / 7%); }
[data-surface="admin"] .admin-nav { display: flex; min-height: 4.2rem; align-items: center; justify-content: space-between; padding: 0 1.9rem; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .admin-logo { color: var(--product-ink); font-weight: 750; letter-spacing: -.035em; text-decoration: none; }
[data-surface="admin"] .admin-nav-actions { display: flex; align-items: center; gap: 1rem; color: var(--product-ink-muted); font-size: .75rem; }
[data-surface="admin"] .admin-nav-actions a { color: inherit; text-decoration: none; }
[data-surface="admin"] .admin-nav-actions form { margin: 0; }
[data-surface="admin"] .admin-nav-actions button { padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit; }
[data-surface="admin"] .user-dot { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--product-mint); color: var(--product-leaf); font-weight: 700; }
[data-surface="admin"] .admin-content { max-width: 53rem; margin: 0 auto; padding: 3.4rem clamp(1.4rem, 6vw, 4.5rem) 4rem; }
[data-surface="admin"] .admin-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; padding-bottom: 1.9rem; }
[data-surface="admin"] .admin-heading small { color: var(--product-ink-muted); font-size: .78rem; }
[data-surface="admin"] .admin-heading h1 { margin: .45rem 0 0; font-size: clamp(2.25rem, 5vw, 3rem); font-weight: 520; letter-spacing: -.045em; }
[data-surface="admin"] .lifecycle-label { padding: .4rem .65rem; border-radius: 999px; background: #efefeb; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .admin-priority { display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: center; padding: 1.7rem 1.9rem; border-radius: 1.15rem; background: var(--product-mint); }
[data-surface="admin"] .admin-priority small { color: var(--product-leaf); font-size: .68rem; font-weight: 750; }
[data-surface="admin"] .admin-priority h2 { margin: .35rem 0 .2rem; font-size: 1.4rem; font-weight: 620; letter-spacing: -.025em; }
[data-surface="admin"] .admin-priority p { margin: 0; color: rgb(23 24 28 / 58%); font-size: .76rem; }
[data-surface="admin"] .admin-primary { display: inline-flex; min-height: 2.9rem; align-items: center; justify-content: center; padding: 0 1.2rem; border-radius: .8rem; background: var(--product-leaf); color: white; font-size: .78rem; font-weight: 650; text-decoration: none; white-space: nowrap; }
[data-surface="admin"] .admin-section { margin-top: 2.4rem; }
[data-surface="admin"] .admin-section-title { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: .75rem; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .admin-section-title h2 { margin: 0; font-size: 1rem; font-weight: 620; }
[data-surface="admin"] .admin-section-title span { color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .admin-list { display: grid; }
[data-surface="admin"] .admin-row { display: grid; min-height: 4.3rem; grid-template-columns: 1.8rem 1fr auto; gap: .8rem; align-items: center; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .row-state { display: grid; width: 1.6rem; height: 1.6rem; place-items: center; border-radius: 50%; background: #f0f0ed; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .row-state.done { background: var(--product-mint); color: var(--product-leaf); }
[data-surface="admin"] .admin-row strong { display: block; font-size: .84rem; font-weight: 620; }
[data-surface="admin"] .admin-row small { display: block; margin-top: .15rem; color: var(--product-ink-muted); font-size: .69rem; }
[data-surface="admin"] .row-action { color: var(--product-leaf); font-size: .74rem; font-weight: 620; text-decoration: none; }
[data-surface="admin"] .admin-focus-panel { margin-top: 2.4rem; padding: 1.5rem; border-radius: 1.1rem; background: var(--product-paper); }
[data-surface="admin"] .admin-focus-panel .share-surface { display: block; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
[data-surface="admin"] .admin-focus-panel .share-copy { max-width: none; }
[data-surface="admin"] .admin-focus-panel .privacy-chip { display: none; }
[data-surface="admin"] .admin-focus-panel h2 { margin: 0; font-size: 1.2rem; font-weight: 620; }
[data-surface="admin"] .admin-focus-panel p { color: var(--product-ink-muted); font-size: .76rem; }
[data-surface="admin"] .admin-focus-panel .primary-action,
[data-surface="admin"] .admin-focus-panel .secondary-action { border: 0; border-radius: .8rem; box-shadow: none; }
[data-surface="admin"] .admin-settings { margin-top: 2rem; padding: 1rem 0; border-top: 1px solid var(--product-line); border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .admin-settings > summary { cursor: pointer; font-size: .86rem; font-weight: 620; }
[data-surface="admin"] .admin-settings .configuration-surface { display: block; margin-top: 1rem; padding: 0; border: 0; background: transparent; box-shadow: none; }
[data-surface="admin"] .admin-settings .class-preview { display: none; }
[data-surface="admin"] .admin-settings .configuration-copy { max-width: 40rem; }
[data-surface="admin"] .admin-settings .privacy-chip { display: none; }
[data-surface="admin"] .admin-settings h2 { font-size: 1.1rem; }
[data-surface="admin"] .admin-settings form { display: grid; gap: .6rem; max-width: 28rem; }
[data-surface="admin"] .admin-settings select { min-height: 3rem; padding: 0 .8rem; border: 1px solid var(--product-line); border-radius: .8rem; background: white; }
[data-surface="admin"] .admin-settings .primary-action { border: 0; border-radius: .8rem; box-shadow: none; }
[data-surface="admin"] .admin-links { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; margin-top: 1.8rem; }
[data-surface="admin"] .admin-links a { color: var(--product-ink-muted); font-size: .75rem; text-decoration: none; }
[data-surface="admin"] .admin-links a:hover { color: var(--product-ink); }
[data-surface="admin"] .admin-privacy-note { margin: 2rem 0 0; color: var(--product-ink-muted); font-size: .65rem; }

/* Families management: one dashboard, one compact navigation model. */
[data-surface="admin"] .families-dashboard { padding-top: 1rem; }
[data-surface="admin"] .families-tabs { display: flex; gap: .25rem; margin: 0 0 2rem; padding: .3rem; border: 1px solid #e4e0d8; border-radius: .9rem; background: #f7f4ee; }
[data-surface="admin"] .families-tab { display: inline-flex; min-height: 2.7rem; flex: 1; align-items: center; justify-content: center; padding: 0 1rem; border-radius: .65rem; color: #6b6964; font-size: .76rem; font-weight: 620; text-decoration: none; transition: background .15s ease, color .15s ease; }
[data-surface="admin"] .families-tab:hover { color: var(--product-ink); }
[data-surface="admin"] .families-tab.active { background: #fff; color: #741d46; box-shadow: 0 .2rem .8rem rgb(23 24 28 / 6%); }
[data-surface="admin"] .families-tab:focus-visible { outline: 3px solid rgb(116 29 70 / 18%); outline-offset: 2px; }
[data-surface="admin"] .families-panel { min-height: 24rem; }
[data-surface="admin"] .families-panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--product-line); }
[data-surface="admin"] .families-panel-heading h2 { margin: 0; font-size: 1.2rem; font-weight: 650; letter-spacing: -.025em; }
[data-surface="admin"] .families-panel-heading p { margin: .25rem 0 0; color: var(--product-ink-muted); font-size: .7rem; line-height: 1.5; }
[data-surface="admin"] .families-panel-heading > span { color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .profile-management-list { margin-top: 0; }
[data-surface="admin"] .profile-management-row { grid-template-columns: 2.25rem minmax(0, 1fr) auto; }
[data-surface="admin"] .profile-management-avatar { display: grid; width: 2.1rem; height: 2.1rem; place-items: center; border-radius: 50%; background: #f1dfef; color: #741d46; font-size: .7rem; font-weight: 720; }
[data-surface="admin"] .profile-management-row .review-actions { flex-wrap: nowrap; }
[data-surface="admin"] .profile-management-row .review-actions form { width: auto; margin: 0; }
[data-surface="admin"] .profile-management-row .review-actions button { width: auto; min-width: 5.6rem; margin: 0; }
[data-surface="admin"] .settings-panel .expected-size-form { box-sizing: border-box; width: 100%; max-width: 36rem; margin-top: 1.5rem; padding: 1.2rem; border-radius: 1rem; background: #f8f3e8; }
[data-surface="admin"] .settings-panel .expected-size-form .secondary-action { width: auto; min-width: 6.25rem; margin: 0; justify-self: start; }
[data-surface="admin"] .review-tools { overflow: hidden; padding: .8rem 1rem; border: 1px solid #e5e1da; border-radius: 1rem; background: #fbfaf7; }
[data-surface="admin"] .review-tools[open] { border-color: #d9d2c8; }
[data-surface="admin"] .review-tools > summary { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; align-items: center; list-style-position: inside; }
[data-surface="admin"] .review-tools > summary span { font-weight: 650; }
[data-surface="admin"] .review-tools > summary small { color: var(--product-ink-muted); font-size: .64rem; font-weight: 450; }
[data-surface="admin"] .review-tools .review-actions form { width: auto; max-width: none; margin: 0; }
[data-surface="admin"] .review-tools .review-actions button { box-sizing: border-box; width: auto; min-width: 8rem; padding-inline: 1rem; border-radius: .75rem; }
[data-surface="admin"] .review-tools .review-danger { color: #8b3143; }

/* Admin workspace: one navigation model, one focused job per page. */
.app-shell[data-surface="admin"] { min-height: 100vh; padding: 0; background: #f7f7f4; }
[data-surface="admin"] .admin-frame { display: grid; min-height: 100vh; grid-template-columns: 14.5rem minmax(0, 1fr); background: #f7f7f4; }
[data-surface="admin"] .admin-sidebar { position: sticky; top: 0; display: flex; height: 100vh; flex-direction: column; padding: 1.7rem 1rem 1.25rem; border-inline-end: 1px solid #e4e4df; background: #fff; }
[data-surface="admin"] .admin-shell-logo { display: inline-flex; align-items: center; align-self: flex-start; color: var(--product-ink); font-family: Rubik, "Arial Rounded MT Bold", "Arial Hebrew", sans-serif; line-height: 1; text-decoration: none; }
[data-surface="admin"] .admin-brand-word { display: block; font-size: 1.34rem; font-weight: 900; letter-spacing: -.065em; }
[data-surface="admin"] .admin-class-switcher { display: grid; gap: .18rem; margin: 1.8rem 0 1.2rem; padding: .8rem .85rem; border: 1px solid #e7e7e2; border-radius: .85rem; background: #fafaf8; color: var(--product-ink); text-decoration: none; }
[data-surface="admin"] .admin-class-switcher small { color: var(--product-ink-muted); font-size: .66rem; }
[data-surface="admin"] .admin-class-switcher strong { overflow: hidden; font-size: .82rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
[data-surface="admin"] .admin-sidebar nav { display: grid; gap: .22rem; }
[data-surface="admin"] .admin-shell-link { display: grid; min-height: 2.75rem; grid-template-columns: 1.55rem 1fr; gap: .55rem; align-items: center; padding: 0 .75rem; border-radius: .72rem; color: #656761; text-decoration: none; transition: background .16s ease, color .16s ease; }
[data-surface="admin"] .admin-shell-link > span { display: grid; width: 1.4rem; height: 1.4rem; place-items: center; color: #7b7d77; font-size: .9rem; }
[data-surface="admin"] .admin-shell-link b { font-size: .78rem; font-weight: 560; }
[data-surface="admin"] .admin-shell-link:hover { background: #f3f3ef; color: var(--product-ink); }
[data-surface="admin"] .admin-shell-link.active { background: #e0f6e9; color: #15583e; }
[data-surface="admin"] .admin-shell-link.active > span { color: #15583e; }
[data-surface="admin"] .admin-shell-link.active b { font-weight: 700; }
[data-surface="admin"] .admin-sidebar-activity { margin-top: auto; padding: .8rem; border-top: 1px solid #ecece7; color: var(--product-ink-muted); font-size: .7rem; text-decoration: none; }
[data-surface="admin"] .admin-workspace { min-width: 0; }
[data-surface="admin"] .admin-page-content { width: min(100% - 4rem, 67rem); margin: 0 auto; padding: 3.6rem 0 5rem; }
[data-surface="admin"] .admin-mobile-header,
[data-surface="admin"] .admin-mobile-nav { display: none; }
[data-surface="admin"] .admin-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
[data-surface="admin"] .admin-page-heading > div > p { margin: 0 0 .4rem; color: var(--product-ink-muted); font-size: .72rem; }
[data-surface="admin"] .admin-page-heading h1 { margin: 0; font-size: clamp(2rem, 4.2vw, 3.3rem); font-weight: 570; letter-spacing: -.055em; }
[data-surface="admin"] .admin-page-heading > div > span { display: block; margin-top: .55rem; color: var(--product-ink-muted); font-size: .84rem; }
[data-surface="admin"] .admin-page-heading.focused h1 { font-size: clamp(1.85rem, 3.5vw, 2.7rem); }
[data-surface="admin"] .admin-outline-link { display: inline-flex; min-height: 2.65rem; align-items: center; justify-content: center; padding: 0 1rem; border: 1px solid #d7d7d1; border-radius: .72rem; background: #fff; color: var(--product-ink); font-size: .75rem; font-weight: 620; text-decoration: none; white-space: nowrap; }
[data-surface="admin"] .admin-priority { padding: 1.6rem 1.75rem; border: 1px solid #d4eddf; border-radius: 1rem; background: #e3f7eb; }
[data-surface="admin"] .admin-priority h2 { font-size: 1.25rem; font-weight: 630; }
[data-surface="admin"] .admin-priority p { font-size: .78rem; }
[data-surface="admin"] .admin-dashboard-section { margin-top: 2.6rem; }
[data-surface="admin"] .admin-destination-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: 1rem; }
[data-surface="admin"] .admin-destination-grid > a { display: grid; min-height: 8.4rem; grid-template-columns: 2rem 1fr auto; grid-template-rows: auto auto 1fr; gap: .25rem .7rem; padding: 1.15rem; border: 1px solid #e0e0da; border-radius: .95rem; background: #fff; color: var(--product-ink); text-decoration: none; transition: border-color .16s ease, transform .16s ease; }
[data-surface="admin"] .admin-destination-grid > a:hover { transform: translateY(-1px); border-color: #bfcfc5; }
[data-surface="admin"] .destination-icon { display: grid; width: 1.85rem; height: 1.85rem; grid-row: 1 / 3; place-items: center; border-radius: .58rem; background: #eff5f1; color: #28664e; }
[data-surface="admin"] .admin-destination-grid strong { font-size: .88rem; font-weight: 650; }
[data-surface="admin"] .admin-destination-grid small { grid-column: 2 / 4; color: var(--product-ink-muted); font-size: .72rem; }
[data-surface="admin"] .admin-destination-grid b { align-self: end; grid-column: 3; color: #39725b; font-size: .68rem; font-weight: 620; }
[data-surface="admin"] .admin-dashboard-footer { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: 2.5rem; padding-top: 1.1rem; border-top: 1px solid #e1e1dc; }
[data-surface="admin"] .admin-dashboard-footer a,
[data-surface="admin"] .admin-dashboard-footer button { border: 0; background: transparent; color: var(--product-ink-muted); font: inherit; font-size: .7rem; text-decoration: none; cursor: pointer; }
[data-surface="admin"] .admin-dashboard-footer form { margin-inline-start: auto; }
[data-surface="admin"] .admin-focused-surface,
[data-surface="admin"] .admin-display-surface { max-width: 58rem; }
[data-surface="admin"] .admin-focused-surface .share-surface { display: block; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
[data-surface="admin"] .admin-focused-surface .share-copy { max-width: 42rem; padding: 1.5rem; border: 1px solid #e0e0da; border-radius: 1rem; background: #fff; }
[data-surface="admin"] .admin-focused-surface .share-copy h2 { margin-top: .7rem; font-size: 1.25rem; }
[data-surface="admin"] .admin-focused-surface .primary-action,
[data-surface="admin"] .admin-focused-surface .secondary-action { border-radius: .72rem; box-shadow: none; }
[data-surface="admin"] .admin-display-surface .configuration-surface { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(17rem, .8fr); gap: 1rem; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
[data-surface="admin"] .admin-display-surface .configuration-copy,
[data-surface="admin"] .admin-display-surface .class-preview { padding: 1.4rem; border: 1px solid #e0e0da; border-radius: 1rem; background: #fff; }
[data-surface="admin"] .admin-display-surface .configuration-copy h2 { margin: 0; font-size: 1.15rem; }
[data-surface="admin"] .admin-display-surface .configuration-copy > p { color: var(--product-ink-muted); font-size: .76rem; }
[data-surface="admin"] .theme-choices { display: grid; gap: .55rem; margin: 1.2rem 0; }
[data-surface="admin"] .theme-choice { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: center; padding: .75rem; border: 1px solid #deded8; border-radius: .8rem; cursor: pointer; }
[data-surface="admin"] .theme-choice:has(input:checked) { border-color: #398165; background: #f1faf5; box-shadow: inset 0 0 0 1px #398165; }
[data-surface="admin"] .theme-choice input { position: absolute; opacity: 0; pointer-events: none; }
[data-surface="admin"] .theme-swatch { display: block; width: 2.1rem; height: 2.1rem; border-radius: .65rem; background: linear-gradient(135deg, #dff6e9 0 55%, #28664e 55%); }
[data-surface="admin"] .theme-choice-calm_peach .theme-swatch { background: linear-gradient(135deg, #ffe1d2 0 55%, #db745a 55%); }
[data-surface="admin"] .theme-choice-calm_peach .theme-swatch { background: linear-gradient(135deg, #f8f5ed 0 55%, #c6bca9 55%); }
[data-surface="admin"] .theme-choice-calm_sage .theme-swatch { background: linear-gradient(135deg, #dfff68 0 42%, #91e2d8 42% 72%, #8f79d9 72%); }
[data-surface="admin"] .theme-choice strong,
[data-surface="admin"] .theme-choice small { display: block; }
[data-surface="admin"] .theme-choice strong { font-size: .78rem; }
[data-surface="admin"] .theme-choice small { margin-top: .15rem; color: var(--product-ink-muted); font-size: .65rem; }
[data-surface="admin"] .admin-display-surface .primary-action { width: 100%; border-radius: .72rem; box-shadow: none; }
[data-surface="admin"] .admin-display-surface .class-preview { display: block; padding: .85rem; background: #202126; }
[data-surface="admin"] .admin-display-surface .preview-heading { display: flex; align-items: center; justify-content: space-between; }
[data-surface="admin"] .admin-display-surface .preview-heading h2 { color: #fff; font-size: .9rem; }
[data-surface="admin"] .admin-display-surface .preview-card { min-height: 17rem; margin-top: 1rem; padding: 1.5rem; border-radius: 1.25rem; box-shadow: none; }
[data-surface="admin"] .display-readonly { display: flex; gap: .8rem; align-items: center; margin-top: 1.2rem; padding: .9rem; border-radius: .8rem; background: #f5f5f1; }
[data-surface="admin"] .display-readonly p { margin: .2rem 0 0; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .admin-subpage,
[data-surface="admin"] .admin-frame .admin-preview-card { width: 100%; min-height: 0; margin: 0; padding: 1.5rem; border: 1px solid #e0e0da; border-radius: 1rem; background: #fff; box-shadow: none; }
[data-surface="admin"] .admin-subpage .product-form { margin-top: 0; }
[data-surface="admin"] .admin-preview-card.theme-calm_bio_v2,
[data-surface="admin"] .admin-preview-card.theme-calm_sage,
[data-surface="admin"] .admin-preview-card.theme-calm_peach { width: min(100%, 42rem); min-height: 31rem; margin: 0 auto; padding: 2rem; border: 0; border-radius: 1.5rem; box-shadow: none; }

[data-surface="admin"] .admin-class-preview-surface { width: 100%; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview { width: min(100%, 25rem); min-height: 36rem; margin: .8rem auto 0; padding: 1rem; overflow: hidden; border-radius: 1.35rem; box-shadow: none; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .hub-utility { font-size: .66rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .class-identity { padding: 1rem .5rem 1.15rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .class-avatar { width: 3.6rem; height: 3.6rem; margin-bottom: .6rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .class-identity h1 { font-size: 1.4rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .hub-shortcuts { margin-bottom: .8rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .shortcut-icon { width: 2.35rem; height: 2.35rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .hub-shortcut > span:last-child { font-size: .58rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .hub-search { min-height: 3.2rem; margin-bottom: .65rem; font-size: .72rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .directory-row-link { min-height: 3.8rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .profile-avatar { width: 2.6rem; height: 2.6rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .directory-row-copy strong { font-size: .76rem; }
[data-surface="admin"] .admin-class-preview-surface .class-hub-preview .directory-row-copy small { font-size: .62rem; }
[data-surface="admin"] .admin-live-preview { padding: 1rem; border-radius: 1.4rem; background: #252833; }
[data-surface="admin"] .admin-live-preview .admin-class-preview-surface .class-hub-preview { width: min(100%, 31rem); min-height: 44rem; margin-top: 0; }

[data-surface="admin"] .shortcut-manager { max-width: 56rem; }
[data-surface="admin"] .shortcut-manager-preview { padding: 1.1rem 1.25rem; border-radius: 1rem; background: #e4f8ec; }
[data-surface="admin"] .shortcut-manager-preview > p { margin: 0 0 .9rem; color: #275f49; font-size: .7rem; font-weight: 700; }
[data-surface="admin"] .shortcut-manager-preview nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .45rem; }
[data-surface="admin"] .shortcut-preview-item { display: grid; gap: .35rem; justify-items: center; color: #777b75; opacity: .55; }
[data-surface="admin"] .shortcut-preview-item.ready { color: #1f6449; opacity: 1; }
[data-surface="admin"] .shortcut-preview-item > span { display: grid; width: 2.7rem; height: 2.7rem; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 76%); }
[data-surface="admin"] .shortcut-preview-item svg,
[data-surface="admin"] .shortcut-category-icon svg,
[data-surface="admin"] .automatic-shortcut-pills svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[data-surface="admin"] .shortcut-preview-item small { font-size: .62rem; }
[data-surface="admin"] .shortcut-category-list { display: grid; margin-top: 1.5rem; border-top: 1px solid #e2e2dc; }
[data-surface="admin"] .shortcut-category { border-bottom: 1px solid #e2e2dc; }
[data-surface="admin"] .shortcut-category > summary { display: grid; min-height: 5rem; grid-template-columns: 2.7rem 1fr auto; gap: .85rem; align-items: center; padding: .5rem 0; cursor: pointer; list-style: none; }
[data-surface="admin"] .shortcut-category > summary::-webkit-details-marker { display: none; }
[data-surface="admin"] .shortcut-category-icon { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: .75rem; background: #eef5f0; color: #28664e; }
[data-surface="admin"] .shortcut-category summary strong,
[data-surface="admin"] .shortcut-category summary small { display: block; }
[data-surface="admin"] .shortcut-category summary strong { font-size: .86rem; }
[data-surface="admin"] .shortcut-category summary small { margin-top: .18rem; color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .shortcut-category-state { padding: .35rem .55rem; border-radius: 999px; background: #efefeb; color: #74766f; font-size: .6rem; font-weight: 650; }
[data-surface="admin"] .shortcut-category-state.live { background: #dff6e8; color: #216147; }
[data-surface="admin"] .shortcut-category-body { padding: .3rem 3.55rem 1.35rem 0; }
[data-surface="admin"] .shortcut-edit-form { display: grid; grid-template-columns: 1fr 1.15fr auto; gap: .65rem; align-items: end; }
[data-surface="admin"] .shortcut-edit-form label { display: grid; gap: .3rem; color: var(--product-ink-muted); font-size: .66rem; font-weight: 600; }
[data-surface="admin"] .shortcut-edit-form input { min-height: 2.8rem; padding: 0 .7rem; border: 1px solid #dcdcd6; border-radius: .7rem; background: #fff; font: inherit; }
[data-surface="admin"] .shortcut-edit-form .admin-primary { min-height: 2.8rem; border: 0; }
[data-surface="admin"] .shortcut-visibility-form { margin: .7rem 0 0; }
[data-surface="admin"] .shortcut-visibility-form button { padding: 0; border: 0; background: transparent; color: #486c5c; font-size: .65rem; cursor: pointer; }
[data-surface="admin"] .automatic-shortcuts { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.7rem; padding: 1.2rem; border-radius: 1rem; background: #f0ece3; }
[data-surface="admin"] .automatic-shortcuts p { margin: 0; color: #6f685b; font-size: .62rem; font-weight: 700; }
[data-surface="admin"] .automatic-shortcuts h2 { margin: .25rem 0; font-size: 1rem; }
[data-surface="admin"] .automatic-shortcuts > div > span { color: var(--product-ink-muted); font-size: .68rem; }
[data-surface="admin"] .automatic-shortcut-pills { display: flex; gap: .45rem; }
[data-surface="admin"] .automatic-shortcut-pills span { display: flex; align-items: center; gap: .35rem; padding: .5rem .65rem; border-radius: 999px; background: #fff; color: #4e554e; font-size: .62rem; }

[data-surface="admin"] .admin-identity-settings { max-width: 38rem; padding: 1.5rem; border: 1px solid #e0e0da; border-radius: 1rem; background: #fff; }
[data-surface="admin"] .admin-identity-settings form { display: grid; gap: 1rem; }
[data-surface="admin"] .admin-identity-settings .admin-primary { width: fit-content; min-height: 2.9rem; border: 0; }
[data-surface="admin"] .share-link-row .share-link { display: flex; min-width: 0; min-height: 2.8rem; align-items: center; overflow: hidden; color: #1f6349; font-size: .7rem; font-weight: 560; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
[data-surface="admin"] .share-open-link { display: inline-flex; margin-top: -.5rem; color: #1f6349; font-size: .7rem; font-weight: 620; text-underline-offset: .2rem; }

/* Expressive admin layer: the same calm product, with a stronger pulse. */
[data-surface="admin"] .admin-frame {
  --admin-accent: #ecc9eb;
  --admin-hero: #3265db;
  --admin-on-hero: #fff;
  --admin-soft: #e8f0ff;
}
[data-surface="admin"] .admin-frame[data-tone="families"] { --admin-accent: #ff9b78; --admin-hero: #ffe0d4; --admin-on-hero: #17181c; --admin-soft: #fff0e9; }
[data-surface="admin"] .admin-frame[data-tone="invite"] { --admin-accent: #741d46; --admin-hero: #ecc9eb; --admin-on-hero: #4d1738; --admin-soft: #f8edf5; }
[data-surface="admin"] .admin-frame[data-tone="content"] { --admin-accent: #741d46; --admin-hero: #91e2d8; --admin-on-hero: #1e2330; --admin-soft: #dcf8f2; }
[data-surface="admin"] .admin-frame[data-tone="preview"] { --admin-accent: #ecc9eb; --admin-hero: #741d46; --admin-on-hero: #fff; --admin-soft: #f8edf5; }
[data-surface="admin"] .admin-frame[data-tone="publish"] { --admin-accent: #f3cbe8; --admin-hero: #5d2947; --admin-on-hero: #fff; --admin-soft: #f7edf3; }
[data-surface="admin"] .admin-frame[data-tone="settings"] { --admin-accent: #741d46; --admin-hero: #f1e9d7; --admin-on-hero: #1e2330; --admin-soft: #f8f3e8; }
[data-surface="admin"] .admin-frame { background: #f4f2eb; }
[data-surface="admin"] .admin-sidebar { border: 0; border-inline-start: 1px solid #eadfe3; background: #fbf8f5; color: #4d1738; }
[data-surface="admin"] .admin-shell-logo { color: #1e2330; }
[data-surface="admin"] .admin-class-switcher { grid-template-columns: 2.2rem 1fr; grid-template-rows: auto auto; gap: .05rem .7rem; margin-top: 1.65rem; border: 1px solid #eadfe3; background: #fff; color: #4d1738; box-shadow: 0 .65rem 1.8rem rgb(116 29 70 / 4%); }
[data-surface="admin"] .admin-class-switcher > span { display: grid; width: 2.15rem; height: 2.15rem; grid-row: 1 / 3; place-items: center; border-radius: 50%; background: #f1dfef; color: #741d46; font-size: .72rem; font-weight: 750; }
[data-surface="admin"] .admin-class-switcher small { color: #a08391; }
[data-surface="admin"] .admin-class-switcher strong { color: #4d1738; }
[data-surface="admin"] .admin-shell-link { color: #806d77; }
[data-surface="admin"] .admin-shell-link > span { color: inherit; }
[data-surface="admin"] .admin-shell-link svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
[data-surface="admin"] .admin-shell-link:hover { background: #f6edf2; color: #741d46; }
[data-surface="admin"] .admin-shell-link.active { background: #f0dfed; color: #741d46; }
[data-surface="admin"] .admin-shell-link.active > span { color: #741d46; }
[data-surface="admin"] .admin-sidebar-activity { display: flex; gap: .45rem; align-items: center; border-color: #eadfe3; color: #9b7f8c; }
[data-surface="admin"] .admin-sidebar-activity:hover { color: #741d46; }
[data-surface="admin"] .admin-workspace { background: linear-gradient(180deg, color-mix(in srgb, var(--admin-hero) 24%, #f4f2eb) 0, #f4f2eb 25rem); }
[data-surface="admin"] .admin-page-content { width: min(100% - 4rem, 70rem); padding-top: 2rem; }
[data-surface="admin"] .admin-page-heading { position: relative; min-height: 10.5rem; margin-bottom: 1.3rem; padding: 1.8rem 2rem; overflow: hidden; border-radius: 1.55rem; background: var(--admin-hero); color: var(--admin-on-hero); }
[data-surface="admin"] .admin-page-heading::after { position: absolute; left: -2.3rem; bottom: -4.8rem; width: 13rem; height: 10rem; border-radius: 50%; background: color-mix(in srgb, var(--admin-accent) 72%, transparent); content: ""; transform: rotate(18deg); }
[data-surface="admin"] .admin-page-heading > * { position: relative; z-index: 1; }
[data-surface="admin"] .admin-page-heading > div > p { color: color-mix(in srgb, var(--admin-on-hero) 76%, transparent); font-weight: 700; }
[data-surface="admin"] .admin-page-heading h1 { max-width: 42rem; color: inherit; font-size: clamp(2.35rem, 5vw, 4.3rem); font-weight: 570; line-height: .98; }
[data-surface="admin"] .admin-page-heading.focused h1 { font-size: clamp(2.2rem, 4.5vw, 3.65rem); }
[data-surface="admin"] .admin-page-heading > div > span { max-width: 42rem; color: color-mix(in srgb, var(--admin-on-hero) 70%, transparent); }
[data-surface="admin"] .admin-page-heading .lifecycle-label { border: 1px solid color-mix(in srgb, var(--admin-on-hero) 18%, transparent); background: color-mix(in srgb, var(--admin-on-hero) 10%, transparent); color: var(--admin-on-hero); }
[data-surface="admin"] .admin-outline-link { border: 1px solid color-mix(in srgb, var(--admin-on-hero) 28%, transparent); background: color-mix(in srgb, var(--admin-on-hero) 12%, transparent); color: var(--admin-on-hero); backdrop-filter: blur(8px); }
[data-surface="admin"] .admin-outline-link:hover { background: color-mix(in srgb, var(--admin-on-hero) 20%, transparent); }
[data-surface="admin"] .admin-priority { min-height: 8.5rem; padding: 1.65rem 1.85rem; border: 0; border-radius: 1.35rem; background: #741d46; color: white; }
[data-surface="admin"] .admin-priority small { color: var(--admin-accent); }
[data-surface="admin"] .admin-priority h2 { color: white; font-size: 1.4rem; }
[data-surface="admin"] .admin-priority p { color: rgb(255 255 255 / 62%); }
[data-surface="admin"] .admin-primary { border: 0; border-radius: .9rem; background: var(--admin-accent); color: #4d1738; box-shadow: none; cursor: pointer; }
[data-surface="admin"] .admin-primary:hover { transform: translateY(-1px); }
[data-surface="admin"] .admin-dashboard-section { margin-top: 2.2rem; }
[data-surface="admin"] .admin-destination-grid { gap: .75rem; }
[data-surface="admin"] .admin-destination-grid > a { min-height: 9.3rem; border: 0; border-radius: 1.25rem; background: #fff; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(1) { background: #ffe0d4; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(2) { background: #ecc9eb; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(3) { background: #91e2d8; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(4) { background: #dff0fb; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(5) { background: #f1e9d7; }
[data-surface="admin"] .admin-destination-grid > a.destination-publish { grid-column: span 2; min-height: 7.4rem; background: #f3e4ee; }
[data-surface="admin"] .admin-destination-grid > a:nth-child(6) { background: #f1e9d7; }
[data-surface="admin"] .destination-icon { width: 2.1rem; height: 2.1rem; border-radius: 50%; background: rgb(255 255 255 / 60%); color: #17181c; }
[data-surface="admin"] .admin-destination-grid b { color: #17181c; }
[data-surface="admin"] .admin-dashboard-footer { border-color: rgb(23 24 28 / 12%); }
[data-surface="admin"] .admin-frame .admin-preview-card,
[data-surface="admin"] .admin-subpage { border: 0; border-radius: 1.4rem; background: rgb(255 255 255 / 88%); }
[data-surface="admin"] .admin-operations { padding: 1.4rem; background: rgb(255 255 255 / 66%); }
[data-surface="admin"] .roster-stats { gap: .6rem; margin: 1rem 0; }
[data-surface="admin"] .roster-stats > span { border-radius: 1rem; background: #f1e9d7; }
[data-surface="admin"] .roster-stats > span:nth-child(1) { background: #ffe0d4; }
[data-surface="admin"] .roster-stats > span:nth-child(2) { background: #dff5e8; }
[data-surface="admin"] .roster-stats > span:nth-child(3) { background: #dff0fb; }
[data-surface="admin"] .review-priority { border-radius: 1.25rem; background: #741d46; color: white; }
[data-surface="admin"] .review-priority small { color: #ecc9eb; }
[data-surface="admin"] .review-priority h2 { color: white; }
[data-surface="admin"] .review-priority p { color: rgb(255 255 255 / 66%); }
[data-surface="admin"] .review-priority > a { background: #ecc9eb; color: #4d1738; }
[data-surface="admin"] .quiet-success { border-radius: 1rem; background: #dff5e8; }
[data-surface="admin"] .review-list { display: grid; gap: .5rem; }
[data-surface="admin"] .review-list > .admin-section-title { margin-bottom: .3rem; }
[data-surface="admin"] .review-row { min-height: 4.6rem; padding: .45rem .75rem; border: 0; border-radius: .9rem; background: white; }
[data-surface="admin"] .row-state { background: var(--admin-soft); }
[data-surface="admin"] .row-state.done { background: #dff5e8; }
[data-surface="admin"] .row-action { display: inline-flex; min-height: 2.2rem; align-items: center; padding: 0 .75rem; border-radius: 999px; background: var(--admin-accent); color: #4d1738; }
[data-surface="admin"] .admin-focused-surface { max-width: 64rem; }
[data-surface="admin"] .admin-focused-surface .share-copy { max-width: 46rem; padding: 1.6rem; border: 0; border-radius: 1.35rem; background: var(--admin-soft); }
[data-surface="admin"] .admin-focused-surface .privacy-chip { background: white; color: #17181c; }
[data-surface="admin"] .admin-focused-surface .primary-action { background: #741d46; color: white; }
[data-surface="admin"] .admin-focused-surface .secondary-action { background: white; }
[data-surface="admin"] .admin-display-surface .configuration-surface { gap: .8rem; }
[data-surface="admin"] .admin-display-surface .configuration-copy,
[data-surface="admin"] .admin-display-surface .class-preview { border: 0; border-radius: 1.35rem; }
[data-surface="admin"] .admin-display-surface .configuration-copy { background: #f0eaff; }
[data-surface="admin"] .admin-display-surface .preview-heading p { margin: .2rem 0 0; color: rgb(255 255 255 / 62%); font-size: .64rem; }
[data-surface="admin"] .theme-choice { border: 0; border-radius: 1rem; background: rgb(255 255 255 / 62%); }
[data-surface="admin"] .theme-choice:has(input:checked) { border-color: transparent; background: white; box-shadow: inset 0 0 0 2px #741d46; }
[data-surface="admin"] .theme-swatch { width: 2.6rem; height: 2.6rem; border-radius: 50%; }
[data-surface="admin"] .admin-display-surface .primary-action { background: #741d46; color: white; }
[data-surface="admin"] .admin-live-preview { border-radius: 1.5rem; background: #202126; }
[data-surface="admin"] .shortcut-manager-preview { padding: 1.35rem; border-radius: 1.3rem; background: #741d46; }
[data-surface="admin"] .shortcut-manager-preview > p { color: #ecc9eb; }
[data-surface="admin"] .shortcut-preview-item { color: rgb(255 255 255 / 55%); }
[data-surface="admin"] .shortcut-preview-item.ready { color: white; }
[data-surface="admin"] .shortcut-preview-item > span { background: rgb(255 255 255 / 14%); }
[data-surface="admin"] .shortcut-category-list { gap: .5rem; border: 0; }
[data-surface="admin"] .shortcut-category { border: 0; border-radius: 1rem; background: white; }
[data-surface="admin"] .shortcut-category > summary { padding: .55rem .8rem; }
[data-surface="admin"] .shortcut-category-icon { border-radius: 50%; background: #dcf8f2; }
[data-surface="admin"] .shortcut-category:nth-child(1) .shortcut-category-icon { background: #ffe0d4; color: #8a442f; }
[data-surface="admin"] .shortcut-category:nth-child(2) .shortcut-category-icon { background: #ecc9eb; color: #741d46; }
[data-surface="admin"] .shortcut-category:nth-child(3) .shortcut-category-icon { background: #dff0fb; color: #3265db; }
[data-surface="admin"] .shortcut-category-body { padding: .5rem 4.1rem 1.35rem 1rem; }
[data-surface="admin"] .automatic-shortcuts { border-radius: 1.3rem; background: #ffe0d4; }
[data-surface="admin"] .admin-identity-settings { max-width: 46rem; padding: 1.5rem; border: 0; border-radius: 1.3rem; background: #f8f3e8; }
[data-surface="admin"] .admin-identity-settings .admin-primary { background: #741d46; color: white; }
[data-surface="admin"] .review-profile-card { border: 0; border-radius: 1.3rem; background: #f8f3e8; }
[data-surface="admin"] .decision-panel { border-radius: 1.2rem; background: #e8f0ff; }
[data-surface="admin"] .decision-panel .product-primary { background: #741d46; }
[data-surface="admin"] .correction-form input { border: 0; background: white; }
[data-surface="admin"] .publish-surface,
[data-surface="admin"] .published-share-surface,
[data-surface="admin"] .archive-surface { max-width: 54rem; padding: 1.6rem; }
[data-surface="admin"] .publish-surface h2,
[data-surface="admin"] .published-share-surface h2,
[data-surface="admin"] .archive-surface h2 { margin: .65rem 0 .25rem; font-size: 1.5rem; font-weight: 650; }
[data-surface="admin"] .publish-surface .admin-primary,
[data-surface="admin"] .archive-surface .admin-primary { width: fit-content; margin-top: 1.1rem; }
[data-surface="admin"] .publish-consequence { max-width: 42rem; margin: 1rem 0 0; padding: .9rem 1rem; border-radius: 1rem; background: #f7edf3; color: #755f6b; font-size: .74rem; line-height: 1.7; }
[data-surface="admin"] .publish-consequence strong { display: block; color: #4d1738; }
[data-surface="admin"] .published-share-surface .share-status { min-height: 1.2rem; margin: .35rem 0; color: #39725b; font-size: .68rem; }
[data-surface="admin"] .published-share-surface .share-link-row { display: grid; grid-template-columns: 1fr auto; gap: .5rem; }
[data-surface="admin"] .published-share-surface .share-link { padding: .8rem; border: 0; border-radius: .8rem; background: #edf7fd; color: #3265db; }
[data-surface="admin"] .published-share-surface .share-message { border: 0; border-radius: 1rem; background: #f8f3e8; }
[data-surface="admin"] .published-share-surface .preview-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
[data-surface="admin"] .published-share-surface .preview-actions form { margin: 0; }
[data-surface="admin"] .published-share-surface .preview-actions .admin-primary { width: auto; }
[data-surface="admin"] .activity-surface { max-width: 54rem; }
[data-surface="admin"] .audit-list { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
[data-surface="admin"] .audit-list li:not(.empty-collection) { display: grid; min-height: 4.4rem; grid-template-columns: 1.8rem 1fr; gap: .15rem .75rem; align-content: center; padding: .6rem .75rem; border-radius: 1rem; background: #f8f3e8; }
[data-surface="admin"] .audit-list li:nth-child(3n + 2) { background: #edf7fd; }
[data-surface="admin"] .audit-list li:nth-child(3n) { background: #fff0e9; }
[data-surface="admin"] .audit-mark { display: grid; width: 1.65rem; height: 1.65rem; grid-row: 1 / 3; place-items: center; border-radius: 50%; background: #ecc9eb; }
[data-surface="admin"] .audit-mark::after { width: .42rem; height: .42rem; border-radius: 50%; background: #741d46; content: ""; }
[data-surface="admin"] .audit-list strong { font-size: .8rem; font-weight: 680; }
[data-surface="admin"] .audit-list li > span:last-child { color: var(--product-ink-muted); font-size: .64rem; }

/* The legend used to sit across the card border. It is now a deliberate section marker. */
.family-card .guardian-fieldset { gap: 1.2rem; padding: 1.35rem; border: 0; border-radius: 1.3rem; background: rgb(255 255 255 / 82%); }
.family-card .guardian-fieldset > legend { display: flex; width: auto; gap: .55rem; align-items: center; margin: 0 0 .25rem; padding: 0; background: transparent; font-size: .86rem; }
.family-card .guardian-fieldset > legend > span { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: #3265db; color: white; font-size: .58rem; }
.family-card .guardian-fieldset-1 > legend > span { background: #ff9b78; color: #17181c; }
.family-card .guardian-fieldset .contact-method { padding: .9rem; border-radius: 1rem; background: #f4f2eb; }

/* The create-class and lifecycle pages live outside the main frame, but use the same voice. */
.app-shell[data-surface="admin"]:has(> .class-create-card) { display: grid; min-height: 100vh; place-items: center; padding: 2rem; background: linear-gradient(145deg, #3265db 0 54%, #dff0fb 54%); }
[data-surface="admin"] > .class-create-card { width: min(100%, 46rem); padding: clamp(1.5rem, 5vw, 3rem); border: 0; border-radius: 1.7rem; background: #3265db; box-shadow: none; }
[data-surface="admin"] > .class-create-card .privacy-chip { background: #ecc9eb; color: #4d1738; }
[data-surface="admin"] > .class-create-card h1 { color: white; font-size: clamp(2.8rem, 7vw, 4.8rem); line-height: .95; }
[data-surface="admin"] > .class-create-card > p { max-width: 29rem; color: rgb(255 255 255 / 72%); }
[data-surface="admin"] > .class-create-card > form:first-of-type { margin-top: 1.2rem; padding: 1.3rem; border-radius: 1.25rem; background: white; }
[data-surface="admin"] > .class-create-card .primary-action { border-radius: .9rem; background: #741d46; }
[data-surface="admin"] > .class-create-card .quiet-action .secondary-action { color: white; }
[data-surface="admin"] > .admin-preview-card { position: relative; width: min(calc(100% - 2rem), 48rem); margin: 3rem auto; overflow: hidden; border: 0; border-radius: 1.7rem; background: white; box-shadow: none; }
[data-surface="admin"] > .admin-preview-card::before { display: block; height: .65rem; margin: calc(clamp(1.5rem, 5vw, 4.25rem) * -1) calc(clamp(1.5rem, 5vw, 4.25rem) * -1) 2rem; background: linear-gradient(90deg, #741d46 0 42%, #91e2d8 42% 70%, #ecc9eb 70%); content: ""; }

@media (min-width: 50rem) {
  [data-surface="class"] .class-hub { min-height: calc(100vh - 4rem); margin-block: 2rem; border-radius: 2rem; box-shadow: 0 1.5rem 3.75rem rgb(23 24 28 / 7%); }
  [data-surface="class"] .profile-sheet { margin-bottom: 2rem; border-radius: 1.9rem; }
}

@media (max-width: 39rem) {
  .product-page { width: min(calc(100% - 2rem), 46rem); padding-top: 1.25rem; }
  .field-grid-two, .birthday-fields, .contact-methods { grid-template-columns: 1fr; }
  .family-card { width: 100%; padding: .9rem .9rem 3rem; }
  .family-card .product-page-heading { padding: 0 .25rem; }
  .family-form-hero { min-height: 15.5rem; grid-template-columns: minmax(0, 1fr) 5.5rem; gap: .7rem; padding: 1.35rem; border-radius: 1.45rem; }
  .family-form-hero::after { right: -7rem; bottom: -8rem; }
  .family-form-hero h1 { font-size: clamp(2.25rem, 12vw, 3.15rem); }
  .family-form-hero .product-lead { font-size: .78rem; }
  .family-form-hero-art { width: 5.4rem; height: 5.4rem; }
  .family-form-hero-art > span { font-size: 1.5rem; }
  .family-form-hero-art > i { right: -.25rem; bottom: -.05rem; width: 2rem; height: 2rem; border-width: .3rem; }
  .family-form-hero-art > b { top: -.45rem; left: -.15rem; width: 1.8rem; height: 1.8rem; font-size: .95rem; }
  .family-progress > span { min-height: 3rem; gap: .3rem; font-size: .62rem; }
  .family-progress b { width: 1.3rem; height: 1.3rem; font-size: .56rem; }
  .child-identity-grid, .child-details-grid { grid-template-columns: 1fr; }
  .child-name-field { min-height: 9.5rem; padding: 1.1rem; }
  .photo-picker { min-height: 9.5rem; }
  .child-detail-card { min-height: 0; }
  .child-detail-card .birthday-fields { grid-template-columns: 4.7rem minmax(0, 1fr); }
  .app-shell[data-surface="admin"] { padding: 0; }
  [data-surface="admin"] .class-create-card.saved-draft,
  [data-surface="admin"] .product-page.admin-subpage,
  [data-surface="admin"] .admin-preview-card { min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
  [data-surface="admin"] .admin-app { min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
  [data-surface="admin"] .admin-nav { padding: 0 1.2rem; }
  [data-surface="admin"] .admin-content { padding-top: 2.2rem; }
  [data-surface="admin"] .admin-heading { align-items: start; flex-direction: column; }
  [data-surface="admin"] .admin-priority { grid-template-columns: 1fr; }
  [data-surface="admin"] .admin-primary { width: 100%; }
  [data-surface="admin"] .roster-stats { grid-template-columns: repeat(3, 1fr); }
  [data-surface="admin"] .roster-stats > span { padding: .8rem .6rem; }
  [data-surface="admin"] .families-tabs { overflow-x: auto; }
  [data-surface="admin"] .families-tab { min-width: 6.5rem; }
  [data-surface="admin"] .families-panel { min-height: 18rem; }
  [data-surface="admin"] .families-panel-heading { align-items: start; flex-direction: column; gap: .35rem; }
  [data-surface="admin"] .profile-management-row { grid-template-columns: 2.25rem minmax(0, 1fr); padding: .75rem 0; }
  [data-surface="admin"] .profile-management-row .review-actions { grid-column: 1 / -1; justify-content: stretch; }
  [data-surface="admin"] .profile-management-row .review-actions form { flex: 1; }
  [data-surface="admin"] .profile-management-row .review-actions button { width: 100%; }
  [data-surface="admin"] .review-priority { grid-template-columns: 1fr; }
  [data-surface="admin"] .review-priority > a { justify-content: center; }
  [data-surface="admin"] .expected-size-form { grid-template-columns: 1fr; }
  [data-surface="admin"] .roster-settings .expected-size-form .secondary-action { box-sizing: border-box; width: 100%; }
  [data-surface="admin"] .review-tools > summary { grid-template-columns: 1fr; }
  [data-surface="admin"] .review-tools .review-actions { display: grid; grid-template-columns: 1fr; }
  [data-surface="admin"] .review-tools .review-actions form,
  [data-surface="admin"] .review-tools .review-actions button { width: 100%; }
  [data-surface="admin"] .guardian-preview-row { align-items: start; gap: .7rem; padding-block: .8rem; }
  [data-surface="admin"] .review-contact-list { justify-items: end; }
  [data-surface="admin"] .correction-form > div, [data-surface="admin"] .decision-panel.horizontal { grid-template-columns: 1fr; }
  [data-surface="admin"] .admin-frame { display: block; }
  [data-surface="admin"] .admin-sidebar { display: none; }
  [data-surface="admin"] .admin-mobile-header { display: flex; min-height: 3.5rem; align-items: center; justify-content: space-between; padding: 0 1rem; border: 0; border-bottom: 1px solid #eadfe3; background: #fbf8f5; }
  [data-surface="admin"] .admin-mobile-header .admin-shell-logo { color: #1e2330; }
  [data-surface="admin"] .admin-mobile-header strong { overflow: hidden; max-width: 11rem; color: #4d1738; font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
  [data-surface="admin"] .admin-page-content { width: auto; padding: 1.6rem 1rem 6.5rem; }
  [data-surface="admin"] .admin-mobile-nav { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: grid; overflow-x: auto; grid-auto-columns: minmax(4.2rem, 1fr); grid-auto-flow: column; padding: .4rem .35rem max(.45rem, env(safe-area-inset-bottom)); border-top: 1px solid #deded8; background: rgb(255 255 255 / 96%); backdrop-filter: blur(12px); scrollbar-width: none; }
  [data-surface="admin"] .admin-mobile-nav .admin-shell-link { display: flex; min-height: 2.8rem; flex-direction: column; gap: .1rem; justify-content: center; padding: .2rem; border-radius: .5rem; }
  [data-surface="admin"] .admin-mobile-nav .admin-shell-link:not(.active) { color: #73766f; }
  [data-surface="admin"] .admin-mobile-nav .admin-shell-link > span { height: 1.1rem; font-size: .8rem; }
  [data-surface="admin"] .admin-mobile-nav .admin-shell-link svg { width: .95rem; height: .95rem; }
  [data-surface="admin"] .admin-mobile-nav .admin-shell-link b { font-size: .57rem; }
  [data-surface="admin"] .admin-page-heading { min-height: 12rem; align-items: flex-start; flex-direction: column; gap: 1rem; margin-bottom: 1rem; padding: 1.35rem; }
  [data-surface="admin"] .admin-page-heading h1,
  [data-surface="admin"] .admin-page-heading.focused h1 { font-size: clamp(2.3rem, 11vw, 3.15rem); }
  [data-surface="admin"] .admin-priority { padding: 1.25rem; }
  [data-surface="admin"] .admin-destination-grid { grid-template-columns: 1fr; }
  [data-surface="admin"] .admin-destination-grid > a.destination-publish { grid-column: span 1; }
  [data-surface="admin"] .admin-dashboard-footer form { margin-inline-start: 0; }
  [data-surface="admin"] .admin-display-surface .configuration-surface { grid-template-columns: 1fr; }
  [data-surface="admin"] .shortcut-edit-form { grid-template-columns: 1fr; }
  [data-surface="admin"] .shortcut-category-body { padding-inline-start: 0; }
  [data-surface="admin"] .automatic-shortcuts { align-items: flex-start; flex-direction: column; }
  [data-surface="admin"] .automatic-shortcut-pills { flex-wrap: wrap; }
  [data-surface="admin"] .admin-subpage,
  [data-surface="admin"] .admin-frame .admin-preview-card { min-height: 0; padding: 1.1rem; border: 0; border-radius: 1.1rem; }
  [data-surface="admin"] .shortcut-category-body { padding: .5rem .8rem 1rem; }
  .app-shell[data-surface="admin"]:has(> .class-create-card) { padding: 1rem; }
  [data-surface="auth"] .auth-layout { width: min(100% - 2rem, 68rem); padding-top: 1.2rem; }
  [data-surface="auth"] .auth-main { display: block; min-height: auto; padding-top: 4rem; }
  [data-surface="auth"] .auth-copy h1 { font-size: clamp(2.8rem, 15vw, 4rem); }
  [data-surface="auth"] .auth-copy .product-lead { font-size: .9rem; }
  [data-surface="auth"] .auth-points { margin-top: 1.8rem; }
  [data-surface="auth"] .auth-action { margin-top: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  [data-surface] *, [data-surface] *::before, [data-surface] *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}