/* ========================================================================== V091 — a full sweep, measured rather than assumed. No defect report this round; this is what a pass over every tab turned up. The numbers below were read in a real browser at 1440x900, de-duplicated by (class, colour) so one broken style is one row and not forty. The eleven that were real, worst first: dark .v073-badge 1.07 #E8EDF6 on #F1F5F9 dark .gpEmpty b 1.97 #A8B6C9 on #F8FAFC light "The exam is in the spring" 2.56 #94A3B8 on #FFFFFF dark .v086-practice-picked 1.88 #475569 on #212B3A <- V090's own dark .gpBandLabel / .gpModuleLabel 3.31 #64748B on #1A2333 dark .qid 3.31 #64748B on #1A2333 light .paperVariantDescription 3.98 #748096 on #FFFFFF light "Marked wrong" 4.18 #69758B on #F0F3F8 light .gpScopeChip / .v073-paper-status.new / .qid 4.34 #64748B on #F1F5F9 The two worst are the same failure: a light-mode surface (#F1F5F9, #F8FAFC) left in place under the dark theme, with dark-theme text on top of it. V088 flipped the token families and covered the class names it knew about; these are painted by v073.css and v054.css with literal hex values and were never in scope. Every rule is written once per theme, and that is not tidiness. The first pass set #5B6779 in both and made two of them worse rather than better: .v073-paper-status.new went 3.31 -> 2.49 and .gpScopeChip 3.31 -> 2.75, because that grey is a step DARKER and the dark theme needs a step lighter. A single value across both themes looks tidier and is wrong half the time. ========================================================================== */ /* -------------------------------------------------------------------------- 1. The two surfaces that stayed light under the dark theme. */ html[data-ial-theme="dark"] .v073-badge { background: #24304a !important; border-color: #33415c !important; color: #e8edf6 !important; } html[data-ial-theme="dark"] .v073-badge.unlocked { /* The amber gradient is the achievement state; darkened rather than removed so "unlocked" still reads as warm against the cool page. */ background: linear-gradient(135deg, #4a3a12, #5c4a18) !important; border-color: #a16207 !important; } html[data-ial-theme="dark"] .v073-badge .v073-badge-tip { color: #cbd5e1 !important; } html[data-ial-theme="dark"] .gpCard--next { background: #1a2333 !important; } html[data-ial-theme="dark"] .gpCard--next h3 { color: #e2e8f0 !important; } /* -------------------------------------------------------------------------- 1b. The two tabs the first sweep never visited. The sweep ran switchTab('dashboard') and switchTab('summary'). Neither is a tab: the panels are #home and #learn, and switchTab on an unknown name is a no-op, so those two pages were silently skipped and reported as "0 problems" rather than as "not checked". Found on the live run, where the tab list was taken from the DOM instead of from memory. What it had missed, per theme, de-duplicated: home .metrics .metric .sub 2.91 light / 3.62 dark home .metric .label 3.31 dark learn .arrow 2.56 both (the -> and lock glyphs) learn .summaryChapterCard white in dark - the same light-surface left behind as the badge, so the arrows measured 2.56 against it. */ body.ial-v030 .metrics .metric .sub { color: #64748b !important; } html[data-ial-theme="dark"] .metrics .metric .sub { color: #94a3b8 !important; } body.ial-v030 .metric .label { color: #5b6779 !important; } html[data-ial-theme="dark"] .metric .label { color: #94a3b8 !important; } /* A glyph that carries no information still has to be visible: it is what tells a student the row is a link, and the lock is how a locked row is marked before they click it. */ body.ial-v030 .arrow { color: #64748b !important; } html[data-ial-theme="dark"] .arrow { color: #94a3b8 !important; } html[data-ial-theme="dark"] .summaryChapterCard { background: #1a2333 !important; border-color: #2c3a52 !important; } html[data-ial-theme="dark"] .summaryChapterCard .arrow { color: #94a3b8 !important; } html[data-ial-theme="dark"] .summaryChapterCard.locked { background: #151d2b !important; } /* Fixing the card's background is half the job: the text inside it was still dark. Measured on the first pass, with the card already at #1A2333: .chTitle #0F172A - unreadable an unclassed SPAN #000000 - the chapter name, pure black .chSub #64748B - 3.3 A background fix that is not paired with its text leaves a dark panel with dark writing on it, which is the same defect the fix was for. */ html[data-ial-theme="dark"] .summaryChapterCard .chTitle, html[data-ial-theme="dark"] .summaryChapterCard .num, html[data-ial-theme="dark"] .summaryChapterCard span { color: #e2e8f0 !important; } html[data-ial-theme="dark"] .summaryChapterCard .chSub { color: #94a3b8 !important; } /* The chapter number is 13px on a #1A2333 card, so it needs a mid tone rather than the near-white used for the title - #7c9cff measured 2.37, this 4.9. */ html[data-ial-theme="dark"] .summaryChapterCard .num { color: #93a8d6 !important; } /* The number also carries its own background - a pale blue chip - which makes it the one element on the card that is still a light surface after the card itself has been repainted. Measured #93A8D6 on #EFF4FF at 2.16, i.e. worse than before, because the text was fixed while the chip behind it was not. */ html[data-ial-theme="dark"] .summaryChapterCard .num { background: #24304a !important; } html[data-ial-theme="dark"] .summaryChapterCard.locked .chTitle, html[data-ial-theme="dark"] .summaryChapterCard.locked span { color: #94a3b8 !important; } html[data-ial-theme="dark"] .gpCard--next p, html[data-ial-theme="dark"] .gpCard--next a { color: #b6c2d4 !important; } /* "What to practise next" also appears as a inside .gpEmpty, and that one sits in a light card - so the rules above never reached it and it measured 1.97. Two elements, same words, different containers: a selector written from the text rather than from the box fixes one and leaves the other. */ html[data-ial-theme="dark"] .gpEmpty, html[data-ial-theme="dark"] .gpEmpty b, html[data-ial-theme="dark"] .gpMore, html[data-ial-theme="dark"] .gpMore b { color: #94a3b8 !important; } /* -------------------------------------------------------------------------- 3. Light theme: 2.56 to 4.34, each a real miss against 4.5. The replacements are the next step up in the same family, so nothing shifts hue - this is a legibility fix, not a restyle. */ body.ial-v030 .gpEmpty, body.ial-v030 .gpEmpty b { color: #64748b !important; } body.ial-v030 .paperVariantDescription { color: #64748b !important; } body.ial-v030 .v073-paper-status.new { color: #5b6779 !important; } body.ial-v030 .gpScopeChip { color: #5b6779 !important; } body.ial-v030 .qid { color: #5b6779 !important; } /* The review tab counters carry no class of their own - they are bare BUTTONs inside .v027ReviewTabs, so a selector written from the component name is the only way in. Measured: "Marked wrong" at #69758B on #F0F3F8, 4.18. */ body.ial-v030 .v027ReviewTabs button { color: #5b6779 !important; } html[data-ial-theme="dark"] .v027ReviewTabs button { color: #a8b6c9 !important; } /* "The exam is in the spring" is the free-plan footnote: a bare SPAN inside li.is-off, which v087.css paints at #94A3B8 on white, 2.56. */ body.ial-v030 .v087-plan li.is-off, body.ial-v030 .v087-plan li.is-off span { color: #64748b !important; } body.ial-v030 .v087-plan li.is-off::before { color: #94a3b8 !important; } /* The pricing FAQ. The light rule above is the same declaration, and it loses: .v087-faqLine b carries its own colour from v087.css:92 at (0,1,1) against body.ial-v030 .v087-faqLine b at (0,2,2) - which should win - but V090's dark rule for the same element loads later and is declared for both themes. Written per theme here so the light one is not shadowed. */ body.ial-v030 .v087-faqLine, body.ial-v030 .v087-faqLine b { color: #64748b !important; } /* -------------------------------------------------------------------------- 5. The moved Previous button. V090 put "‹ Previous question" in the overflow menu as a proxy that clicks the original button. On the first question the original is disabled, so the click was correctly ignored - but the proxy was not, and it rendered as a live item with a pointer cursor that did nothing when pressed. Mirroring the original's state is V091's job; these rules are what "disabled" has to look like once it does, because the menu's own buttons are not styled as disabled by default and the item would otherwise look identical to Print and Photo. */ #v074OverflowMenu .v090-menuItem:disabled, #v074OverflowMenu .v090-menuItem[aria-disabled="true"] { opacity: .45 !important; cursor: default !important; pointer-events: none !important; } #v074OverflowMenu .v090-menuItem:disabled:hover, #v074OverflowMenu .v090-menuItem[aria-disabled="true"]:hover { background: transparent !important; } /* -------------------------------------------------------------------------- 4. Dark theme. Declared last on purpose: these selectors and the light ones above have the same specificity in their own half (html[data-ial-theme] is one attribute, body.ial-v030 is one class plus an element, so the light set actually wins on paper) - which is why the first pass, with the dark block first, measured .v073-paper-status.new at 2.49 under the dark theme: the light #5B6779 was landing on the dark card. Order is the mechanism. */ html[data-ial-theme="dark"] .gpBandLabel { color: #94a3b8 !important; } html[data-ial-theme="dark"] .gpModuleLabel { color: #94a3b8 !important; } html[data-ial-theme="dark"] .qid { color: #94a3b8 !important; } html[data-ial-theme="dark"] .gpScopeChip { color: #94a3b8 !important; } html[data-ial-theme="dark"] .v073-paper-status.new { color: #94a3b8 !important; } html[data-ial-theme="dark"] .paperVariantDescription { color: #94a3b8 !important; } /* V090 set this button's light-theme value to #475569 and only checked the light theme. Under the dark theme that lands on #212B3A at 1.88. */ html[data-ial-theme="dark"] .btn.v086-practice-picked { color: #e8edf6 !important; } html[data-ial-theme="dark"] .btn.v086-practice-picked:disabled { color: #8b9bb4 !important; } /* V090 gave the pricing FAQ a light-theme-only rule; under the dark theme the heading fell back to V088's token and measured 3.63 on #131B28. */ html[data-ial-theme="dark"] .v087-faqLine, html[data-ial-theme="dark"] .v087-faqLine b { color: #cbd5e1 !important; } /* Scoped to the span because the li itself has no text node of its own here, and V090's .v087-no / .v087-yes rules in the same file would otherwise be the last word on any bare span inside a plan card. */ html[data-ial-theme="dark"] .v087-plan li.is-off > span, html[data-ial-theme="dark"] .v087-plan li.is-off span.v087-no { color: #94a3b8 !important; }