/* ==========================================================================
   Accessibility: visible keyboard focus everywhere, plus the modes from
   Accessibility Options (classes on <html>, set by js/access.js).
   Loaded last so it wins over the other stylesheets.
   ========================================================================== */

/* ---- Keyboard focus (always on) ------------------------------------------- */
.tb-btn:focus-visible,
.task-btn:focus-visible,
.sw-face:focus-visible { outline: 1px dotted #000; outline-offset: -4px; }
.desk-icon:focus-visible .desk-icon-label { outline: 1px dotted #fff; }
.iv-item:focus-visible .iv-label { outline: 1px dotted #000; }
.iv-item.selected:focus-visible .iv-label { outline-color: #ffff80; }

/* ---- Accessibility Options window ------------------------------------------ */
.access-main { display: flex; align-items: flex-start; gap: 14px; }
.access-main img { width: 32px; height: 32px; flex: none; }
.access-main p { margin: 0; }
.access-all { align-self: flex-start; }
.access-list { display: flex; flex-direction: column; gap: 8px; }

/* ==========================================================================
   Stop animations and blinking (also follows the device's reduced-motion setting)
   ========================================================================== */
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after {
  animation: none !important;
  transition: none !important;
}
html.a11y-motion .geo-marquee span { padding-left: 0; }
html.a11y-motion .blink { visibility: visible !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .geo-marquee span { padding-left: 0; }
  .blink { visibility: visible !important; }
}

/* ==========================================================================
   Standard mouse pointer
   ========================================================================== */
html.a11y-cursor { --cursor: auto; }

/* ==========================================================================
   Larger text
   ========================================================================== */
html.a11y-text { --fs: 15px; --title-h: 24px; --tb-w: 20px; --tb-h: 18px; --taskbar-h: 38px; }
@media (pointer: coarse) {
  html.a11y-text { --fs: 17px; --title-h: 30px; --tb-w: 28px; --tb-h: 26px; --taskbar-h: 46px; }
}
html.a11y-text .btn { line-height: 21px; }
html.a11y-text .menu-item { height: auto; min-height: 30px; padding-top: 4px; padding-bottom: 4px; }
html.a11y-text .menu-large .menu-item { min-height: 40px; }
html.a11y-text .notepad-text { font-size: 16px; }
html.a11y-text .desk-icon-label { -webkit-line-clamp: 3; }
html.a11y-text .start-menu-side span { font-size: 20px; }

/* ==========================================================================
   High contrast (in the spirit of Win95's "High Contrast Black" scheme)
   ========================================================================== */
html.a11y-contrast {
  --face: #000;
  --light: #808080;
  --hilight: #fff;
  --shadow: #808080;
  --dark: #fff;
  --navy: #800080;
  --teal: #000;
  --dither: #000;
}
html.a11y-contrast body,
html.a11y-contrast .btn,
html.a11y-contrast .geo .btn,
html.a11y-contrast .menu-item,
html.a11y-contrast .iv-item,
html.a11y-contrast .tab,
html.a11y-contrast .tool-btn { color: #fff; }

/* Light surfaces become black with white text */
html.a11y-contrast .field,
html.a11y-contrast input[type="text"],
html.a11y-contrast input[type="email"],
html.a11y-contrast textarea,
html.a11y-contrast select,
html.a11y-contrast .sunken,
html.a11y-contrast .listview,
html.a11y-contrast .iconview,
html.a11y-contrast .mp-list,
html.a11y-contrast .dt-cal,
html.a11y-contrast .welcome-tip,
html.a11y-contrast .notice,
html.a11y-contrast .tree .answer,
html.a11y-contrast .geo {
  background: #000 !important;
  color: #fff !important;
}
html.a11y-contrast .notice,
html.a11y-contrast .tree .answer,
html.a11y-contrast .welcome-tip { box-shadow: inset 0 0 0 1px #fff; }

/* Desktop: no wallpaper */
html.a11y-contrast .desktop { background: #000 !important; }
html.a11y-contrast .desk-icon-label { text-shadow: none !important; }

/* Title bars: purple when active, black with a white edge when inactive */
html.a11y-contrast .title-bar { background: #000; color: #fff; box-shadow: inset 0 0 0 1px #fff; }
html.a11y-contrast .window.active .title-bar { background: #800080; box-shadow: none; }

/* Keep the small glyph buttons light so their black symbols stay visible */
html.a11y-contrast .tb-btn,
html.a11y-contrast ::-webkit-scrollbar-button:single-button {
  background-color: #c0c0c0;
  box-shadow: inset -1px -1px #000, inset 1px 1px #fff, inset -2px -2px #808080, inset 2px 2px #dfdfdf;
}

/* Links, focus, disabled text */
html.a11y-contrast a:not(.btn) { color: #ff0; }
html.a11y-contrast :focus-visible { outline: 2px solid #ff0 !important; outline-offset: 0 !important; }
html.a11y-contrast .desk-icon:focus-visible .desk-icon-label,
html.a11y-contrast .iv-item:focus-visible .iv-label { outline: 2px solid #ff0; }
html.a11y-contrast :disabled,
html.a11y-contrast .tab:disabled { color: #808080 !important; text-shadow: none !important; }

/* Start menu banner */
html.a11y-contrast .start-menu-side { background: #800080; }
html.a11y-contrast .start-menu-side span { color: #fff; }

/* Countdown clock */
html.a11y-contrast .analog {
  background:
    radial-gradient(circle, #fff 0 3px, transparent 3.5px),
    repeating-conic-gradient(from -1.5deg, #fff 0 3deg, transparent 3deg 30deg);
}
html.a11y-contrast .hand.hh, html.a11y-contrast .hand.mm { background: #fff; }
html.a11y-contrast .hand.ss { background: #ff0; }
html.a11y-contrast .dt-cal b { background: #fff; color: #000; }

/* Paw Sweeper: bright numbers, paws on white so they stay visible */
html.a11y-contrast .n1 { color: #0ff; }
html.a11y-contrast .n2 { color: #0f0; }
html.a11y-contrast .n3 { color: #f66; }
html.a11y-contrast .n4 { color: #ff0; }
html.a11y-contrast .n5 { color: #f0f; }
html.a11y-contrast .n6 { color: #0ff; }
html.a11y-contrast .n7 { color: #fff; }
html.a11y-contrast .n8 { color: #c0c0c0; }
html.a11y-contrast .sw-cell.mine { background-color: #fff; }
html.a11y-contrast .sw-cell.boom { background-color: #f00; }

/* ==========================================================================
   Text version (js/textversion.js). Always in the page for reading mode and
   screen readers, but behind the desktop until opened or focused.
   ========================================================================== */
.skip-link {
  position: fixed;
  left: 8px;
  top: -200px;
  z-index: 30000;
  padding: 8px 14px;
  border: 2px solid #000;
  background: #ff0;
  color: #000;
  font: bold 15px/1.3 Arial, Helvetica, sans-serif;
  text-decoration: underline;
}
.skip-link:focus { top: 8px; outline: 2px solid #000; outline-offset: 2px; }

.text-version {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: auto;
  padding: 16px 16px 48px;
  background: #fff;
  color: #111;
  font: 16px/1.6 Arial, Helvetica, sans-serif;
  cursor: auto;
  -webkit-user-select: text;
  user-select: text;
}
.text-version.open,
.text-version:focus-within { z-index: 20000; }
.text-version > * { max-width: 760px; margin-left: auto; margin-right: auto; }
.text-version h1 { margin-top: 0; font-size: 1.8em; line-height: 1.2; }
.text-version h2 { margin: 2em auto .5em; padding-top: .5em; border-top: 2px solid #000; font-size: 1.4em; }
.text-version h3 { margin: 1.4em 0 .4em; font-size: 1.15em; }
.text-version h4 { margin: 1em 0 .3em; font-size: 1em; }
.text-version a { color: #00c; }
.text-version :focus-visible { outline: 3px solid #f90; outline-offset: 2px; }
.text-version table { border-collapse: collapse; width: 100%; }
.text-version th, .text-version td { padding: 6px 8px; border: 1px solid #999; text-align: left; vertical-align: top; }
.text-version nav ul { columns: 2; }
.text-version .tv-lead { font-size: 1.05em; }
.text-version .tv-top { font-size: .9em; }
.tv-bar { position: sticky; top: -16px; z-index: 1; display: flex; justify-content: flex-end; padding: 8px 0; background: inherit; }
.tv-back { padding: 6px 14px; border: 2px solid #000; background: #ff0; color: #000; font: bold 14px Arial, sans-serif; cursor: pointer; }
.access-text { margin: 0; }

html.a11y-contrast .text-version { background: #000; color: #fff; }
html.a11y-contrast .text-version a { color: #ff0; }
html.a11y-contrast .text-version h2 { border-top-color: #fff; }
html.a11y-text .text-version { font-size: 19px; }
.text-version section, .text-version [id] { scroll-margin-top: 56px; }
/* black-only tray glyph: flip it to white in high contrast */
html.a11y-contrast .tray-volume img { filter: invert(1); }
