/* FOREVER:NEON — Adaptive Shell, Layer 1 foundation.
   Adaptive Shell Proposal v3, Section 1. Applies to every page that opts in
   (link this stylesheet) without carrying any Layer 2 presentation skin.
   Tokens here are additive — pages keep their own local palette variables
   (--bg/--cyan/etc.) and only draw on the --fn-* layout/safe-area/touch
   tokens below. Do not add per-book visual identity here; that belongs to
   Layer 2 skins. */

:root{
  /* Layout scale — matches the 680px breakpoint already used across
     pages/dashboard.html, cadre.html, speakeasy.html, signal-cells.html. */
  --fn-bp-compact: 680px;
  --fn-bp-medium: 1024px;

  --fn-space-1: 4px;
  --fn-space-2: 8px;
  --fn-space-3: 12px;
  --fn-space-4: 16px;
  --fn-space-5: 24px;
  --fn-space-6: 32px;

  --fn-radius-sm: 8px;
  --fn-radius-md: 12px;
  --fn-radius-lg: 18px;

  /* Minimum touch target per the Book 1 ARG canonical contract's
     accessibility baseline (large touch targets, no drag-only actions). */
  --fn-touch-min: 44px;

  /* Safe-area insets, zero on platforms without a notch/home-indicator. */
  --fn-safe-top: env(safe-area-inset-top, 0px);
  --fn-safe-right: env(safe-area-inset-right, 0px);
  --fn-safe-bottom: env(safe-area-inset-bottom, 0px);
  --fn-safe-left: env(safe-area-inset-left, 0px);

  /* Reserved height for the compact-mode handset nav (fn-handset-shell.css).
     Pages that mount the shell should pad scrollable content by this
     amount so the bottom nav never covers the last interactive element. */
  --fn-handset-nav-height: 64px;
}

/* Prevent the classic mobile-overflow failure mode: a single oversized
   child (wide table, long unbroken token, fixed-width flex item) forcing
   horizontal scroll on the whole page. */
html{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body.fn-adaptive-foundation{
  overflow-x: hidden;
}
.fn-adaptive-foundation img,
.fn-adaptive-foundation video,
.fn-adaptive-foundation svg,
.fn-adaptive-foundation canvas{
  max-width: 100%;
  height: auto;
}
.fn-adaptive-foundation *{
  min-width: 0;
}

/* Touch targets: applied opt-in via class rather than a blanket button/a
   selector, so pages with already-audited controls aren't silently resized. */
.fn-touch-target{
  min-height: var(--fn-touch-min);
  min-width: var(--fn-touch-min);
}

/* Screen-reader-only text: announced, never rendered, never focus-trapped. */
.fn-visually-hidden{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* Skip link: hidden until focused, so keyboard users can bypass the
   handset nav / drawer chrome and land on page content directly. */
.fn-skip-link{
  position: fixed;
  top: -100px;
  left: var(--fn-space-3);
  z-index: 2147483000;
  background: #05050d;
  color: #7df9c6;
  border: 1px solid rgba(125,249,198,.6);
  border-radius: var(--fn-radius-sm);
  padding: var(--fn-space-2) var(--fn-space-3);
  font: 12px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-decoration: none;
  transition: top .12s ease;
}
.fn-skip-link:focus{
  top: calc(var(--fn-safe-top) + var(--fn-space-2));
}

/* Reduced motion: any animation/transition opted into this class family is
   neutralized. Individual pages/skins add their own heavier motion rules
   behind the same query; this is the shared floor. */
@media (prefers-reduced-motion: reduce){
  .fn-adaptive-foundation *,
  .fn-adaptive-foundation *::before,
  .fn-adaptive-foundation *::after{
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* Large-text / 200% zoom reflow floor: nothing under this stylesheet may
   rely on a fixed px font-size that fails to reflow. Pages remain
   responsible for their own type scale; this only guarantees wrapping. */
.fn-adaptive-foundation{
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Accessibility settings panel (fn-adaptive-foundation.js openAccessibilityPanel):
   a manual override independent of OS-level prefers-reduced-motion/zoom, for
   players who want it without changing device-wide settings. */
html.fn-large-text{
  font-size: 118%;
}
html.fn-force-reduced-motion .fn-adaptive-foundation *,
html.fn-force-reduced-motion .fn-adaptive-foundation *::before,
html.fn-force-reduced-motion .fn-adaptive-foundation *::after{
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
  scroll-behavior: auto !important;
}
