/* Accessibility menu (partials/a11y.njk, owner request 30 October 2026). The choices are classes on <html>; the menu
   itself (.a11y) never takes them, so it stays the same size and color while people try them. */

/* The button: bottom left on every page, game pages included (owner feedback, 30 October 2026). */
.a11y__toggle{position:fixed;left:16px;bottom:16px;z-index:60;display:inline-flex;align-items:center;gap:8px;min-width:48px;min-height:48px;padding:0 12px;background:var(--lucy-charcoal);color:var(--lucy-cream);border:2px solid var(--lucy-charcoal);border-radius:var(--lucy-radius-control);box-shadow:2px 2px 0 var(--lucy-cream),4px 4px 0 var(--lucy-charcoal);font:700 .875rem/1 var(--lucy-reading);cursor:pointer}
.a11y__toggle-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.a11y__toggle:hover{background:#000}
.a11y__toggle:focus-visible,.a11y button:focus-visible,.a11y a:focus-visible{outline:3px solid var(--lucy-charcoal);outline-offset:3px;box-shadow:0 0 0 3px var(--lucy-cream)}
.a11y__toggle:focus-visible{outline-color:var(--lucy-pink)}
@media print{.a11y__toggle,.a11y{display:none}}
/* Phones: a narrow tab against the screen edge, so it covers as little of the page as possible. */
@media(max-width:760px){.a11y .a11y__toggle{left:0;bottom:24px;min-width:32px;min-height:44px;padding:0 4px 0 2px;border-left:0;border-radius:0 var(--lucy-radius-control) var(--lucy-radius-control) 0;box-shadow:2px 2px 0 var(--lucy-cream)}.a11y .a11y__toggle svg{width:20px;height:20px}.a11y .a11y__panel{bottom:16px}}
/* "Hide the corner button": the footer's "Accessibility settings" opens the menu instead. */
html.a11y-hidebtn .a11y .a11y__toggle{display:none}
/* Game pages up to 1239px wide (the game window reaches the corner) and on short screens: the tab sits halfway up the left edge, clear of
   Lucy (bottom left) and the game's Exit button (top left). Wider screens keep the corner, beside the game window. */
@media(max-width:1239px),(max-height:520px){.a11y--game .a11y__toggle{left:0;top:50%;bottom:auto;transform:translateY(-50%);min-width:32px;min-height:44px;padding:0 4px 0 2px;border-left:0;border-radius:0 var(--lucy-radius-control) var(--lucy-radius-control) 0;box-shadow:2px 2px 0 var(--lucy-cream)}.a11y--game .a11y__toggle svg{width:20px;height:20px}.a11y--game .a11y__panel{bottom:16px;max-height:calc(100vh - 32px)}}
.footer-a11y{display:inline-flex;align-items:center;min-height:44px;padding:0;background:none;border:0;color:var(--lucy-cream);font:inherit;text-decoration:underline;text-underline-offset:.25em;cursor:pointer}
.footer-a11y:focus-visible{outline:3px solid currentColor;outline-offset:5px}


.a11y__panel{position:fixed;left:16px;bottom:80px;z-index:61;width:min(320px,calc(100vw - 32px));max-height:calc(100vh - 100px);overflow:auto;padding:16px;background:var(--lucy-cream);color:var(--lucy-charcoal);border:2px solid var(--lucy-charcoal);border-radius:var(--lucy-radius-card);box-shadow:4px 4px 0 var(--lucy-charcoal);font:400 1rem/1.4 var(--lucy-reading)}
.a11y__panel[hidden]{display:none}
.a11y__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.a11y__head h2{margin:0;font:700 1.375rem/1.1 var(--lucy-display);letter-spacing:-.03em}
.a11y__close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-6px -6px 0 0;background:none;border:0;color:inherit;cursor:pointer}
.a11y__group-label{margin:4px 0 6px;font-weight:700;font-size:.875rem}
.a11y__sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.a11y__options{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.a11y__sizes button,.a11y__options button{width:100%;min-height:44px;padding:8px 12px;background:#fff;color:var(--lucy-charcoal);border:2px solid var(--lucy-charcoal);border-radius:var(--lucy-radius-control);font:600 .9375rem/1.2 var(--lucy-reading);text-align:left;cursor:pointer}
.a11y__sizes button{text-align:center;font-weight:700}
.a11y__size2{font-size:1.1875rem!important}
.a11y__size3{font-size:1.4375rem!important}
.a11y__options button{display:flex;align-items:center;justify-content:space-between;gap:12px}
.a11y__options button::after{content:"";flex:none;width:18px;height:18px;border:2px solid var(--lucy-charcoal);border-radius:2px;background:#fff}
.a11y button[aria-pressed=true]{background:var(--lucy-leaf)}
.a11y__options button[aria-pressed=true]::after{background:var(--lucy-charcoal);box-shadow:inset 0 0 0 3px #fff}
.a11y__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.a11y__reset{min-height:44px;padding:0 14px;background:var(--lucy-butter);color:var(--lucy-charcoal);border:2px solid var(--lucy-charcoal);border-radius:var(--lucy-radius-control);font:700 .9375rem/1 var(--lucy-reading);cursor:pointer}
.a11y__foot a{color:var(--lucy-charcoal);font-weight:600;font-size:.9375rem;text-decoration:underline;text-underline-offset:3px}
.a11y__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Text size: the whole page grows, like browser zoom, so the layout reflows instead of overlapping. The game window
   keeps its size (its height is measured in page pixels). */
html[data-a11y-text="2"] body>:not(.a11y):not(main),html[data-a11y-text="2"] main>:not(.quest),html[data-a11y-text="2"] .quest__crumbs{zoom:1.2}
html[data-a11y-text="3"] body>:not(.a11y):not(main),html[data-a11y-text="3"] main>:not(.quest),html[data-a11y-text="3"] .quest__crumbs{zoom:1.4}

/* High contrast: black on white, then a little more contrast on everything (art included). */
html.a11y-contrast{--lucy-cream:#fff;--lucy-charcoal:#000;--lucy-divider:#000}
html.a11y-contrast{--a11y-contrast:contrast(1.2)}
html.a11y-gray{--a11y-gray:grayscale(1)}
html.a11y-contrast body>:not(.a11y),html.a11y-gray body>:not(.a11y){filter:var(--a11y-contrast,) var(--a11y-gray,)}

/* Easy-read font: DM Sans in place of the typewriter titles. */
html.a11y-font{--lucy-display:'DM Sans',sans-serif;--lucy-slogan:'DM Sans',sans-serif}
html.a11y-font .tagline{font-family:'DM Sans',sans-serif}

/* Text spacing (WCAG 1.4.12 values). */
html.a11y-spacing body>:not(.a11y) *{letter-spacing:.12em!important;word-spacing:.16em!important;line-height:1.5!important}
html.a11y-spacing body>:not(.a11y) p{margin-bottom:2em!important}

/* Show links: every link underlined and marked. */
html.a11y-links body>:not(.a11y) a{text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:3px!important;outline:2px dashed currentColor;outline-offset:2px}

/* Stop moving things. */
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
