/* Shared pixel arches are reserved for full-width page boundaries. */
:root {
  --footer-edge-height:128px;
  --footer-edge-mask:url('/public/welcome-section-dither.svg?v=7');
}
.pixel-section-edge { position:absolute; display:block; pointer-events:none; left:0; right:0; bottom:-1px; height:var(--section-edge-height); background:var(--pixel-section-next,#0b0f1a); -webkit-mask:var(--section-edge-mask) center/100% 100% no-repeat; mask:var(--section-edge-mask) center/100% 100% no-repeat; }
.adventure-content { padding-bottom:calc(72px + 128px); }
.pixel-world-edge { --section-edge-height:128px; --section-edge-mask:url('/public/welcome-hero-dither-down.svg?v=1'); z-index:3; background:#0b0f1a; }
.family-intro h1 { font-size:46px; margin:24px 0 16px; }
.family-intro p { color:var(--muted); }
.family-content .explorer-grid { margin-top:30px; }
.explorer-card:hover,.explorer-card:focus-visible { border-color:var(--profile-color,var(--cyan)); outline-color:var(--profile-color,var(--cyan)); }
.player-card-label>svg { color:var(--profile-color,var(--cyan)); }

/* One pixel of scroll-container padding lets the selected tab cover the panel
   border without its bridge being clipped. Horizontal swiping remains available.
   Real tabs join the selected child's one panel. Wider families scroll instead
   of shrinking names, and the active tab remains keyboard reachable. */
.family-overview { margin-bottom:0; position:relative; z-index:1; }
.parent-profile-grid { display:flex; gap:8px; overflow-x:auto; padding:6px 6px 1px; margin:0 -6px -1px; align-items:stretch; scrollbar-width:none; }
.parent-profile-grid::-webkit-scrollbar { display:none; }
.parent-profile-card { flex:1 0 190px; min-width:0; border:1px solid var(--line); border-bottom:0; border-radius:3px 3px 0 0; box-shadow:none; padding:16px; background:#0e1727; position:relative; text-align:left; }
.parent-profile-card .parent-profile-heading { gap:10px; }
.parent-profile-card .parent-profile-heading strong { font-size:17px; }
.parent-profile-card .parent-profile-pattern { margin-top:8px; }
.parent-profile-card.selected { background:var(--paper); border-color:var(--profile-color,var(--cyan)); border-width:1px; border-bottom:0; z-index:1; box-shadow:inset 0 3px var(--profile-color,var(--cyan)); }
.parent-profile-card.selected::after { content:''; position:absolute; bottom:-1px; height:2px; background:var(--paper); left:0; right:0; z-index:1; }
.parent-profile-card:hover,.parent-profile-card:focus-visible { border-color:var(--profile-color,var(--cyan)); outline-color:var(--profile-color,var(--cyan)); }
.tamer-progress-panel { background:var(--paper); border:1px solid var(--line); padding:28px; margin-bottom:28px; }
.tamer-progress-panel>.child-progress-heading { margin:0 0 24px; }
.tamer-progress-panel .tamer-login-panel { margin:0 0 28px; }
.parent-shell:not(.progress-dashboard) .panel>p,.parent-shell:not(.progress-dashboard) .form-note,.parent-shell:not(.progress-dashboard) .guide-panel li,.parent-shell:not(.progress-dashboard) .tamer-login-panel .username-guidance { font-size:16px!important; line-height:1.75; color:#c2cfdf!important; }
.tamer-login-panel .username-guidance { margin:14px 0 20px; padding:12px 16px; border-left:3px solid var(--cyan); background:#0c192b; }
.parent-shell .panel>.button[data-app-feedback] { margin:24px 0; padding:16px 26px; }
.answer-result-mark .pixel-icon { width:24px; height:24px; }
.answer-letter small .pixel-icon { width:12px; height:12px; }

/* Footer controls share a place on every route, including sign-in and setup. */
.user-footer { position:relative; display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap; gap:16px; width:100%; max-width:none; margin:calc(var(--footer-edge-height) + 16px) 0 0; padding:24px clamp(18px,4vw,42px); background:#122235; border-top:0; text-align:left; }
.user-footer::before { content:''; position:absolute; left:0; right:0; top:calc(1px - var(--footer-edge-height)); height:var(--footer-edge-height); background:#122235; pointer-events:none; -webkit-mask:var(--footer-edge-mask) center/100% 100% no-repeat; mask:var(--footer-edge-mask) center/100% 100% no-repeat; }
.user-footer .motion-toggle,.user-footer .welcome-motion-toggle { order:1; background:none; border:0; border-radius:0; box-shadow:none; min-height:44px; padding:10px 0; color:#a8c6ce; font:13px/1.5 var(--sans); letter-spacing:0; text-decoration:underline; text-underline-offset:4px; }
.user-footer .motion-toggle:hover,.user-footer .welcome-motion-toggle:hover { background:none; color:var(--ink); }
.user-footer .motion-toggle[aria-pressed=true] { color:#a8c6ce; }
.user-footer .feedback-link { order:2; margin-left:auto; align-self:flex-end; background:#182236; border:1px solid #43536f; color:var(--ink); padding:13px 19px; min-height:48px; font:700 13px/1.4 var(--display); letter-spacing:0; text-decoration:none; box-shadow:3px 3px 0 #070b12; }
.user-footer .feedback-link:is(:hover,:focus-visible) { color:#111c21; }
.session-footer.user-footer { max-width:none; }
/* A sidebar makes this footer a contained column rather than a page boundary. */
@media(min-width:801px) {
  .parent-shell .user-footer { margin-top:16px; }
  .parent-shell .user-footer::before { content:none; }
}
/* Native dropdown/disclosure behavior stays intact; only the markers change. */
select { appearance:none; padding-right:40px; background-image:url('/public/pixel-chevron-down.svg'); background-position:right 14px center; background-size:14px 14px; background-repeat:no-repeat; }
details:not(.child-menu)>summary { list-style:none; display:block; }
details:not(.child-menu)>summary::-webkit-details-marker { display:none; }
details:not(.child-menu)>summary::before { content:''; display:inline-block; width:12px; height:12px; margin-right:8px; background:currentColor; -webkit-mask:url('/public/pixel-chevron-down.svg') center/contain no-repeat; mask:url('/public/pixel-chevron-down.svg') center/contain no-repeat; transform:rotate(-90deg); }
details[open]:not(.child-menu)>summary::before { transform:none; }
@media(max-width:780px) {
  :root { --footer-edge-height:80px; --footer-edge-mask:url('/public/welcome-section-dither-mobile.svg?v=7'); }
  .pixel-world-edge { --section-edge-height:80px; --section-edge-mask:url('/public/welcome-hero-dither-down-mobile.svg?v=1'); }
  .adventure-content { padding-bottom:calc(60px + 80px); }
  .family-intro h1 { font-size:31px; }
  .tamer-progress-panel { padding:20px 16px; }
  .parent-profile-card { flex-basis:180px; }
}
@media(forced-colors:active) {
  .pixel-section-edge,.user-footer::before { display:none; }
  .parent-profile-card.selected { border:2px solid Highlight; }
}