/* Phase 20 — Learner & Family. Immediate surface owns contrast; family support never overrides private learner-domain boundaries. */
:root{--ce-family-ink:#07111f;--ce-family-muted:#405168;--ce-family-line:#d7e0eb;--ce-family-light:#f6f9fc;--ce-family-white:#fff;--ce-family-night:#071527;--ce-family-blue:#0d47a1;--ce-family-blue-deep:#082f75;--ce-family-sky:#dcecff;--ce-family-green:#0d5c42;--ce-family-green-bg:#e8f8f1;--ce-family-red:#842029;--ce-family-red-bg:#fff0f1;--ce-family-radius:22px;--ce-family-shadow:0 22px 60px rgba(10,35,67,.10)}
.ce-family-shell{max-width:1180px;margin:0 auto;padding:clamp(1rem,3vw,2.5rem);color:var(--ce-family-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.ce-family-hero{display:grid;gap:1rem;padding:clamp(1.5rem,5vw,3.8rem);border-radius:clamp(20px,4vw,34px);background:linear-gradient(135deg,#061529,#0b3d7d 72%,#1160aa);box-shadow:var(--ce-family-shadow);color:#fff}
.ce-family-hero,.ce-family-hero h1,.ce-family-hero h2,.ce-family-hero h3,.ce-family-hero p,.ce-family-hero strong,.ce-family-hero span,.ce-family-hero a{color:#fff}
.ce-family-hero h1{max-width:850px;margin:0;font-size:clamp(2.1rem,5.4vw,4.9rem);line-height:.98;letter-spacing:-.045em}.ce-family-hero p{max-width:850px;margin:0;font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.72;color:#e8f2ff}.ce-family-eyebrow{margin:0 0 .25rem;font-size:.78rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.ce-family-grid{display:grid;gap:1rem}.ce-family-grid--summary{grid-template-columns:repeat(3,minmax(0,1fr));margin:1rem 0}.ce-family-learner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.ce-family-card,.ce-family-panel,.ce-family-learner-card,.ce-family-link-row{background:#fff;color:var(--ce-family-ink);border:1px solid var(--ce-family-line);border-radius:var(--ce-family-radius);box-shadow:0 12px 34px rgba(10,35,67,.06)}
.ce-family-card *,.ce-family-panel *,.ce-family-learner-card *,.ce-family-link-row *{color:inherit}.ce-family-card{padding:1.2rem;display:grid;gap:.25rem}.ce-family-card strong{font-size:clamp(1.25rem,3vw,2.15rem);line-height:1.05;color:var(--ce-family-ink)}.ce-family-card span,.ce-family-panel p,.ce-family-learner-card p,.ce-family-link-row span{color:var(--ce-family-muted);line-height:1.65}
.ce-family-panel{margin-top:1rem;padding:clamp(1.15rem,3vw,2rem)}.ce-family-panel h2,.ce-family-panel h3,.ce-family-learner-card h3{margin:.15rem 0 .6rem;color:var(--ce-family-ink);line-height:1.15}.ce-family-section-heading{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem}
.ce-family-learner-card{padding:1.25rem}.ce-family-pill{display:inline-flex;padding:.36rem .65rem;border-radius:999px;background:var(--ce-family-sky);color:#09346d!important;font-weight:800;font-size:.78rem}.ce-family-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:1rem 0}.ce-family-metrics>div{padding:.8rem;border-radius:16px;background:var(--ce-family-light);color:var(--ce-family-ink)}.ce-family-metrics strong{display:block;font-size:1.25rem;color:var(--ce-family-ink)}.ce-family-metrics span{display:block;margin-top:.2rem;font-size:.82rem;color:var(--ce-family-muted)}
.ce-family-checkin,.ce-family-preferences{display:grid;gap:.8rem;margin-top:1rem}.ce-family-checkin label,.ce-family-preferences label{display:grid;gap:.4rem;font-weight:750;color:var(--ce-family-ink)}.ce-family-checkin select,.ce-family-preferences select,.ce-family-panel input,.ce-family-panel select,.ce-family-panel textarea{width:100%;min-height:48px;border:1px solid #aab9cc;border-radius:12px;background:#fff;color:var(--ce-family-ink);padding:.68rem .78rem}.ce-family-panel input:focus,.ce-family-panel select:focus,.ce-family-panel textarea:focus{outline:3px solid rgba(13,71,161,.24);outline-offset:2px;border-color:var(--ce-family-blue)}
.ce-family-notice{margin:1rem 0;padding:1rem 1.1rem;border-radius:16px;border:1px solid currentColor;font-weight:700}.ce-family-notice--success{background:var(--ce-family-green-bg);color:var(--ce-family-green)}.ce-family-notice--error{background:var(--ce-family-red-bg);color:var(--ce-family-red)}
.ce-family-shell .ce-button,.ce-family-public .ce-button,.ce-family-learner-control .ce-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border-radius:12px;padding:.7rem 1rem;text-decoration:none;font-weight:850;border:2px solid transparent;transition:transform .16s ease,box-shadow .16s ease}.ce-family-shell .ce-button--primary,.ce-family-shell .ce-button--primary:visited,.ce-family-public .ce-button--primary,.ce-family-public .ce-button--primary:visited,.ce-family-learner-control .ce-button--primary,.ce-family-learner-control .ce-button--primary:visited{background:var(--ce-family-blue);color:#fff!important}.ce-family-shell .ce-button--primary:hover,.ce-family-shell .ce-button--primary:focus-visible,.ce-family-public .ce-button--primary:hover,.ce-family-public .ce-button--primary:focus-visible,.ce-family-learner-control .ce-button--primary:hover,.ce-family-learner-control .ce-button--primary:focus-visible{background:var(--ce-family-blue-deep);color:#fff!important;transform:translateY(-1px);box-shadow:0 9px 24px rgba(8,47,117,.22)}.ce-family-shell .ce-button--secondary,.ce-family-shell .ce-button--secondary:visited,.ce-family-public .ce-button--secondary,.ce-family-public .ce-button--secondary:visited,.ce-family-learner-control .ce-button--secondary,.ce-family-learner-control .ce-button--secondary:visited{background:#fff;color:var(--ce-family-blue-deep)!important;border-color:#8eadd3}.ce-family-shell .ce-button--secondary:hover,.ce-family-shell .ce-button--secondary:focus-visible,.ce-family-public .ce-button--secondary:hover,.ce-family-public .ce-button--secondary:focus-visible,.ce-family-learner-control .ce-button--secondary:hover,.ce-family-learner-control .ce-button--secondary:focus-visible{background:#eaf3ff;color:#082f75!important;border-color:#4779b7}
.ce-family-link-list{display:grid;gap:.7rem}.ce-family-link-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1rem}.ce-family-link-row strong{display:block;color:var(--ce-family-ink)}.ce-family-link-row summary{cursor:pointer;font-weight:800;color:var(--ce-family-blue-deep)}.ce-family-privacy-panel{background:#eef5ff;color:var(--ce-family-ink);border-color:#bdd2ee}.ce-family-privacy-panel p{color:#31465f}.ce-family-learner-control{margin-top:1.25rem}
.ce-family-public{max-width:1180px;margin:0 auto;padding:clamp(1rem,3vw,2.5rem)}.ce-family-public .ce-family-public-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1.2rem 0}.ce-family-public-card{padding:1.35rem;border:1px solid var(--ce-family-line);border-radius:20px;background:#fff;color:var(--ce-family-ink)}.ce-family-public-card p{color:var(--ce-family-muted);line-height:1.65}.ce-family-public-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}
@media(max-width:820px){.ce-family-grid--summary,.ce-family-learner-grid,.ce-family-public .ce-family-public-grid{grid-template-columns:1fr}.ce-family-metrics{grid-template-columns:1fr}.ce-family-link-row{display:grid}.ce-family-section-heading{display:grid;align-items:start}}
@media(prefers-reduced-motion:reduce){.ce-family-shell .ce-button,.ce-family-public .ce-button,.ce-family-learner-control .ce-button{transition:none}}
.ce-family-details{margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--ce-family-line)}.ce-family-details>summary{cursor:pointer;font-weight:850;color:var(--ce-family-blue-deep)}.ce-family-details>p{margin:.65rem 0}.ce-family-permission-form,.ce-family-invite-form{display:grid;gap:.75rem;margin-top:1rem;padding:1rem;border-radius:16px;background:var(--ce-family-light);color:var(--ce-family-ink)}.ce-family-permission-form fieldset{display:grid;gap:.55rem;margin:0;padding:0;border:0}.ce-family-permission-form legend{margin-bottom:.5rem;font-weight:850;color:var(--ce-family-ink)}.ce-family-check{display:flex!important;align-items:flex-start;gap:.55rem!important;font-weight:650!important;color:var(--ce-family-ink)!important}.ce-family-check input[type=checkbox]{width:1rem!important;min-height:1rem!important;margin-top:.22rem;accent-color:var(--ce-family-blue)}.ce-family-subpanel{margin-top:1rem;padding:1rem;border-radius:17px;background:var(--ce-family-light);color:var(--ce-family-ink)}.ce-family-subpanel h3{margin-top:0}.ce-family-checkin-list{display:grid;gap:.65rem}.ce-family-checkin-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem;border-radius:14px;background:#fff;border:1px solid var(--ce-family-line);color:var(--ce-family-ink)}.ce-family-checkin-item p{margin:.15rem 0 0;color:var(--ce-family-muted)}.ce-family-preference-checks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.ce-family-quiet-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.ce-family-quiet-grid label{display:grid;gap:.4rem}.ce-family-invite-form h4{margin:0;color:var(--ce-family-ink)}
@media(max-width:760px){.ce-family-preference-checks,.ce-family-quiet-grid{grid-template-columns:1fr}.ce-family-checkin-item{display:grid}}

.ce-family-shell .ce-button:focus-visible,.ce-family-public .ce-button:focus-visible,.ce-family-learner-control .ce-button:focus-visible{outline:3px solid #9bc7ff;outline-offset:3px}
.ce-family-hero .ce-button--secondary,.ce-family-hero .ce-button--secondary:visited{background:#fff;color:#082f75!important;border-color:#fff}.ce-family-hero .ce-button--secondary:hover,.ce-family-hero .ce-button--secondary:focus-visible{background:#eaf3ff;color:#082f75!important;border-color:#eaf3ff}

/* Phase 20 final presentation authority — the immediate surface always wins over inherited public-theme selectors. */
body .ce-main .ce-family-shell .ce-family-hero,
body .ce-main.ce-family-public .ce-family-hero{color:#fff!important}
body .ce-main .ce-family-shell .ce-family-hero h1,
body .ce-main .ce-family-shell .ce-family-hero h2,
body .ce-main .ce-family-shell .ce-family-hero h3,
body .ce-main .ce-family-shell .ce-family-hero strong,
body .ce-main .ce-family-shell .ce-family-hero span,
body .ce-main .ce-family-shell .ce-family-hero a,
body .ce-main.ce-family-public .ce-family-hero h1,
body .ce-main.ce-family-public .ce-family-hero h2,
body .ce-main.ce-family-public .ce-family-hero h3,
body .ce-main.ce-family-public .ce-family-hero strong,
body .ce-main.ce-family-public .ce-family-hero span,
body .ce-main.ce-family-public .ce-family-hero a{color:#fff!important}
body .ce-main .ce-family-shell .ce-family-hero p,
body .ce-main.ce-family-public .ce-family-hero p{color:#e8f2ff!important}
body .ce-main .ce-family-shell .ce-button--secondary,
body .ce-main .ce-family-shell .ce-button--secondary:visited,
body .ce-main .ce-family-public .ce-button--secondary,
body .ce-main .ce-family-public .ce-button--secondary:visited,
body .ce-main .ce-family-learner-control .ce-button--secondary,
body .ce-main .ce-family-learner-control .ce-button--secondary:visited{background:#fff!important;color:#082f75!important;border-color:#8eadd3!important}
body .ce-main .ce-family-shell .ce-button--secondary:hover,
body .ce-main .ce-family-shell .ce-button--secondary:focus-visible,
body .ce-main .ce-family-public .ce-button--secondary:hover,
body .ce-main .ce-family-public .ce-button--secondary:focus-visible,
body .ce-main .ce-family-learner-control .ce-button--secondary:hover,
body .ce-main .ce-family-learner-control .ce-button--secondary:focus-visible{background:#eaf3ff!important;color:#082f75!important;border-color:#4779b7!important}
body .ce-main .ce-family-shell .ce-family-hero .ce-button--secondary,
body .ce-main .ce-family-shell .ce-family-hero .ce-button--secondary:visited,
body .ce-main .ce-family-shell .ce-family-hero .ce-button--secondary:hover,
body .ce-main .ce-family-shell .ce-family-hero .ce-button--secondary:focus-visible{background:#fff!important;color:#082f75!important;border-color:#fff!important}
