/* NeXt Chapter Recovery Youth Hub — Phase 6.4 shared experience layer.
   Loaded AFTER app.css and phase6.css. Scoped overrides avoid changing server forms. */
:root {
  --hub-ink:#192d36; --hub-ink-soft:#42606d; --hub-quiet:#5a6c76;
  --hub-blue:#164756; --hub-teal:#0f7779; --hub-tangerine:#cf552b;
  --hub-lime:#d9f2e9; --hub-ice:#eaf4f8; --hub-sun:#fff2db;
  --hub-outline:#d3e2e6; --hub-focus:#d05b17;
  --hub-shadow:0 15px 44px rgba(27,51,61,.075);
  --hub-radius:20px;
}
html {scroll-padding-top:108px;}
body {color:var(--hub-ink); line-height:1.62;}
body,main,.site-footer {min-width:0;}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline:3px solid var(--hub-focus)!important;
  outline-offset:3px;
}
:where(button,summary) {touch-action:manipulation;}
:where(.shell,.card,.grid,.section,.section-tight,.page-hero,main) {min-width:0;}
:where(.card,.feature-card,.stat-card,.quest-tile,.play-tile) {overflow-wrap:anywhere;}
:where(p,li,small) {overflow-wrap:break-word;}
:where(input,textarea,select) {min-width:0; max-width:100%;}
:where(textarea) {resize:vertical;}
:where(.section,.section-tight) {scroll-margin-top:100px;}
:where(.section-head,.hero-actions,.phase6-row) {flex-wrap:wrap;}
.site-header {top:0!important; z-index:65!important; background:rgba(255,255,255,.97); border-bottom:1px solid #dfebe8; box-shadow:0 5px 19px rgba(16,46,51,.045);}
.site-header.is-scrolled {box-shadow:0 9px 32px rgba(18,49,60,.11);}
.site-header .shell {width:min(1320px,calc(100% - 44px));}
.site-header .hub-header-inner {min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:clamp(9px,1vw,16px); position:relative;}
.site-header .hub-brand {flex:0 0 auto; display:inline-flex; align-items:center; gap:10px; min-width:0; text-decoration:none;}
.site-header .hub-brand .brand-logo-frame {width:52px;height:52px; flex-shrink:0; border-radius:16px;}
.site-header .hub-brand .brand-copy {display:grid;gap:2px;line-height:1.12;}
.site-header .hub-brand .brand-copy strong {font-size:clamp(.84rem,1.02vw,.99rem);font-weight:900;max-width:none;white-space:normal;line-height:1.13;letter-spacing:-.015em;}
.site-header .hub-brand .brand-copy small {font-size:.66rem;letter-spacing:.12em;font-weight:900;color:var(--hub-teal);margin-top:2px;}
.site-header .hub-header-actions {display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;gap:8px;}
.site-header .hub-help-now {order:0;display:inline-flex;gap:6px;align-items:center;justify-content:center;min-height:44px;padding:9px 12px;border:1.5px solid #ac4d2f;border-radius:999px;background:#fff5ee;color:#822f1a;font-size:.86rem;font-weight:900;box-shadow:none;margin:0;text-decoration:none;}
.site-header .hub-help-now:hover {background:#ffe7d8;}
.site-header .hub-quick-btn {border:1px solid #dbe4e8;background:#f2f7f8;color:var(--hub-ink);font-size:1.3rem;box-shadow:none;cursor:pointer;}
.site-header :where(.hub-account-dashboard,.hub-sign-in) {display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:12px;padding:8px 10px;font-weight:800;font-size:.89rem;color:var(--hub-blue);}
.site-header :where(.hub-account-dashboard,.hub-sign-in):hover {background:var(--hub-ice);}
.site-header .hub-level {font-size:.69rem;color:#206164;background:#e2f4ef;border-radius:999px;padding:3px 6px;margin-left:5px;white-space:nowrap;}
.site-header .hub-unread-indicator {width:8px;height:8px;border-radius:50%;background:#be472b;display:inline-block;}
.site-header .hub-join {padding:10px 14px;white-space:nowrap;box-shadow:none;background:var(--hub-teal);color:#fff;}
.site-header .hub-account-dropdown {position:relative; flex:0 0 auto;}
.site-header .hub-account-dropdown>summary {list-style:none;min-height:42px;min-width:56px;display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 10px;border:1px solid var(--hub-outline);border-radius:12px;background:#fff;cursor:pointer;}
.site-header .hub-account-dropdown>summary::-webkit-details-marker {display:none;}
.site-header .hub-account-dropdown[open]>summary {background:var(--hub-ice);}
.site-header .hub-account-panel {left:auto!important;right:0!important;}
/* Desktop: deliberately keep five concise groups instead of a row of individual routes. */
.site-header .hub-primary-nav {position:static; flex:1 1 auto; min-width:0; width:auto;transform:none;box-shadow:none;background:transparent;border:0;overflow:visible;padding:0;margin:0;display:flex;align-items:center;justify-content:center;gap:2px;flex-direction:row;}
.site-header .hub-primary-nav .hub-nav-direct,
.site-header .hub-primary-nav .hub-nav-trigger {font-size:.9rem;font-weight:800;color:#2f4b56;white-space:nowrap;line-height:1.25;border:1px solid transparent;border-radius:12px;min-height:42px;padding:10px clamp(8px,.85vw,13px);display:flex;align-items:center;gap:7px;background:transparent;cursor:pointer;}
.site-header .hub-primary-nav .hub-nav-direct:hover,
.site-header .hub-primary-nav .hub-nav-trigger:hover,
.site-header .hub-primary-nav :where(.hub-nav-direct,.hub-nav-trigger).active,
.site-header .hub-primary-nav .hub-nav-group[open]>.hub-nav-trigger {background:#eaf6f3; color:#17595b; border-color:#daebe6;box-shadow:none;}
.site-header .hub-nav-group {position:relative;flex:0 0 auto;}
.site-header .hub-nav-group>summary {list-style:none;user-select:none;}
.site-header .hub-nav-group>summary::-webkit-details-marker {display:none;}
.site-header .hub-nav-chevron {font-size:1rem;line-height:1;display:inline-block;transition:transform .16s ease;}
.site-header details[open]>.hub-nav-trigger .hub-nav-chevron,
.site-header .hub-account-dropdown[open]>summary .hub-nav-chevron {transform:rotate(180deg);}
.site-header .hub-nav-panel {position:absolute;top:calc(100% + 10px);left:0;right:auto;width:min(350px,calc(100vw - 32px));min-width:285px;max-height:min(67vh,640px);overflow-y:auto;overscroll-behavior:contain;background:#fff;border:1px solid #d8e4e5;border-radius:19px;box-shadow:0 22px 62px rgba(18,49,60,.17);padding:10px;display:grid;grid-template-columns:minmax(0,1fr);gap:2px;z-index:75;}
.site-header .hub-nav-panel .hub-nav-destination {display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;gap:11px;min-width:0;min-height:62px;padding:9px 10px;border-radius:11px;border:1px solid transparent;text-decoration:none;color:var(--hub-ink);white-space:normal;line-height:1.28;}
.site-header .hub-nav-panel .hub-nav-destination:hover,
.site-header .hub-nav-panel .hub-nav-destination.active {border-color:#d6eae5;background:#eef7f5;color:#124f53;}
.site-header .hub-nav-destination .hub-nav-icon {display:grid;place-items:center;width:39px;height:39px;border-radius:12px;font-size:1.18rem;background:#f3f7f7;}
.site-header .hub-nav-destination strong {display:block;font-size:.92rem;line-height:1.25;font-weight:850;}
.site-header .hub-nav-destination small {display:block;font-size:.77rem;line-height:1.3;letter-spacing:0;margin-top:3px;color:#526b73;font-weight:550;}
.site-header .hub-drawer-heading,.site-header .hub-mobile-account {display:none;}
.site-header .hub-menu-toggle {display:none;margin:0;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid #d2e0df;border-radius:12px;box-shadow:none;}
.site-header .hub-menu-toggle span {background:#254954;}
.mobile-nav-backdrop {pointer-events:none;}
/* Content rhythm and typographic scale across both older and new PHP pages. */
.page-hero {padding:clamp(38px,5vw,65px) 0 clamp(34px,4vw,52px);}
.page-hero h1 {font-size:clamp(2rem,4.2vw,3.7rem);line-height:1.09;letter-spacing:-.04em;max-width:940px;text-wrap:balance;}
.page-hero p {max-width:810px;font-size:clamp(1rem,1.45vw,1.14rem);line-height:1.7;}
.page-hero :where(.crumb,.eyebrow) {font-weight:850;}
.section {padding:clamp(36px,5vw,70px) 0;}
.section-tight {padding:clamp(24px,3vw,42px) 0;}
.section-head {align-items:flex-start;}
.section-head h2 {line-height:1.17;text-wrap:balance;}
.card,.stat-card {border:1px solid #dce6e7;border-radius:var(--hub-radius);box-shadow:var(--hub-shadow);}
.card {padding:clamp(18px,2.2vw,28px);}
.card>h2:first-child,.card>h3:first-child {margin-top:0;line-height:1.22;}
.card p {line-height:1.7;}
.feature-card:hover {box-shadow:0 20px 44px rgba(23,50,77,.11);}
.stat-row {grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.stat-card strong {font-variant-numeric:tabular-nums;}
.grid,.phase6-cards,.quest-grid,.dashboard-grid,.phase6-layout {min-width:0;}
.grid>* ,.phase6-cards>* ,.quest-grid>* ,.dashboard-grid>* ,.phase6-layout>* {min-width:0;}
:where(.card,.phase6-entry,.quest-panel,.play-console,.play-tile,.stat-card) :where(a,button) {max-width:100%;}
:where(.btn,.play-action,.quest-choice) {text-decoration:none;min-height:44px;line-height:1.32;}
.btn {white-space:normal;text-align:center;box-shadow:0 6px 15px rgba(18,96,91,.12);}
.btn:disabled {cursor:not-allowed;opacity:.62;transform:none;}
:where(.form-grid,.phase6-form) :where(input:not([type=checkbox]):not([type=radio]),textarea,select),
:where(input.field,textarea.field,select.field) {min-height:44px;border-radius:12px;border-color:#b9ccd0;background:#fff;color:#16333f;}
:where(.form-grid,.phase6-form) textarea {min-height:115px;line-height:1.55;}
:where(.form-grid,.phase6-form) label {line-height:1.5;}
:where(input,select,textarea)::placeholder {color:#5e757d;opacity:1;}
:where(.form-grid,.phase6-form) :where(input,textarea,select):focus-visible {border-color:#158285;box-shadow:0 0 0 3px rgba(21,130,133,.18);}
:where(.modal-panel,.play-console,.phase6-recovery,.quest-panel) {max-width:calc(100vw - 24px);}
:where(.modal-panel,.consent-panel) {max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;}
:where(.modal,.consent-panel) :where(button,a) {min-height:42px;}
:where(.flash) {margin-block:12px;}
:where(.phase6-cards,.quest-grid) {gap:clamp(14px,2.5vw,25px);}
.phase6-quicklinks a {min-height:44px;display:inline-flex;align-items:center;white-space:normal;}
.phase6-cards>.card {gap:.65rem;}
.phase6-hero h1 {max-width:950px;}
.quest-choice {min-width:0;}
.quest-choice:active,.btn:active {transform:translateY(1px);}
.quest-tile {padding:clamp(20px,2.6vw,32px);}
.quest-panel {width:100%;}
.phase6-hero .eyebrow {color:#12454c;background:#e8faf9;}
/* ADMIN: keep all routes, grouped in keyboard-accessible menus, without a 17-link wrap. */
.admin-nav.hub-admin-nav {display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:22px 0 5px;}
.admin-nav.hub-admin-nav .hub-admin-home,
.admin-nav.hub-admin-nav .hub-admin-menu>summary {min-height:42px;display:inline-flex;align-items:center;gap:8px;list-style:none;border:1px solid #d8e6e7;border-radius:12px;background:#fff;color:#18444f;padding:9px 15px;font-weight:850;cursor:pointer;white-space:normal;}
.admin-nav.hub-admin-nav .hub-admin-home.active,
.admin-nav.hub-admin-nav .hub-admin-menu.is-current>summary,
.admin-nav.hub-admin-nav .hub-admin-menu[open]>summary {background:#1b505c;color:#fff;border-color:#1b505c;}
.admin-nav.hub-admin-nav .hub-admin-menu>summary::-webkit-details-marker {display:none;}
.admin-nav.hub-admin-nav .hub-admin-menu {position:relative;}
.admin-nav.hub-admin-nav .hub-admin-links {position:absolute;top:calc(100% + 8px);left:0;width:min(290px,calc(100vw - 34px));max-height:70vh;overflow-y:auto;background:#fff;padding:10px;border:1px solid #d6e4e5;border-radius:15px;box-shadow:0 18px 45px rgba(12,34,48,.2);z-index:25;display:grid;gap:3px;}
.admin-nav.hub-admin-nav .hub-admin-links a {display:block;border-radius:8px;padding:11px 13px;background:transparent;color:#254a58;font-weight:740;text-decoration:none;}
.admin-nav.hub-admin-nav .hub-admin-links a:hover,
.admin-nav.hub-admin-nav .hub-admin-links a[aria-current=page] {background:#e8f5f3;color:#164c4d;}
.admin-nav.hub-admin-nav a:focus-visible,.admin-nav.hub-admin-nav summary:focus-visible {outline-color:#ffc271!important;}
.site-footer {margin-top:clamp(22px,3vw,45px);}
.site-footer .footer-grid {gap:clamp(20px,3vw,44px);}
.site-footer .footer-grid>div {min-width:0;}
.site-footer .footer-grid a {min-height:31px;overflow-wrap:anywhere;}
.site-footer .youth-accessibility-tools {display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.site-footer [data-youth-access] {min-height:42px;padding:9px 12px;border:1px solid rgba(255,255,255,.36);border-radius:11px;cursor:pointer;}
.site-footer [data-youth-access][aria-pressed=true] {background:#ffebc9;color:#3c2117;border-color:#ffebc9;}
.hub-field-count {display:block;justify-self:end;color:#526d77;font-size:.76rem;margin-top:2px;font-variant-numeric:tabular-nums;}
.hub-field-count.is-near-limit {color:#9a3e1c;font-weight:800;}
.hub-form-busy {opacity:.95;}
.hub-form-busy [type=submit] {cursor:progress;}
/* The original v5 mobile drawer starts at 1280px. This single override owns its visuals. */
@media (max-width:1280px) {
  .site-header .shell {width:min(100% - 28px,1240px);}
  .site-header .hub-header-inner {min-height:76px;}
  .site-header .hub-brand .brand-copy {display:grid;}
  .site-header .hub-primary-nav {position:fixed;inset:0 0 0 auto;top:0;bottom:0;right:0;left:auto;width:min(430px,92vw);height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding:85px 18px max(38px,env(safe-area-inset-bottom));background:#fff;box-shadow:-24px 0 66px rgba(17,34,42,.2);z-index:41;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:7px;transform:translateX(105%);visibility:hidden;transition:transform .23s ease,visibility .23s;}
  .site-header .hub-primary-nav.open {transform:translateX(0);visibility:visible;}
  .site-header .hub-primary-nav .hub-drawer-heading {display:grid;gap:3px;padding:4px 8px 12px;border-bottom:1px solid #e1ecea;margin-bottom:8px;}
  .site-header .hub-drawer-heading>span:first-child {font-size:1.23rem;font-weight:900;letter-spacing:-.02em;}
  .site-header .hub-drawer-subtitle {font-size:.84rem;color:var(--hub-quiet);}
  .site-header .hub-primary-nav .hub-nav-direct,
  .site-header .hub-primary-nav .hub-nav-trigger {font-size:1rem;min-height:51px;display:flex;width:100%;justify-content:space-between;border-radius:13px;padding:13px 15px;color:#244b57;}
  .site-header .hub-primary-nav .hub-nav-group {width:100%;}
  .site-header .hub-primary-nav .hub-nav-panel {position:static;top:auto;right:auto;left:auto;width:100%;min-width:0;max-height:none;overflow:visible;box-shadow:none;border:0;border-radius:0;padding:6px 0 8px 8px;display:grid;gap:4px;}
  .site-header .hub-primary-nav .hub-nav-panel .hub-nav-destination {min-height:58px;padding:9px;}
  .site-header .hub-primary-nav .hub-mobile-account {display:grid;gap:4px;margin-top:10px;padding-top:14px;border-top:1px solid #e1ecea;}
  .site-header .hub-mobile-section-title {font-size:.83rem;letter-spacing:.08em;text-transform:uppercase;font-weight:900;color:#4e636d;padding:6px 10px;}
  .site-header .hub-mobile-account .hub-nav-destination {display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;gap:11px;background:#f4f8f8;border:1px solid transparent;border-radius:13px;min-height:59px;padding:9px 12px;color:#244755;text-align:left;font:inherit;cursor:pointer;}
  .site-header .hub-mobile-account .hub-nav-destination:hover {background:#e7f4f1;}
  .site-header .hub-menu-toggle {display:grid!important;place-items:center;margin:0;z-index:44;flex-shrink:0;}
  .site-header .hub-account-dropdown,.site-header .hub-account-dashboard,.site-header .hub-sign-in,.site-header .hub-join,.site-header .hub-quick-btn {display:none!important;}
  .site-header .hub-header-actions {margin-left:auto;gap:9px;}
  .mobile-nav-backdrop {display:block;position:fixed;inset:0;z-index:40;opacity:0;visibility:hidden;background:rgba(12,29,37,.57);transition:opacity .2s,visibility .2s;pointer-events:none;}
  .mobile-nav-backdrop.open {opacity:1;visibility:visible;pointer-events:auto;}
  .js .site-header .hub-primary-nav:not(.open) {pointer-events:none;}
  /* Without JS, links must remain discoverable and functional. */
  html:not(.js) .site-header .hub-primary-nav {position:static;transform:none;visibility:visible;height:auto;max-height:none;width:100%;box-shadow:none;padding:12px 0;order:3;}
  html:not(.js) .site-header .hub-header-inner {flex-wrap:wrap;}
  html:not(.js) .site-header .hub-menu-toggle,html:not(.js) .mobile-nav-backdrop {display:none!important;}
}
@media (max-width:850px) {
  .stat-row {grid-template-columns:repeat(2,minmax(0,1fr));}
  .grid-4 {grid-template-columns:repeat(2,minmax(0,1fr));}
  .dashboard-grid,.phase6-layout {grid-template-columns:minmax(0,1fr);}
  .admin-nav.hub-admin-nav .hub-admin-links {position:static;width:100%;max-height:none;border-radius:11px;box-shadow:none;margin-top:6px;}
  .admin-nav.hub-admin-nav .hub-admin-menu {width:calc(50% - 5px);min-width:0;}
  .admin-nav.hub-admin-nav .hub-admin-menu>summary {width:100%;justify-content:space-between;}
}
@media (max-width:600px) {
  .site-header .shell {width:calc(100% - 22px);}
  .site-header .hub-brand {gap:7px;}
  .site-header .hub-brand .brand-logo-frame {width:45px;height:45px;border-radius:13px;}
  .site-header .hub-brand .brand-copy strong {font-size:.75rem;max-width:124px;white-space:normal;line-height:1.1;}
  .site-header .hub-brand .brand-copy small {font-size:.57rem;letter-spacing:.1em;}
  .site-header .hub-help-now {font-size:.76rem;min-height:41px;padding:8px 9px;gap:4px;}
  .site-header .hub-menu-toggle {height:42px;width:42px;}
  .site-header .hub-header-inner {gap:5px;min-height:69px;}
  .page-hero h1 {font-size:clamp(2rem,9vw,2.8rem);overflow-wrap:anywhere;}
  .page-hero,.section,.section-tight {overflow-wrap:anywhere;}
  .grid-3,.grid-4,.quest-grid,.form-grid {grid-template-columns:minmax(0,1fr);}
  .form-grid .span-2 {grid-column:auto;}
  .card {padding:18px;}
  .phase6-pills {gap:7px;}
  .phase6-quicklinks a {flex:1 1 100%;justify-content:center;text-align:center;}
  .quest-choices {grid-template-columns:minmax(0,1fr);}
  .admin-nav.hub-admin-nav .hub-admin-menu {width:100%;}
  .admin-nav.hub-admin-nav .hub-admin-home {width:100%;justify-content:center;}
  .phase6-recovery {grid-template-columns:minmax(0,1fr);}
}
@media (max-width:380px) {
  .site-header .hub-brand .brand-copy strong {max-width:100px;font-size:.69rem;}
  .site-header .hub-help-now {padding:7px;font-size:.73rem;}
  .site-header .hub-header-actions {gap:6px;}
}
@media (prefers-reduced-motion:reduce) {
  .site-header :where(.hub-primary-nav,.hub-nav-chevron),
  .mobile-nav-backdrop {transition:none!important;}
}
html.youth-high-contrast :where(.hub-nav-destination,.hub-nav-trigger,.hub-nav-direct,.hub-help-now) {border-color:#161616!important;}
html.youth-high-contrast .hub-nav-destination small {color:#282828!important;}
html.youth-large-text .site-header .hub-primary-nav .hub-nav-trigger {font-size:1rem;}
/* An off-canvas drawer must never make the root document scroll sideways. */
html {overflow-x:clip;}
@supports not (overflow:clip) {html {overflow-x:hidden;}}
/* Backdrop-filter on a sticky header creates a containing block for fixed
   descendants in Chromium/WebKit; it breaks full-screen drawer backdrops. */
.site-header {backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}