/** * iOS 15 color-mix() manual fallbacks (2026-10-07). * ============================================================================= * scripts/ios15-colormix-fallbacks.cjs computes fallbacks for every * color-mix() it can resolve to ONE honest value. 75 declarations were * SKIPPED because the generator cannot compute one honest value for them: * the token varies per element (a "guessed token", e.g. --choice-accent is * teal/amber/blue/purple per [data-board-type]), the mix uses currentColor * (not computable without a fixed text colour), or the value is otherwise * unresolved/unknown to the tool. This file hand-resolves the ones that CAN * be resolved by enumerating every concrete variant selector and mixing its * literal value, per CSS Color 5 premultiplied srgb (same maths the * generator itself uses). Declarations that genuinely cannot be resolved * honestly (truly continuous runtime values, inline per-instance JS custom * properties with no reflecting class/attribute, or cascade interactions too * entangled to verify statically) are left alone and listed as unresolved in * tests/unit/guards/ios15-manual-fallbacks-cover-the-skipped-2026-10-07.test.js. * * Linked directly after css/ios15-overrides.css (index.html) so these * fallbacks also win the cascade on iOS 15 / Safari 15.6, which cannot * compute color-mix() at all and is dropped the whole declaration when the * mix contains a var() (see ios15-overrides.css's own header for why). * * Same @supports condition as ios15-overrides.css, so both sheets apply (or * don't) identically. */ @supports not (color: color-mix(in srgb, red 50%, blue)) { /* --------------------------------------------------------------------- * css/board-modals.css — #create-board-modal .cbm-choice (lines 1653, * 1669-1670, 1710-1711, 1729-1730, 1733-1734). --choice-accent is * teal/amber/blue/#create-board-modal purple per [data-board-type]. * meeting = var(--color-primary) = --primary-500 #14b8a6 * shared-days = var(--color-warning) = --warning #f59e0b * group = var(--color-info) = --info #3b82f6 * booking = var(--fairness-purple) #7c3aed * (none of the four differ between light/dark.) * --------------------------------------------------------------------- */ #create-board-modal .cbm-choice[data-board-type="meeting"] .cbm-choice-icon { background: rgba(20, 184, 166, 0.14); color: #109081; } #create-board-modal .cbm-choice[data-board-type="shared-days"] .cbm-choice-icon { background: rgba(245, 158, 11, 0.14); color: #bf7b09; } #create-board-modal .cbm-choice[data-board-type="group"] .cbm-choice-icon { background: rgba(59, 130, 246, 0.14); color: #2e65c0; } #create-board-modal .cbm-choice[data-board-type="booking"] .cbm-choice-icon { background: rgba(124, 58, 237, 0.14); color: #612db9; } #create-board-modal .cbm-choice[data-board-type="meeting"] .cbm-choice-who { background: rgba(20, 184, 166, 0.14); color: #0e8174; } #create-board-modal .cbm-choice[data-board-type="shared-days"] .cbm-choice-who { background: rgba(245, 158, 11, 0.14); color: #ac6f08; } #create-board-modal .cbm-choice[data-board-type="group"] .cbm-choice-who { background: rgba(59, 130, 246, 0.14); color: #295bac; } #create-board-modal .cbm-choice[data-board-type="booking"] .cbm-choice-who { background: rgba(124, 58, 237, 0.14); color: #5729a6; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="meeting"] .cbm-choice-icon { background: rgba(20, 184, 166, 0.24); color: #5bcdc1; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="shared-days"] .cbm-choice-icon { background: rgba(245, 158, 11, 0.24); color: #f8bb54; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="group"] .cbm-choice-icon { background: rgba(59, 130, 246, 0.24); color: #76a8f9; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="booking"] .cbm-choice-icon { background: rgba(124, 58, 237, 0.24); color: #a375f2; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="meeting"] .cbm-choice-who { background: rgba(20, 184, 166, 0.26); color: #7ed8ce; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="shared-days"] .cbm-choice-who { background: rgba(245, 158, 11, 0.26); color: #faca79; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="group"] .cbm-choice-who { background: rgba(59, 130, 246, 0.26); color: #93bafa; } body.dark-mode #create-board-modal .cbm-choice[data-board-type="booking"] .cbm-choice-who { background: rgba(124, 58, 237, 0.26); color: #b793f5; } /* --------------------------------------------------------------------- * css/add-teammate-wizard.css:495 — .atw-time-selection background. * --sel-bracket here is the STATIC default var(--event-work, #3b82f6); * this rule (unlike time-range-picker.js's variantColor) never gets a * per-element JS override, and --event-work is a single unambiguous * #3b82f6 (style.css:269, no dark override). "guessed token" was a * tooling artefact of css/main.css's unlinked duplicate --event-work * definition, not a real ambiguity. * --------------------------------------------------------------------- */ .atw-time-selection { background: rgba(59, 130, 246, 0.16); } /* --------------------------------------------------------------------- * css/calendar-views.css — --event-chip-accent varies by the chip's * .event-type-* class (css/event-chip.css:131-152). Nine canonical * accents, none differing light/dark except busy: * work/shift #3b82f6, personal #db2777, external #14b8a6, * timeoff #f59e0b, availability #22c55e, meeting #8b5cf6, * other #6b7280, task #6366f1, busy rgb(120,130,150)/dark rgb(100,116,139) * Lines 2535 (border 38%), 2543 (bg 22% into #fff), 2556 (title 72% into * #0f172a), 2561 (time 60% into #334155), 2571 (dark border 50%), 2577 * (dark bg 30% into #1e293b), 2581 (dark title 45% into #f1f5f9), 2585 * (dark time 40% into #cbd5e1). * --------------------------------------------------------------------- */ #calendar-days .event-chip.event-chip-mini.event-type-work, .calendar-days .event-chip.event-chip-mini.event-type-work, #calendar-days .event-chip.event-chip-mini.event-type-shift, .calendar-days .event-chip.event-chip-mini.event-type-shift { border: 1px solid rgba(59, 130, 246, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-personal, .calendar-days .event-chip.event-chip-mini.event-type-personal { border: 1px solid rgba(219, 39, 119, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-external, .calendar-days .event-chip.event-chip-mini.event-type-external { border: 1px solid rgba(20, 184, 166, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-timeoff, .calendar-days .event-chip.event-chip-mini.event-type-timeoff { border: 1px solid rgba(245, 158, 11, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-availability, .calendar-days .event-chip.event-chip-mini.event-type-availability { border: 1px solid rgba(34, 197, 94, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-meeting, .calendar-days .event-chip.event-chip-mini.event-type-meeting { border: 1px solid rgba(139, 92, 246, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-other, .calendar-days .event-chip.event-chip-mini.event-type-other { border: 1px solid rgba(107, 114, 128, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-task, .calendar-days .event-chip.event-chip-mini.event-type-task { border: 1px solid rgba(99, 102, 241, 0.38); } #calendar-days .event-chip.event-chip-mini.event-type-busy, .calendar-days .event-chip.event-chip-mini.event-type-busy { border: 1px solid rgba(120, 130, 150, 0.38); } #calendar-days .event-chip.event-chip-mini[data-category].event-type-work, .calendar-days .event-chip.event-chip-mini[data-category].event-type-work, #calendar-days .event-chip.event-chip-mini[data-category].event-type-shift, .calendar-days .event-chip.event-chip-mini[data-category].event-type-shift { background: #d4e4fd; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-personal, .calendar-days .event-chip.event-chip-mini[data-category].event-type-personal { background: #f7cfe1; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-external, .calendar-days .event-chip.event-chip-mini[data-category].event-type-external { background: #cbefeb; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-timeoff, .calendar-days .event-chip.event-chip-mini[data-category].event-type-timeoff { background: #fdeac9; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-availability, .calendar-days .event-chip.event-chip-mini[data-category].event-type-availability { background: #cef2dc; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-meeting, .calendar-days .event-chip.event-chip-mini[data-category].event-type-meeting { background: #e5dbfd; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-other, .calendar-days .event-chip.event-chip-mini[data-category].event-type-other { background: #dee0e3; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-task, .calendar-days .event-chip.event-chip-mini[data-category].event-type-task { background: #ddddfc; } #calendar-days .event-chip.event-chip-mini[data-category].event-type-busy, .calendar-days .event-chip.event-chip-mini[data-category].event-type-busy { background: #e1e4e8; } #calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-title, #calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-title { color: #2f64bd; } #calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-title { color: #a22361; } #calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-title { color: #138b83; } #calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-title { color: #b57814; } #calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-title { color: #1d944f; } #calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-title { color: #6849bd; } #calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-title { color: #515968; } #calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-title { color: #4b50b9; } #calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-title, .calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-title { color: #5b6478; } #calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-time, #calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-time { color: #3868b6; } #calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-time { color: #983169; } #calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-time { color: #208886; } #calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-time { color: #a77929; } #calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-time { color: #29905a; } #calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-time { color: #6851b6; } #calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-time { color: #555e6f; } #calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-time { color: #5057b3; } #calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-time, .calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-time { color: #5c687c; } body.dark-mode #calendar-days .event-chip-mini.event-type-work, body.dark-mode .calendar-days .event-chip-mini.event-type-work, body.dark-mode #calendar-days .event-chip-mini.event-type-shift, body.dark-mode .calendar-days .event-chip-mini.event-type-shift { border-color: rgba(59, 130, 246, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-personal, body.dark-mode .calendar-days .event-chip-mini.event-type-personal { border-color: rgba(219, 39, 119, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-external, body.dark-mode .calendar-days .event-chip-mini.event-type-external { border-color: rgba(20, 184, 166, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-timeoff, body.dark-mode .calendar-days .event-chip-mini.event-type-timeoff { border-color: rgba(245, 158, 11, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-availability, body.dark-mode .calendar-days .event-chip-mini.event-type-availability { border-color: rgba(34, 197, 94, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-meeting, body.dark-mode .calendar-days .event-chip-mini.event-type-meeting { border-color: rgba(139, 92, 246, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-other, body.dark-mode .calendar-days .event-chip-mini.event-type-other { border-color: rgba(107, 114, 128, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-task, body.dark-mode .calendar-days .event-chip-mini.event-type-task { border-color: rgba(99, 102, 241, 0.5); } body.dark-mode #calendar-days .event-chip-mini.event-type-busy, body.dark-mode .calendar-days .event-chip-mini.event-type-busy { border-color: rgba(100, 116, 139, 0.5); } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-work, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-work, body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-shift, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-shift { background: #274473; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-personal, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-personal { background: #57284d; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-external, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-external { background: #1b545b; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-timeoff, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-timeoff { background: #5f4c2d; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-availability, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-availability { background: #1f5846; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-meeting, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-meeting { background: #3f3873; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-other, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-other { background: #353f50; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-task, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-task { background: #333b72; } body.dark-mode #calendar-days .event-chip.event-chip-mini[data-category].event-type-busy, body.dark-mode .calendar-days .event-chip.event-chip-mini[data-category].event-type-busy { background: #334053; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-title, body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-title { color: #9fc1f8; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-title { color: #e798bf; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-title { color: #8edad4; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-title { color: #f3ce8e; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-title { color: #94dfb3; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-title { color: #c3b0f8; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-title { color: #b5bac3; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-title { color: #b1b5f5; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-title, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-title { color: #b2bbc8; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-work .event-chip-time, body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-shift .event-chip-time { color: #91b4e9; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-personal .event-chip-time { color: #d18fb7; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-external .event-chip-time { color: #82c9c9; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-timeoff .event-chip-time { color: #dcbf8b; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-availability .event-chip-time { color: #87cfad; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-meeting .event-chip-time { color: #b1a5e9; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-other .event-chip-time { color: #a5adba; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-task .event-chip-time { color: #a1a9e7; } body.dark-mode #calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-time, body.dark-mode .calendar-days .event-chip.event-chip-mini.event-type-busy .event-chip-time { color: #a2aebf; } /* --------------------------------------------------------------------- * css/day-nav.css:1118 — .events-overflow-blocks:hover .events-overflow-block * background. block.className always includes event-type-${canon} * (js/ui/calendar.js:1103), so --event-chip-accent is always the * operative source; --block-color is a defensive fallback never hit in * practice. Same 9-accent table as calendar-views.css above, 18% mix. * --------------------------------------------------------------------- */ .events-overflow-blocks:hover .events-overflow-block.event-type-work, .events-overflow-blocks:hover .events-overflow-block.event-type-shift { background: rgba(59, 130, 246, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-personal { background: rgba(219, 39, 119, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-external { background: rgba(20, 184, 166, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-timeoff { background: rgba(245, 158, 11, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-availability { background: rgba(34, 197, 94, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-meeting { background: rgba(139, 92, 246, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-other { background: rgba(107, 114, 128, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-task { background: rgba(99, 102, 241, 0.18); } .events-overflow-blocks:hover .events-overflow-block.event-type-busy { background: rgba(120, 130, 150, 0.18); } /* --------------------------------------------------------------------- * css/event-chip.css:60 — .event-chip[data-status="tentative"/"proposed"] * border, color-mix(currentColor 45%, transparent). currentColor is fixed * by .event-chip's own color (no .event-type-* sets `color`, only * --event-chip-accent): #1e293b light, #f1f5f9 dark (body.dark-mode * .event-chip). * --------------------------------------------------------------------- */ .event-chip[data-status="tentative"], .event-chip[data-status="proposed"] { border: 1.5px dashed rgba(30, 41, 59, 0.45); } body.dark-mode .event-chip[data-status="tentative"], body.dark-mode .event-chip[data-status="proposed"] { border-color: rgba(241, 245, 249, 0.45); } /* --------------------------------------------------------------------- * css/event-chip.css:252 (.event-chip:hover, 16%), 298 (.event-chip- * shift-badge, 18%), 458 (.event-chip-meta-category, 14%), 483 (dark * .event-chip-card, 8% into #1e293b) — same 9-accent --event-chip-accent * table as above. * --------------------------------------------------------------------- */ .event-chip.event-type-work:hover, .event-chip.event-type-shift:hover { background: rgba(59, 130, 246, 0.16); } .event-chip.event-type-personal:hover { background: rgba(219, 39, 119, 0.16); } .event-chip.event-type-external:hover { background: rgba(20, 184, 166, 0.16); } .event-chip.event-type-timeoff:hover { background: rgba(245, 158, 11, 0.16); } .event-chip.event-type-availability:hover { background: rgba(34, 197, 94, 0.16); } .event-chip.event-type-meeting:hover { background: rgba(139, 92, 246, 0.16); } .event-chip.event-type-other:hover { background: rgba(107, 114, 128, 0.16); } .event-chip.event-type-task:hover { background: rgba(99, 102, 241, 0.16); } .event-chip.event-type-busy:hover { background: rgba(120, 130, 150, 0.16); } .event-chip.event-type-work .event-chip-shift-badge, .event-chip.event-type-shift .event-chip-shift-badge { background: rgba(59, 130, 246, 0.18); } .event-chip.event-type-personal .event-chip-shift-badge { background: rgba(219, 39, 119, 0.18); } .event-chip.event-type-external .event-chip-shift-badge { background: rgba(20, 184, 166, 0.18); } .event-chip.event-type-timeoff .event-chip-shift-badge { background: rgba(245, 158, 11, 0.18); } .event-chip.event-type-availability .event-chip-shift-badge { background: rgba(34, 197, 94, 0.18); } .event-chip.event-type-meeting .event-chip-shift-badge { background: rgba(139, 92, 246, 0.18); } .event-chip.event-type-other .event-chip-shift-badge { background: rgba(107, 114, 128, 0.18); } .event-chip.event-type-task .event-chip-shift-badge { background: rgba(99, 102, 241, 0.18); } .event-chip.event-type-busy .event-chip-shift-badge { background: rgba(120, 130, 150, 0.18); } .event-chip.event-chip-card.event-type-work .event-chip-meta-category, .event-chip.event-chip-card.event-type-shift .event-chip-meta-category { background: rgba(59, 130, 246, 0.14); } .event-chip.event-chip-card.event-type-personal .event-chip-meta-category { background: rgba(219, 39, 119, 0.14); } .event-chip.event-chip-card.event-type-external .event-chip-meta-category { background: rgba(20, 184, 166, 0.14); } .event-chip.event-chip-card.event-type-timeoff .event-chip-meta-category { background: rgba(245, 158, 11, 0.14); } .event-chip.event-chip-card.event-type-availability .event-chip-meta-category { background: rgba(34, 197, 94, 0.14); } .event-chip.event-chip-card.event-type-meeting .event-chip-meta-category { background: rgba(139, 92, 246, 0.14); } .event-chip.event-chip-card.event-type-other .event-chip-meta-category { background: rgba(107, 114, 128, 0.14); } .event-chip.event-chip-card.event-type-task .event-chip-meta-category { background: rgba(99, 102, 241, 0.14); } .event-chip.event-chip-card.event-type-busy .event-chip-meta-category { background: rgba(120, 130, 150, 0.14); } body.dark-mode .event-chip.event-chip-card.event-type-work, body.dark-mode .event-chip.event-chip-card.event-type-shift { background: #20304a; } body.dark-mode .event-chip.event-chip-card.event-type-personal { background: #2d2940; } body.dark-mode .event-chip.event-chip-card.event-type-external { background: #1d3444; } body.dark-mode .event-chip.event-chip-card.event-type-timeoff { background: #2f3237; } body.dark-mode .event-chip.event-chip-card.event-type-availability { background: #1e353e; } body.dark-mode .event-chip.event-chip-card.event-type-meeting { background: #272d4a; } body.dark-mode .event-chip.event-chip-card.event-type-other { background: #242f41; } body.dark-mode .event-chip.event-chip-card.event-type-task { background: #242e4a; } body.dark-mode .event-chip.event-chip-card.event-type-busy { background: #242f41; } /* --------------------------------------------------------------------- * css/fairness-dashboard.css:3452 — #fm-hero .fm-hero-status background. * NOT duplicated here: already hand-resolved in that file's own * `@supports not (background: color-mix(in srgb, red 12%, transparent))` * block (lines 3461-3469), which this generator run's skip-scan cannot * see because it only inspects the ORIGINAL declaration's own leader, not * sibling @supports blocks for the same selector elsewhere in the file. * --------------------------------------------------------------------- */ /* --------------------------------------------------------------------- * css/panel-chrome.css:467 (.fr-band background) and 734-735 * (.fr-chip[data-tilt] background/border-color) — NOT duplicated here: * already hand-resolved in that same file's own * `@supports not (background: color-mix(in srgb, red 12%, transparent))` * block (lines 974-1046), covering every [data-band]/[data-tilt] variant * in both themes. * --------------------------------------------------------------------- */ /* --------------------------------------------------------------------- * css/find-best-time.css:1887 — .fbt-metric:hover background, * color-mix(var(--m-color) 8%, ...). --m-color is set inline per * instance (js/ui/find-best-time.js:1134/1612) from one of 6 fixed * per-metric-type colours (badge.color), but the metric TYPE (badgeId) * is never reflected as a class or attribute on .fbt-metric — only * levelClass (score band: perfect/good/fair/poor) is, and that does not * correlate with badge.color. No CSS selector can discriminate which of * the 6 colours applies. UNRESOLVED (see guard test's * ALLOWED_UNRESOLVED). * --------------------------------------------------------------------- */ /* --------------------------------------------------------------------- * css/review-inbox.css:6151-6152, 6177 — .rc-golden-window / * .rc-golden-window--span. --rc-gw-tone varies by .rc-gw-* class on the * same element (css/review-inbox.css:6167-6170): default #14b8a6, * excellent #16a34a, good #22c55e, fair #f59e0b, limited #f97316. No * dark override of --rc-gw-tone itself. * --------------------------------------------------------------------- */ .rc-golden-window { background: rgba(20, 184, 166, 0.1); border: 1px solid rgba(20, 184, 166, 0.28); } .rc-golden-window.rc-gw-excellent { background: rgba(22, 163, 74, 0.1); border: 1px solid rgba(22, 163, 74, 0.28); } .rc-golden-window.rc-gw-good { background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.28); } .rc-golden-window.rc-gw-fair { background: rgba(245, 158, 11, 0.1); border: 1px solid rgba(245, 158, 11, 0.28); } .rc-golden-window.rc-gw-limited { background: rgba(249, 115, 22, 0.1); border: 1px solid rgba(249, 115, 22, 0.28); } .rc-golden-window--span { background: rgba(20, 184, 166, 0.08); } .rc-golden-window--span.rc-gw-excellent { background: rgba(22, 163, 74, 0.08); } .rc-golden-window--span.rc-gw-good { background: rgba(34, 197, 94, 0.08); } .rc-golden-window--span.rc-gw-fair { background: rgba(245, 158, 11, 0.08); } .rc-golden-window--span.rc-gw-limited { background: rgba(249, 115, 22, 0.08); } /* --------------------------------------------------------------------- * css/review-inbox.css:11288, 11298 — .timeoff-type-badge background. * --timeoff-color is set inline per-instance (js/ui/review-dashboard.js: * 9648) from typeColors{} keyed on request.timeOffType, and the badge * carries no class/attribute reflecting that type. UNRESOLVED (see * guard test's ALLOWED_UNRESOLVED). * --------------------------------------------------------------------- */ /* --------------------------------------------------------------------- * css/review-inbox.css:16434 — .rc-navrow .review-tab.active box-shadow, * color-mix(currentColor 55%, transparent). currentColor is fixed: * .review-tab.active { color: var(--white, #fff); } (no .tab-* colour * class overrides the TAB's own color, only its child .tab-icon). * --------------------------------------------------------------------- */ .rc-navrow .review-tab.active { box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55); } /* --------------------------------------------------------------------- * css/settings-modals.css — .fm-hero[data-band] (lines 1942, 1945, 1947, * 1948, 1950, 1955, 1958, 1960, 1961, 1963). --fm-band-hue per band * (settings-modals.css:1935-1939), light vs dark differ (css/fairness- * view.css --fv-l2/l3/l5/l7/l8): * excellent --fv-l2 #15803d / dark #16a34a * balanced --fv-l3 #16a34a / dark #22c55e * mixed --fv-l5 #fbbf24 / dark #fbbf24 * stretched --fv-l7 #ef4444 / dark #ef4444 * overloaded --fv-l8 #dc2626 / dark #dc2626 * --------------------------------------------------------------------- */ .fm-hero[data-band="excellent"] { background: linear-gradient(135deg, #ecf5ef 0%, #daebe0 100%); border-color: rgba(21, 128, 61, 0.3); } .fm-hero[data-band="balanced"] { background: linear-gradient(135deg, #ecf8f1 0%, #daf0e2 100%); border-color: rgba(22, 163, 74, 0.3); } .fm-hero[data-band="mixed"] { background: linear-gradient(135deg, #fffaed 0%, #fef5dc 100%); border-color: rgba(251, 191, 36, 0.3); } .fm-hero[data-band="stretched"] { background: linear-gradient(135deg, #fef0f0 0%, #fce1e1 100%); border-color: rgba(239, 68, 68, 0.3); } .fm-hero[data-band="overloaded"] { background: linear-gradient(135deg, #fceeee 0%, #f9dcdc 100%); border-color: rgba(220, 38, 38, 0.3); } .fm-hero[data-band="excellent"] .fm-hero-title { color: #146638; } .fm-hero[data-band="balanced"] .fm-hero-title { color: #148042; } .fm-hero[data-band="mixed"] .fm-hero-title { color: #c09526; } .fm-hero[data-band="stretched"] .fm-hero-title { color: #b7393e; } .fm-hero[data-band="overloaded"] .fm-hero-title { color: #a92227; } .fm-hero[data-band="excellent"] .fm-hero-subtitle { color: #216747; } .fm-hero[data-band="balanced"] .fm-hero-subtitle { color: #227c4e; } .fm-hero[data-band="mixed"] .fm-hero-subtitle { color: #ab8d38; } .fm-hero[data-band="stretched"] .fm-hero-subtitle { color: #a4434b; } .fm-hero[data-band="overloaded"] .fm-hero-subtitle { color: #983139; } .fm-hero[data-band="excellent"] .fm-score-label { color: #24734a; } .fm-hero[data-band="balanced"] .fm-score-label { color: #258c53; } .fm-hero[data-band="mixed"] .fm-score-label { color: #c59f39; } .fm-hero[data-band="stretched"] .fm-score-label { color: #bd494f; } .fm-hero[data-band="overloaded"] .fm-score-label { color: #af343a; } body.dark-mode .fm-hero[data-band="excellent"] { background: linear-gradient(135deg, #102d2f 0%, #113b32 100%); border-color: rgba(22, 163, 74, 0.4); } body.dark-mode .fm-hero[data-band="balanced"] { background: linear-gradient(135deg, #123332 0%, #144438 100%); border-color: rgba(34, 197, 94, 0.4); } body.dark-mode .fm-hero[data-band="mixed"] { background: linear-gradient(135deg, #353229 0%, #4c4328 100%); border-color: rgba(251, 191, 36, 0.4); } body.dark-mode .fm-hero[data-band="stretched"] { background: linear-gradient(135deg, #331e2e 0%, #492331 100%); border-color: rgba(239, 68, 68, 0.4); } body.dark-mode .fm-hero[data-band="overloaded"] { background: linear-gradient(135deg, #301929 0%, #441b29 100%); border-color: rgba(220, 38, 38, 0.4); } body.dark-mode .fm-hero[data-band="excellent"] .fm-hero-title { color: #84cca2; } body.dark-mode .fm-hero[data-band="balanced"] .fm-hero-title { color: #8addac; } body.dark-mode .fm-hero[data-band="mixed"] .fm-hero-title { color: #f6da8f; } body.dark-mode .fm-hero[data-band="stretched"] .fm-hero-title { color: #f09d9f; } body.dark-mode .fm-hero[data-band="overloaded"] .fm-hero-title { color: #e78e90; } body.dark-mode .fm-hero[data-band="excellent"] .fm-hero-subtitle { color: #8cc4ac; } body.dark-mode .fm-hero[data-band="balanced"] .fm-hero-subtitle { color: #90cfb3; } body.dark-mode .fm-hero[data-band="mixed"] .fm-hero-subtitle { color: #dccd9f; } body.dark-mode .fm-hero[data-band="stretched"] .fm-hero-subtitle { color: #d8a2aa; } body.dark-mode .fm-hero[data-band="overloaded"] .fm-hero-subtitle { color: #d198a0; } body.dark-mode .fm-hero[data-band="excellent"] .fm-score-number, body.dark-mode .fm-hero[data-band="excellent"] .fm-hero-status { color: #79c899; } body.dark-mode .fm-hero[data-band="balanced"] .fm-score-number, body.dark-mode .fm-hero[data-band="balanced"] .fm-hero-status { color: #7fdba4; } body.dark-mode .fm-hero[data-band="mixed"] .fm-score-number, body.dark-mode .fm-hero[data-band="mixed"] .fm-hero-status { color: #f7d784; } body.dark-mode .fm-hero[data-band="stretched"] .fm-score-number, body.dark-mode .fm-hero[data-band="stretched"] .fm-hero-status { color: #f09495; } body.dark-mode .fm-hero[data-band="overloaded"] .fm-score-number, body.dark-mode .fm-hero[data-band="overloaded"] .fm-hero-status { color: #e58385; } /* --------------------------------------------------------------------- * css/team-dashboard.css:2544-2545 — .role-change-visual .role-badge. * --role-color per .role-badge.role-* (css/permissions.css:35-48), same * light/dark: owner #f59e0b, admin #8b5cf6, member #14b8a6, * viewer #94a3b8. * --------------------------------------------------------------------- */ .role-change-visual .role-badge.role-owner { background: rgba(245, 158, 11, 0.15); border: 1px solid rgba(245, 158, 11, 0.3); } .role-change-visual .role-badge.role-admin { background: rgba(139, 92, 246, 0.15); border: 1px solid rgba(139, 92, 246, 0.3); } .role-change-visual .role-badge.role-member { background: rgba(20, 184, 166, 0.15); border: 1px solid rgba(20, 184, 166, 0.3); } .role-change-visual .role-badge.role-viewer { background: rgba(148, 163, 184, 0.15); border: 1px solid rgba(148, 163, 184, 0.3); } /* --------------------------------------------------------------------- * css/team-summary-panel.css:907 — .ts-lane-key[data-key="hourbar"]::before * box-shadow, color-mix(currentColor 35%, transparent). currentColor * fixed by .ts-lane-key[data-key="hourbar"] { color: var(--text- * secondary, #64748b); }. --text-secondary differs light/dark * (style.css:160/1094): #64748b / #94a3b8. * --------------------------------------------------------------------- */ .ts-lane-key[data-key="hourbar"]::before { box-shadow: inset 0 0 0 1px rgba(100, 116, 139, 0.35); } body.dark-mode .ts-lane-key[data-key="hourbar"]::before { box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.35); } /* --------------------------------------------------------------------- * css/team-summary-panel.css:953 — .ts-peak-bar background, * color-mix(currentColor 50%, transparent). currentColor inherited from * .ts-barlane[data-tone], css/team-summary-panel.css:1075-1077 (+ the * base rule's --status-working for the no-tone/full-team case). None of * these 4 status tokens differ light/dark. * --------------------------------------------------------------------- */ .ts-barlane .ts-peak-bar { background: rgba(22, 163, 74, 0.5); } .ts-barlane[data-tone="most"] .ts-peak-bar { background: rgba(34, 197, 94, 0.5); } .ts-barlane[data-tone="few"] .ts-peak-bar { background: rgba(251, 191, 36, 0.5); } .ts-barlane[data-tone="none"] .ts-peak-bar { background: rgba(220, 38, 38, 0.5); } /* --------------------------------------------------------------------- * css/view-mode-strip.css — --mode-tint / --mode-accent vary by * [data-color-mode]/[data-vm-mode]/[data-scanner] (lines 440-546): five * modes, light + dark differ for every one. * daynight #ea580c / dark #fb923c (tint rgba(249,115,22,.10)/.18) * availability #059669 / dark #34d399 (tint rgba(5,150,105,.10) / rgba(16,185,129,.18)) * fairness #7e22ce / dark #c084fc (tint rgba(168,85,247,.10/.18)) * overlap #a16207 / dark #fcd34d (tint rgba(251,191,36,.14/.20)) * clean #475569 / dark #cbd5e1 (tint rgba(100,116,139,.10) / rgba(148,163,184,.18)) * line 707 (.vm-picker-row resting bg, tint 45%), 811 (::before accent * bar 35%), 870 (scanner divider border-top-color 35%), 1349 (scanner * opt bg 8%), 1350 (scanner opt border 30%), 1365 (scanner opt hover bg * 16%), 1366 (scanner opt hover border 50%), 1381 (scanner opt checked * box-shadow 35%). * --------------------------------------------------------------------- */ .vm-picker-row[data-color-mode="daynight"] { background: rgba(249, 115, 22, 0.045); } .vm-picker-row[data-color-mode="availability"] { background: rgba(5, 150, 105, 0.045); } .vm-picker-row[data-color-mode="fairness"] { background: rgba(168, 85, 247, 0.045); } .vm-picker-row[data-color-mode="overlap"] { background: rgba(251, 191, 36, 0.063); } .vm-picker-row[data-color-mode="clean"] { background: rgba(100, 116, 139, 0.045); } body.dark-mode .vm-picker-row[data-color-mode="daynight"] { background: rgba(249, 115, 22, 0.081); } body.dark-mode .vm-picker-row[data-color-mode="availability"] { background: rgba(16, 185, 129, 0.081); } body.dark-mode .vm-picker-row[data-color-mode="fairness"] { background: rgba(168, 85, 247, 0.081); } body.dark-mode .vm-picker-row[data-color-mode="overlap"] { background: rgba(251, 191, 36, 0.09); } body.dark-mode .vm-picker-row[data-color-mode="clean"] { background: rgba(148, 163, 184, 0.081); } .vm-picker-row[data-color-mode="daynight"]::before { background: rgba(234, 88, 12, 0.35); } .vm-picker-row[data-color-mode="availability"]::before { background: rgba(5, 150, 105, 0.35); } .vm-picker-row[data-color-mode="fairness"]::before { background: rgba(126, 34, 206, 0.35); } .vm-picker-row[data-color-mode="overlap"]::before { background: rgba(161, 98, 7, 0.35); } .vm-picker-row[data-color-mode="clean"]::before { background: rgba(71, 85, 105, 0.35); } body.dark-mode .vm-picker-row[data-color-mode="daynight"]::before { background: rgba(251, 146, 60, 0.35); } body.dark-mode .vm-picker-row[data-color-mode="availability"]::before { background: rgba(52, 211, 153, 0.35); } body.dark-mode .vm-picker-row[data-color-mode="fairness"]::before { background: rgba(192, 132, 252, 0.35); } body.dark-mode .vm-picker-row[data-color-mode="overlap"]::before { background: rgba(252, 211, 77, 0.35); } body.dark-mode .vm-picker-row[data-color-mode="clean"]::before { background: rgba(203, 213, 225, 0.35); } .vm-picker-info-section--scanner[data-scanner="daynight"] { border-top-color: rgba(234, 88, 12, 0.35); } .vm-picker-info-section--scanner[data-scanner="availability"] { border-top-color: rgba(5, 150, 105, 0.35); } .vm-picker-info-section--scanner[data-scanner="fairness"] { border-top-color: rgba(126, 34, 206, 0.35); } .vm-picker-info-section--scanner[data-scanner="overlap"] { border-top-color: rgba(161, 98, 7, 0.35); } .vm-picker-info-section--scanner[data-scanner="clean"] { border-top-color: rgba(71, 85, 105, 0.35); } body.dark-mode .vm-picker-info-section--scanner[data-scanner="daynight"] { border-top-color: rgba(251, 146, 60, 0.35); } body.dark-mode .vm-picker-info-section--scanner[data-scanner="availability"] { border-top-color: rgba(52, 211, 153, 0.35); } body.dark-mode .vm-picker-info-section--scanner[data-scanner="fairness"] { border-top-color: rgba(192, 132, 252, 0.35); } body.dark-mode .vm-picker-info-section--scanner[data-scanner="overlap"] { border-top-color: rgba(252, 211, 77, 0.35); } body.dark-mode .vm-picker-info-section--scanner[data-scanner="clean"] { border-top-color: rgba(203, 213, 225, 0.35); } .vm-picker-scanner-opt[data-scanner="daynight"] { background: rgba(234, 88, 12, 0.08); border: 1.5px solid rgba(234, 88, 12, 0.3); } .vm-picker-scanner-opt[data-scanner="availability"] { background: rgba(5, 150, 105, 0.08); border: 1.5px solid rgba(5, 150, 105, 0.3); } .vm-picker-scanner-opt[data-scanner="fairness"] { background: rgba(126, 34, 206, 0.08); border: 1.5px solid rgba(126, 34, 206, 0.3); } .vm-picker-scanner-opt[data-scanner="overlap"] { background: rgba(161, 98, 7, 0.08); border: 1.5px solid rgba(161, 98, 7, 0.3); } .vm-picker-scanner-opt[data-scanner="clean"] { background: rgba(71, 85, 105, 0.08); border: 1.5px solid rgba(71, 85, 105, 0.3); } body.dark-mode .vm-picker-scanner-opt[data-scanner="daynight"] { background: rgba(251, 146, 60, 0.08); border: 1.5px solid rgba(251, 146, 60, 0.3); } body.dark-mode .vm-picker-scanner-opt[data-scanner="availability"] { background: rgba(52, 211, 153, 0.08); border: 1.5px solid rgba(52, 211, 153, 0.3); } body.dark-mode .vm-picker-scanner-opt[data-scanner="fairness"] { background: rgba(192, 132, 252, 0.08); border: 1.5px solid rgba(192, 132, 252, 0.3); } body.dark-mode .vm-picker-scanner-opt[data-scanner="overlap"] { background: rgba(252, 211, 77, 0.08); border: 1.5px solid rgba(252, 211, 77, 0.3); } body.dark-mode .vm-picker-scanner-opt[data-scanner="clean"] { background: rgba(203, 213, 225, 0.08); border: 1.5px solid rgba(203, 213, 225, 0.3); } .vm-picker-scanner-opt[data-scanner="daynight"]:hover { background: rgba(234, 88, 12, 0.16); border-color: rgba(234, 88, 12, 0.5); } .vm-picker-scanner-opt[data-scanner="availability"]:hover { background: rgba(5, 150, 105, 0.16); border-color: rgba(5, 150, 105, 0.5); } .vm-picker-scanner-opt[data-scanner="fairness"]:hover { background: rgba(126, 34, 206, 0.16); border-color: rgba(126, 34, 206, 0.5); } .vm-picker-scanner-opt[data-scanner="overlap"]:hover { background: rgba(161, 98, 7, 0.16); border-color: rgba(161, 98, 7, 0.5); } .vm-picker-scanner-opt[data-scanner="clean"]:hover { background: rgba(71, 85, 105, 0.16); border-color: rgba(71, 85, 105, 0.5); } body.dark-mode .vm-picker-scanner-opt[data-scanner="daynight"]:hover { background: rgba(251, 146, 60, 0.16); border-color: rgba(251, 146, 60, 0.5); } body.dark-mode .vm-picker-scanner-opt[data-scanner="availability"]:hover { background: rgba(52, 211, 153, 0.16); border-color: rgba(52, 211, 153, 0.5); } body.dark-mode .vm-picker-scanner-opt[data-scanner="fairness"]:hover { background: rgba(192, 132, 252, 0.16); border-color: rgba(192, 132, 252, 0.5); } body.dark-mode .vm-picker-scanner-opt[data-scanner="overlap"]:hover { background: rgba(252, 211, 77, 0.16); border-color: rgba(252, 211, 77, 0.5); } body.dark-mode .vm-picker-scanner-opt[data-scanner="clean"]:hover { background: rgba(203, 213, 225, 0.16); border-color: rgba(203, 213, 225, 0.5); } .vm-picker-scanner-opt[aria-checked="true"][data-scanner="daynight"] { box-shadow: 0 1px 3px rgba(234, 88, 12, 0.35); } .vm-picker-scanner-opt[aria-checked="true"][data-scanner="availability"] { box-shadow: 0 1px 3px rgba(5, 150, 105, 0.35); } .vm-picker-scanner-opt[aria-checked="true"][data-scanner="fairness"] { box-shadow: 0 1px 3px rgba(126, 34, 206, 0.35); } .vm-picker-scanner-opt[aria-checked="true"][data-scanner="overlap"] { box-shadow: 0 1px 3px rgba(161, 98, 7, 0.35); } .vm-picker-scanner-opt[aria-checked="true"][data-scanner="clean"] { box-shadow: 0 1px 3px rgba(71, 85, 105, 0.35); } body.dark-mode .vm-picker-scanner-opt[aria-checked="true"][data-scanner="daynight"] { box-shadow: 0 1px 3px rgba(251, 146, 60, 0.35); } body.dark-mode .vm-picker-scanner-opt[aria-checked="true"][data-scanner="availability"] { box-shadow: 0 1px 3px rgba(52, 211, 153, 0.35); } body.dark-mode .vm-picker-scanner-opt[aria-checked="true"][data-scanner="fairness"] { box-shadow: 0 1px 3px rgba(192, 132, 252, 0.35); } body.dark-mode .vm-picker-scanner-opt[aria-checked="true"][data-scanner="overlap"] { box-shadow: 0 1px 3px rgba(252, 211, 77, 0.35); } body.dark-mode .vm-picker-scanner-opt[aria-checked="true"][data-scanner="clean"] { box-shadow: 0 1px 3px rgba(203, 213, 225, 0.35); } /* --------------------------------------------------------------------- * css/view-mode-strip.css:3923 (box-shadow), 3926 (background-image) — * the eligible-cell marker. The "unknown" error is a tooling artefact: * var(--status-available) var(--ft-accent-alpha, 70%) uses a var() as * the PERCENTAGE itself, which the generator's stop-parser can't read * (it expects a literal %). --status-available is unambiguous #22c55e * (view-mode-strip.css:19, no dark override). --ft-accent-alpha / * --ft-wash-alpha vary by [data-find-times-grade] on the SAME cell * element (lines 3962-3979): excellent 92%/16%, good 74%/11%, * fair 52%/7%, limited 34%/4%, default (no grade attr) 70%/9%. * --------------------------------------------------------------------- */ body[data-find-times-active="true"] .timeline-cell[data-find-times-eligible="true"]:not([data-categorical-status]), body[data-find-times-active="true"] .compact-hour-cell[data-find-times-eligible="true"]:not([data-categorical-status]) { box-shadow: inset 0 calc(-1 * var(--ft-accent-height, 3px)) 0 0 rgba(34, 197, 94, 0.7); background-image: linear-gradient(0deg, rgba(34, 197, 94, 0.09), rgba(34, 197, 94, 0.09)), var(--cell-bg-image, none); } body[data-find-times-active="true"] .timeline-cell[data-find-times-eligible="true"][data-find-times-grade="excellent"]:not([data-categorical-status]), body[data-find-times-active="true"] .compact-hour-cell[data-find-times-eligible="true"][data-find-times-grade="excellent"]:not([data-categorical-status]) { box-shadow: inset 0 calc(-1 * var(--ft-accent-height, 3px)) 0 0 rgba(34, 197, 94, 0.92); background-image: linear-gradient(0deg, rgba(34, 197, 94, 0.16), rgba(34, 197, 94, 0.16)), var(--cell-bg-image, none); } body[data-find-times-active="true"] .timeline-cell[data-find-times-eligible="true"][data-find-times-grade="good"]:not([data-categorical-status]), body[data-find-times-active="true"] .compact-hour-cell[data-find-times-eligible="true"][data-find-times-grade="good"]:not([data-categorical-status]) { box-shadow: inset 0 calc(-1 * var(--ft-accent-height, 3px)) 0 0 rgba(34, 197, 94, 0.74); background-image: linear-gradient(0deg, rgba(34, 197, 94, 0.11), rgba(34, 197, 94, 0.11)), var(--cell-bg-image, none); } body[data-find-times-active="true"] .timeline-cell[data-find-times-eligible="true"][data-find-times-grade="fair"]:not([data-categorical-status]), body[data-find-times-active="true"] .compact-hour-cell[data-find-times-eligible="true"][data-find-times-grade="fair"]:not([data-categorical-status]) { box-shadow: inset 0 calc(-1 * var(--ft-accent-height, 3px)) 0 0 rgba(34, 197, 94, 0.52); background-image: linear-gradient(0deg, rgba(34, 197, 94, 0.07), rgba(34, 197, 94, 0.07)), var(--cell-bg-image, none); } body[data-find-times-active="true"] .timeline-cell[data-find-times-eligible="true"][data-find-times-grade="limited"]:not([data-categorical-status]), body[data-find-times-active="true"] .compact-hour-cell[data-find-times-eligible="true"][data-find-times-grade="limited"]:not([data-categorical-status]) { box-shadow: inset 0 calc(-1 * var(--ft-accent-height, 3px)) 0 0 rgba(34, 197, 94, 0.34); background-image: linear-gradient(0deg, rgba(34, 197, 94, 0.04), rgba(34, 197, 94, 0.04)), var(--cell-bg-image, none); } /* --------------------------------------------------------------------- * js/ui/session-guest-cell-grid.js:1344 — static