/* MiniSun Pro: accessibility menu (own code, no plugin) + the display modes it toggles on <html>.
   Brand: housing #151A45 · UV #8F7BFF · tube #EDE9FF. Target WCAG 2.1 AA / IS 5568. */

/* ---------- the widget ---------- */
.msp-a11y { --a11y-bottom: 16px; position: fixed; inset-inline-start: 16px; bottom: var(--a11y-bottom); z-index: 2147483000; font-family: "IBM Plex Sans Hebrew", Arial, sans-serif; font-size: 15px; line-height: 1.4; direction: inherit; transition: bottom .2s ease; }
.msp-a11y *, .msp-a11y *::before, .msp-a11y *::after { box-sizing: border-box; }
.msp-a11y [hidden] { display: none !important; }

.msp-a11y__fab { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(191, 180, 255, .45); background: rgba(21, 26, 69, .82); color: #EDE9FF; display: grid; place-items: center; cursor: pointer; padding: 0; box-shadow: 0 8px 22px -10px rgba(10, 12, 40, .7); opacity: 0; transform: translateY(6px); transition: opacity .35s ease, transform .35s ease, background .15s ease, border-color .15s ease; }
.msp-a11y.is-in .msp-a11y__fab { opacity: .78; transform: none; }
.msp-a11y.is-in .msp-a11y__fab:hover, .msp-a11y.is-in .msp-a11y__fab:focus-visible, .msp-a11y.is-open .msp-a11y__fab { opacity: 1; background: #151A45; border-color: #8F7BFF; }
.msp-a11y__fab svg { width: 24px; height: 24px; }

/* minimized: a slim tab glued to the screen edge, always reachable */
.msp-a11y__tab { position: fixed; inset-inline-start: 0; bottom: calc(var(--a11y-bottom) + 6px); width: 18px; height: 44px; border: 1px solid rgba(191, 180, 255, .45); border-inline-start: 0; border-radius: 0 10px 10px 0; background: rgba(21, 26, 69, .85); color: #EDE9FF; display: grid; place-items: center; padding: 0; cursor: pointer; }
[dir="rtl"] .msp-a11y__tab { border-radius: 10px 0 0 10px; }
.msp-a11y__tab svg { width: 12px; height: 12px; }
.msp-a11y__tab:hover, .msp-a11y__tab:focus-visible { width: 26px; background: #151A45; }

.msp-a11y__fab:focus-visible, .msp-a11y__tab:focus-visible, .msp-a11y__panel button:focus-visible, .msp-a11y__panel a:focus-visible { outline: 3px solid #FFD84D; outline-offset: 2px; }

.msp-a11y__panel { position: absolute; bottom: 52px; inset-inline-start: 0; width: min(330px, calc(100vw - 32px)); max-height: min(560px, calc(100vh - 100px)); overflow: auto; background: #fff; color: #1C2040; border: 1px solid #DCDCEA; border-radius: 16px; box-shadow: 0 24px 60px -24px rgba(10, 12, 40, .55); padding: 14px; }
.msp-a11y__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: -14px -14px 12px; padding: 12px 14px; background: #151A45; color: #EDE9FF; border-radius: 16px 16px 0 0; }
.msp-a11y__head h2 { margin: 0; font-size: 16px; font-weight: 600; color: #EDE9FF; display: flex; align-items: center; gap: 8px; }
.msp-a11y__head h2 svg { width: 20px; height: 20px; color: #BFB4FF; }
.msp-a11y__x { width: 32px; height: 32px; border-radius: 8px; border: 0; background: rgba(237, 233, 255, .1); color: #EDE9FF; font-size: 20px; line-height: 1; cursor: pointer; }
.msp-a11y__x:hover { background: rgba(237, 233, 255, .2); }

.msp-a11y__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border: 1px solid #E6E7F2; border-radius: 12px; margin-bottom: 10px; }
.msp-a11y__row b { font-weight: 600; font-size: 14px; }
.msp-a11y__size { display: flex; align-items: center; gap: 6px; }
.msp-a11y__size button { width: 36px; height: 36px; border-radius: 10px; border: 1px solid #DCDCEA; background: #F6F6FA; color: #151A45; font-weight: 700; cursor: pointer; }
.msp-a11y__size button:hover { border-color: #8F7BFF; }
.msp-a11y__size output { min-width: 44px; text-align: center; font-variant-numeric: tabular-nums; font-size: 13px; color: #5A5F7E; }

.msp-a11y__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.msp-a11y__opt { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 76px; padding: 8px 6px; border-radius: 12px; border: 1px solid #E6E7F2; background: #FBFBFE; color: #1C2040; font-size: 13px; font-weight: 500; text-align: center; cursor: pointer; transition: border-color .12s ease, background .12s ease; }
.msp-a11y__opt svg { width: 22px; height: 22px; color: #6650DF; }
.msp-a11y__opt:hover { border-color: #8F7BFF; }
.msp-a11y__opt[aria-pressed="true"] { background: #151A45; border-color: #151A45; color: #EDE9FF; }
.msp-a11y__opt[aria-pressed="true"] svg { color: #BFB4FF; }

.msp-a11y__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid #E6E7F2; font-size: 13px; }
.msp-a11y__foot a { color: #4A36C2; text-decoration: underline; text-underline-offset: 3px; }
.msp-a11y__link { border: 0; background: none; color: #4A36C2; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 4px 0; font: inherit; }
.msp-a11y__reset { border: 1px solid #DCDCEA; background: #fff; color: #1C2040; border-radius: 999px; padding: 6px 12px; cursor: pointer; font: inherit; }
.msp-a11y__reset:hover { border-color: #8F7BFF; }

@media (prefers-reduced-motion: reduce) { .msp-a11y, .msp-a11y__fab { transition: none; } }
@media print { .msp-a11y { display: none !important; } }

/* ---------- display modes (classes on <html>, set before paint by the inline boot script) ---------- */
html.msp-fs-1 { font-size: 112.5%; } html.msp-fs-1 body { font-size: 18px; }
html.msp-fs-2 { font-size: 125%; }   html.msp-fs-2 body { font-size: 20px; }
html.msp-fs-3 { font-size: 137.5%; } html.msp-fs-3 body { font-size: 22px; }
html.msp-fs-4 { font-size: 150%; }   html.msp-fs--1 body { font-size: 15px; } html.msp-fs-4 body { font-size: 24px; }
html.msp-fs--1 { font-size: 93.75%; }

html.msp-contrast body, html.msp-contrast body *:not(.msp-a11y):not(.msp-a11y *) { background-color: #000 !important; color: #fff !important; border-color: #fff !important; text-shadow: none !important; box-shadow: none !important; }
html.msp-contrast body *:not(.msp-a11y):not(.msp-a11y *) { background-image: none !important; }
html.msp-contrast a:not(.msp-a11y *), html.msp-contrast a:not(.msp-a11y *) * { color: #FFE14D !important; }
html.msp-contrast img, html.msp-contrast svg:not(.msp-a11y svg) { filter: none !important; }

html.msp-mono body > *:not(.msp-a11y) { filter: grayscale(1); }

html.msp-links a:not(.msp-a11y *) { text-decoration: underline !important; text-underline-offset: 3px; outline: 2px solid #FFB800 !important; outline-offset: 2px; }
html.msp-headings h1:not(.msp-a11y *), html.msp-headings h2:not(.msp-a11y *), html.msp-headings h3:not(.msp-a11y *), html.msp-headings h4:not(.msp-a11y *), html.msp-headings h5:not(.msp-a11y *), html.msp-headings h6:not(.msp-a11y *) { outline: 2px dashed #8F7BFF !important; outline-offset: 4px; }

html.msp-readable body, html.msp-readable body *:not(.msp-a11y):not(.msp-a11y *):not(svg):not(svg *) { font-family: Arial, "Segoe UI", Tahoma, sans-serif !important; letter-spacing: normal !important; }

html.msp-spacing body p:not(.msp-a11y *), html.msp-spacing body li:not(.msp-a11y *), html.msp-spacing body td:not(.msp-a11y *), html.msp-spacing body label:not(.msp-a11y *), html.msp-spacing body dd:not(.msp-a11y *), html.msp-spacing body span:not(.msp-a11y *), html.msp-spacing body a:not(.msp-a11y *) { line-height: 2 !important; letter-spacing: .03em !important; word-spacing: .12em !important; }

html.msp-nomotion, html.msp-nomotion *, html.msp-nomotion *::before, html.msp-nomotion *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }

html.msp-cursor, html.msp-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cpath d='M6 3l30 17-13 3 8 15-6 3-8-15-11 9z' fill='%23151A45' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, auto !important; }
html.msp-cursor a, html.msp-cursor a *, html.msp-cursor button, html.msp-cursor button *, html.msp-cursor [role="button"], html.msp-cursor label { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cpath d='M6 3l30 17-13 3 8 15-6 3-8-15-11 9z' fill='%236650DF' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, pointer !important; }
