(() => { try { const THEME_DATA = {"themeConfigs":{"dark":{"classes":["dark"],"colorScheme":"dark"},"glass":{"classes":["dark","glass"],"colorScheme":"dark"},"light":{"classes":["light"],"colorScheme":"light"}},"accentPresets":{"default":{"--theme-accent":"linear-gradient(135deg, var(--ds-primary-brand) 0%, var(--ds-primary-soft) 55%, var(--ds-accent-amber) 100%)","--theme-accent-primary":"var(--ds-primary-brand)","--theme-accent-secondary":"#f2a14b","--theme-accent-start":"rgba(115, 90, 216, 0.85)","--theme-accent-end":"rgba(242, 161, 75, 0.9)","--theme-accent-ring":"rgba(115, 90, 216, 0.4)","--theme-accent-muted":"rgba(115, 90, 216, 0.2)","--btn-premium-gradient":"linear-gradient(135deg, rgba(115, 90, 216, 0.85), rgba(242, 161, 75, 0.9))"},"purple":{"--theme-accent":"linear-gradient(135deg, var(--ds-primary-brand) 0%, var(--ds-primary-soft) 100%)","--theme-accent-primary":"var(--ds-primary-brand)","--theme-accent-secondary":"#b5aff8","--theme-accent-start":"rgba(115, 90, 216, 0.85)","--theme-accent-end":"rgba(165, 180, 252, 0.75)","--theme-accent-ring":"rgba(115, 90, 216, 0.4)","--theme-accent-muted":"rgba(115, 90, 216, 0.2)","--btn-premium-gradient":"linear-gradient(135deg, rgba(115, 90, 216, 0.85), rgba(165, 180, 252, 0.75))"},"emerald":{"--theme-accent":"linear-gradient(135deg, #1fbf72 0%, #4ad297 100%)","--theme-accent-primary":"#1fbf72","--theme-accent-secondary":"#4ad297","--theme-accent-start":"rgba(31, 191, 114, 0.85)","--theme-accent-end":"rgba(74, 210, 151, 0.8)","--theme-accent-ring":"rgba(31, 191, 114, 0.45)","--theme-accent-muted":"rgba(31, 191, 114, 0.18)","--btn-premium-gradient":"linear-gradient(135deg, rgba(31, 191, 114, 0.85), rgba(74, 210, 151, 0.8))"},"amber":{"--theme-accent":"linear-gradient(135deg, #f6b15f 0%, var(--ds-accent-amber) 100%)","--theme-accent-primary":"#f6b15f","--theme-accent-secondary":"var(--ds-accent-amber)","--theme-accent-start":"rgba(246, 177, 95, 0.85)","--theme-accent-end":"rgba(242, 161, 75, 0.9)","--theme-accent-ring":"rgba(242, 161, 75, 0.45)","--theme-accent-muted":"rgba(242, 161, 75, 0.2)","--btn-premium-gradient":"linear-gradient(135deg, rgba(246, 177, 95, 0.85), rgba(242, 161, 75, 0.9))"},"blue":{"--theme-accent":"linear-gradient(135deg, #4c7dff 0%, var(--ds-primary-brand) 100%)","--theme-accent-primary":"#4c7dff","--theme-accent-secondary":"var(--ds-primary-brand)","--theme-accent-start":"rgba(76, 125, 255, 0.8)","--theme-accent-end":"rgba(115, 90, 216, 0.85)","--theme-accent-ring":"rgba(76, 125, 255, 0.45)","--theme-accent-muted":"rgba(76, 125, 255, 0.18)","--btn-premium-gradient":"linear-gradient(135deg, rgba(76, 125, 255, 0.8), rgba(115, 90, 216, 0.85))"},"rose":{"--theme-accent":"linear-gradient(135deg, #e64b4b 0%, #e64b4b 100%)","--theme-accent-primary":"#e64b4b","--theme-accent-secondary":"#e64b4b","--theme-accent-start":"rgba(230, 75, 75, 0.82)","--theme-accent-end":"rgba(230, 75, 75, 0.78)","--theme-accent-ring":"rgba(230, 75, 75, 0.4)","--theme-accent-muted":"rgba(230, 75, 75, 0.18)","--btn-premium-gradient":"linear-gradient(135deg, rgba(230, 75, 75, 0.82), rgba(230, 75, 75, 0.78))"}},"fontSizes":{"small":"0.9375rem","medium":"1rem","large":"1.125rem"},"themeClasses":["dark","glass","light"],"fontSizeClasses":["font-small","font-medium","font-large"],"accentClasses":["accent-default","accent-purple","accent-emerald","accent-amber","accent-blue","accent-rose"],"densityModes":["compact","comfortable"],"canvasTintPresets":{"none":{"label":"Neutral","rgb":"0 0 0"},"dawn":{"label":"Dawn","rgb":"224 171 148"},"sky":{"label":"Sky","rgb":"142 182 228"},"sage":{"label":"Sage","rgb":"142 178 154"},"lavender":{"label":"Lavender","rgb":"170 156 216"},"sand":{"label":"Sand","rgb":"212 186 146"},"rose":{"label":"Rose","rgb":"210 146 168"},"slate":{"label":"Slate","rgb":"126 146 178"}},"canvasTintLimits":{"lightMax":18,"darkMax":14,"glassCapRatio":0.6,"glassLightCap":11,"glassDarkCap":8,"defaultLightStrength":8,"defaultDarkStrength":4},"canvasTintHueLimits":{"min":1,"max":256,"default":210},"canvasTintEnabled":true}; const STORAGE_VERSION_KEY = 'dw.storage.version'; const CURRENT_STORAGE_VERSION_VALUE = '2025-10-29'; const DASHBOARD_KEY_PREFIXES_STATIC = ["dw.dashboard","dormway-dashboard","react-query-dashboard","dashboard:","dashboard/","dashboard.v","dashboard-"]; const DASHBOARD_KEY_EXACT_STATIC = ["dashboard","dashboardCache","dashboardData","dashboard-composite","dashboard:v1","dormway:dashboard"]; const PLACEHOLDER_MARKERS_STATIC = ["dormway: log in","\"dormway: log in\"","\"log in\"","log in\"","log in","\"log in quickstart\"","\"placeholder\":\"log in\"","\"title\":\"log in\"","\"title\": \"log in\"","'log in'","title: log in","Log In"]; const toLower = (value) => (typeof value === 'string' ? value.toLowerCase() : ''); const matchesDashboardKey = (key) => { const lowerKey = toLower(key); if (!lowerKey) return false; if (DASHBOARD_KEY_PREFIXES_STATIC.some(prefix => lowerKey.startsWith(toLower(prefix)))) return true; if (DASHBOARD_KEY_EXACT_STATIC.some(candidate => lowerKey === toLower(candidate))) return true; return lowerKey.includes('dashboard'); }; const sanitizeDormwayStorage = () => { // CRITICAL: In incognito mode, localStorage might not be available or throw errors // We need to handle this gracefully to prevent "Log In" placeholder contamination let storage; try { storage = window.localStorage; if (!storage) { console.warn('[DormWay] localStorage not available (incognito mode?)'); return; } // Test if localStorage is actually writable (incognito mode sometimes allows read but not write) storage.setItem('dw.test', '1'); storage.removeItem('dw.test'); } catch (error) { console.warn('[DormWay] localStorage not accessible (incognito mode?)', error); // In incognito mode, we can't clean localStorage, but we can prevent further issues // by clearing any in-memory React Query cache on mount (handled by ThemeContext) return; } try { const storedVersion = storage.getItem(STORAGE_VERSION_KEY); const shouldHardReset = storedVersion !== CURRENT_STORAGE_VERSION_VALUE; const keysToDelete = []; for (let i = 0; i < storage.length; i++) { const key = storage.key(i); if (!key) continue; const lowerKey = toLower(key); if (shouldHardReset && ( DASHBOARD_KEY_PREFIXES_STATIC.some(prefix => lowerKey.startsWith(toLower(prefix))) || DASHBOARD_KEY_EXACT_STATIC.some(candidate => lowerKey === toLower(candidate)) )) { keysToDelete.push(key); continue; } if (matchesDashboardKey(lowerKey)) { let raw = null; try { raw = storage.getItem(key); } catch {} if (raw && PLACEHOLDER_MARKERS_STATIC.some(marker => raw.toLowerCase().includes(marker))) { keysToDelete.push(key); continue; } } if (lowerKey === 'dormway-preferences') { let raw = null; try { raw = storage.getItem(key); } catch {} let valid = false; if (raw) { try { const parsed = JSON.parse(raw); const appBehavior = parsed && typeof parsed === 'object' ? parsed.appBehavior : null; valid = appBehavior && typeof appBehavior === 'object' && (typeof appBehavior.theme === 'string' || typeof appBehavior.fontSize === 'string' || typeof appBehavior.densityMode === 'string' || typeof appBehavior.sidebarCollapsed === 'boolean' || typeof appBehavior.canvasTintPreset === 'string' || typeof appBehavior.canvasTintStrengthLight === 'number' || typeof appBehavior.canvasTintStrengthDark === 'number' || typeof appBehavior.canvasTintHue === 'number'); } catch { valid = false; } } if (!valid) { keysToDelete.push(key); continue; } } if (lowerKey === 'userpreferences') { let raw = null; try { raw = storage.getItem(key); } catch {} let valid = false; if (raw) { try { const parsed = JSON.parse(raw); valid = parsed !== null && typeof parsed === 'object'; } catch { valid = false; } } if (!valid) { keysToDelete.push(key); continue; } } } keysToDelete.forEach(keyToDelete => { try { storage.removeItem(keyToDelete); } catch {} }); try { storage.setItem(STORAGE_VERSION_KEY, CURRENT_STORAGE_VERSION_VALUE); } catch { console.warn('[DormWay] Could not update storage version (incognito mode?)'); } } catch (error) { console.warn('[DormWay] Storage sanitization failed', error); } }; sanitizeDormwayStorage(); const VALID_THEMES = new Set(['system', 'light', 'dark', 'glass']); const VALID_BASE_THEMES = new Set(['light', 'dark']); const VALID_FONT_SIZES = new Set(['small', 'medium', 'large']); const VALID_DENSITY_MODES = new Set( Array.isArray(THEME_DATA.densityModes) ? THEME_DATA.densityModes : ['compact', 'comfortable'] ); const VALID_CANVAS_TINT_PRESETS = new Set(Object.keys(THEME_DATA.canvasTintPresets || {})); const CANVAS_BASE_NEUTRAL = { light: [250, 249, 246], dark: [0, 0, 0], }; const CANVAS_BASE_BLEND_LIMITS = { light: 0.84, dark: 0.62, }; const clampCanvasTintStrength = (value, mode) => { const limits = THEME_DATA.canvasTintLimits || {}; const max = mode === 'light' ? limits.lightMax : limits.darkMax; const numericMax = Number.isFinite(max) ? max : (mode === 'light' ? 18 : 14); const parsed = Number(value); if (!Number.isFinite(parsed)) return mode === 'light' ? 8 : 4; const rounded = Math.round(parsed); return Math.min(Math.max(rounded, 0), numericMax); }; const getEffectiveCanvasTintStrength = (mode, glassEnabled, requestedStrength) => { const clamped = clampCanvasTintStrength(requestedStrength, mode); if (!glassEnabled) return clamped; const limits = THEME_DATA.canvasTintLimits || {}; const cap = mode === 'light' ? limits.glassLightCap : limits.glassDarkCap; const numericCap = Number.isFinite(cap) ? cap : (mode === 'light' ? 11 : 8); return Math.min(clamped, numericCap); }; const clampCanvasTintHue = (value) => { const limits = THEME_DATA.canvasTintHueLimits || {}; const min = Number.isFinite(limits.min) ? limits.min : 1; const max = Number.isFinite(limits.max) ? limits.max : 256; const fallback = Number.isFinite(limits.default) ? limits.default : 210; const parsed = Number(value); if (!Number.isFinite(parsed)) return fallback; const rounded = Math.round(parsed); return Math.min(Math.max(rounded, min), max); }; const hueStepToDegrees = (hueStep) => { const limits = THEME_DATA.canvasTintHueLimits || {}; const min = Number.isFinite(limits.min) ? limits.min : 1; const max = Number.isFinite(limits.max) ? limits.max : 256; const clamped = clampCanvasTintHue(hueStep); const normalized = (clamped - min) / Math.max(max - min, 1); return normalized * 360; }; const hslToRgb = (hueDeg, saturation, lightness) => { const h = ((hueDeg % 360) + 360) % 360; const s = Math.min(Math.max(saturation, 0), 1); const l = Math.min(Math.max(lightness, 0), 1); const c = (1 - Math.abs(2 * l - 1)) * s; const x = c * (1 - Math.abs((h / 60) % 2 - 1)); const m = l - c / 2; let rPrime = 0; let gPrime = 0; let bPrime = 0; if (h < 60) { rPrime = c; gPrime = x; } else if (h < 120) { rPrime = x; gPrime = c; } else if (h < 180) { gPrime = c; bPrime = x; } else if (h < 240) { gPrime = x; bPrime = c; } else if (h < 300) { rPrime = x; bPrime = c; } else { rPrime = c; bPrime = x; } return [ Math.round((rPrime + m) * 255), Math.round((gPrime + m) * 255), Math.round((bPrime + m) * 255), ]; }; const getCanvasTintRgbFromHue = (hueStep, mode) => { const hueDeg = hueStepToDegrees(hueStep); const saturation = mode === 'light' ? 0.32 : 0.34; const lightness = mode === 'light' ? 0.75 : 0.3; const rgb = hslToRgb(hueDeg, saturation, lightness); return rgb[0] + ' ' + rgb[1] + ' ' + rgb[2]; }; const parseRgbTriplet = (value, fallback) => { if (typeof value !== 'string') return fallback; const parts = value.trim().split(/\s+/).map(Number); if (parts.length !== 3 || parts.some(part => !Number.isFinite(part))) { return fallback; } return parts.map(part => Math.min(Math.max(Math.round(part), 0), 255)); }; const getCanvasBaseBlendRatio = (mode, effectiveStrength) => { const limits = THEME_DATA.canvasTintLimits || {}; const max = mode === 'light' ? limits.lightMax : limits.darkMax; const numericMax = Number.isFinite(max) ? max : (mode === 'light' ? 18 : 14); if (!Number.isFinite(effectiveStrength) || numericMax <= 0) return 0; const normalized = Math.min(Math.max(effectiveStrength / numericMax, 0), 1); const blendLimit = mode === 'light' ? CANVAS_BASE_BLEND_LIMITS.light : CANVAS_BASE_BLEND_LIMITS.dark; return normalized * blendLimit; }; const mixRgbTriplet = (fromTriplet, toTriplet, ratio) => { return fromTriplet.map((channel, index) => ( Math.round(channel + (toTriplet[index] - channel) * ratio) )); }; const getCanvasBaseRgb = (mode, tintRgb, effectiveStrength, hasTint) => { const neutral = mode === 'light' ? CANVAS_BASE_NEUTRAL.light : CANVAS_BASE_NEUTRAL.dark; if (!hasTint || effectiveStrength <= 0) return neutral; const tint = parseRgbTriplet(tintRgb, neutral); const ratio = getCanvasBaseBlendRatio(mode, effectiveStrength); return mixRgbTriplet(neutral, tint, ratio); }; const formatRgbTriplet = (triplet) => triplet[0] + ' ' + triplet[1] + ' ' + triplet[2]; const ensureBodyClasses = (themeClasses, fontClass) => { const apply = (body) => { body.classList.remove(...THEME_DATA.themeClasses, ...THEME_DATA.fontSizeClasses); themeClasses.forEach(cls => body.classList.add(cls)); body.classList.add(fontClass); }; const body = document.body; if (body) { apply(body); return; } const once = () => { const currentBody = document.body; if (!currentBody) return; apply(currentBody); }; if (document.readyState === 'interactive' || document.readyState === 'complete') { once(); } else { document.addEventListener('DOMContentLoaded', once, { once: true }); document.addEventListener('readystatechange', () => { if (document.readyState === 'interactive' || document.readyState === 'complete') { once(); } }, { once: true }); } }; const applyTheme = ( themeKey, fontSizeKey, densityMode, accentKey, glassEnabled, canvasTintPreset, canvasTintStrengthLight, canvasTintStrengthDark, canvasTintHue ) => { const nightAppearance = (function g(a,b=new Date){let c={};try{let b=JSON.parse(a??"null");b&&"object"==typeof b&&!Array.isArray(b)&&(c=b)}catch{}let d=a=>"string"==typeof a&&/^([01]\d|2[0-3]):[0-5]\d$/.test(a),e={mode:"off"===c.mode||"scheduled"===c.mode?c.mode:"on",start:d(c.start)?c.start:"22:00",end:d(c.end)?c.end:"07:00"},f=a=>60*Number(a.slice(0,2))+Number(a.slice(3)),h=f(e.start),i=f(e.end),j=60*b.getHours()+b.getMinutes();return{settings:e,active:"on"===e.mode||"scheduled"===e.mode&&(h=h&&ji&&(j>=h||j { try { return localStorage.getItem("dormway-night-appearance"); } catch { return null; } })()); if (nightAppearance.active) { themeKey = 'dark'; accentKey = 'amber'; glassEnabled = false; canvasTintPreset = 'none'; } const configs = THEME_DATA.themeConfigs; const resolvedTheme = VALID_BASE_THEMES.has(themeKey) ? themeKey : 'dark'; const config = configs[resolvedTheme]; const fontSize = THEME_DATA.fontSizes[fontSizeKey] ? fontSizeKey : 'medium'; const resolvedDensityMode = VALID_DENSITY_MODES.has(densityMode) ? densityMode : 'compact'; const canUseCanvasTint = THEME_DATA.canvasTintEnabled === true; const resolvedCanvasPreset = canUseCanvasTint && VALID_CANVAS_TINT_PRESETS.has(canvasTintPreset) ? canvasTintPreset : 'none'; const resolvedCanvasLight = canUseCanvasTint ? clampCanvasTintStrength(canvasTintStrengthLight, 'light') : 8; const resolvedCanvasDark = canUseCanvasTint ? clampCanvasTintStrength(canvasTintStrengthDark, 'dark') : 4; const resolvedCanvasHue = canUseCanvasTint ? clampCanvasTintHue(canvasTintHue) : 210; const requestedStrength = resolvedTheme === 'light' ? resolvedCanvasLight : resolvedCanvasDark; const effectiveStrength = requestedStrength <= 0 ? 0 : getEffectiveCanvasTintStrength(resolvedTheme, glassEnabled, requestedStrength); const canvasTintRgb = getCanvasTintRgbFromHue(resolvedCanvasHue, resolvedTheme); const hasTint = resolvedCanvasPreset !== 'none' && effectiveStrength > 0; const appliedCanvasStrength = hasTint ? effectiveStrength : 0; const canvasBaseRgb = getCanvasBaseRgb(resolvedTheme, canvasTintRgb, appliedCanvasStrength, hasTint); const canvasBaseBlendRatio = getCanvasBaseBlendRatio(resolvedTheme, appliedCanvasStrength); const canvasBaseRgbString = formatRgbTriplet(canvasBaseRgb); const fontClass = 'font-' + fontSize; const root = document.documentElement; const classList = config.classes.slice(); root.classList.remove(...THEME_DATA.themeClasses, ...THEME_DATA.fontSizeClasses); classList.forEach(cls => root.classList.add(cls)); root.classList.add(fontClass); ensureBodyClasses(classList, fontClass); // Only runtime-derived axes are written inline. Constant tokens, themed // colors, and accent palettes come from the generated stylesheet, keyed // by the theme class and the data-theme-accent attribute set below. const softToplineOpacity = resolvedTheme === 'light' ? '0.58' : (glassEnabled ? '0.46' : '0.5'); const styleUpdates = Object.assign( {}, { '--theme-font-size': THEME_DATA.fontSizes[fontSize] || THEME_DATA.fontSizes.medium, '--ds-soft-topline-opacity': softToplineOpacity, '--dw-canvas-tint-rgb': canvasTintRgb, '--dw-canvas-tint-strength-light': String(resolvedCanvasLight), '--dw-canvas-tint-strength-dark': String(resolvedCanvasDark), '--dw-canvas-tint-strength-effective': String(appliedCanvasStrength), '--dw-canvas-tint-strength-effective-ratio': String(appliedCanvasStrength / 100), '--dw-canvas-hue': String(resolvedCanvasHue), '--dw-canvas-base-rgb': canvasBaseRgbString, '--dw-canvas-base-blend-ratio': String(canvasBaseBlendRatio), } ); Object.keys(styleUpdates).forEach(key => { root.style.setProperty(key, styleUpdates[key]); }); root.style.backgroundColor = nightAppearance.active ? 'var(--ds-surface-0)' : hasTint ? 'rgb(' + canvasBaseRgbString + ')' : (resolvedTheme === 'light' ? 'rgb(250 249 246)' : 'rgb(0 0 0)'); root.style.colorScheme = config.colorScheme; root.dataset.theme = resolvedTheme; root.dataset.themeNight = String(nightAppearance.active); root.dataset.themeGlass = glassEnabled ? 'true' : 'false'; root.dataset.fontSize = fontSize; root.dataset.density = resolvedDensityMode; root.dataset.themeAccent = accentKey; root.dataset.themeCanvasPreset = resolvedCanvasPreset; root.dataset.themeCanvasLight = String(resolvedCanvasLight); root.dataset.themeCanvasDark = String(resolvedCanvasDark); root.dataset.themeCanvasHue = String(resolvedCanvasHue); root.classList.remove(...THEME_DATA.accentClasses); root.classList.add('accent-' + accentKey); const metaThemeColor = document.querySelector('meta[name="theme-color"]'); if (metaThemeColor) { // --bg-primary now resolves from the generated stylesheet via the // theme class added above; read the computed value rather than a JS table. const bgPrimary = getComputedStyle(root).getPropertyValue('--bg-primary').trim(); if (bgPrimary) { metaThemeColor.setAttribute('content', bgPrimary); } } // Reveal the document: a theme is now applied, so drop the boot // attribute the anti-FOUC gate keys on. Synchronous and before first // paint in the happy path, so the gate never actually hides anything. root.removeAttribute('data-theme-booting'); }; const readBehavior = () => { const behavior = { theme: 'system', glassEnabled: false, fontSize: 'medium', densityMode: 'compact', accentColor: 'default', canvasTintPreset: 'none', canvasTintStrengthLight: 0, canvasTintStrengthDark: 0, canvasTintHue: 210, }; try { const raw = window.localStorage.getItem('dormway-preferences'); if (raw) { const prefs = JSON.parse(raw); const appBehavior = prefs && prefs.appBehavior ? prefs.appBehavior : {}; const appearance = prefs && prefs.appearance ? prefs.appearance : {}; if (VALID_THEMES.has(appBehavior.theme)) { if (appBehavior.theme === 'glass') { behavior.theme = 'dark'; behavior.glassEnabled = true; } else { behavior.theme = appBehavior.theme; } } if (typeof appBehavior.glassEnabled === 'boolean') { behavior.glassEnabled = appBehavior.glassEnabled; } if (VALID_FONT_SIZES.has(appBehavior.fontSize)) { behavior.fontSize = appBehavior.fontSize; } const densityMode = appBehavior.densityMode ?? appearance.densityMode; if (VALID_DENSITY_MODES.has(densityMode)) { behavior.densityMode = densityMode; } if (typeof appBehavior.accentColor === 'string' && appBehavior.accentColor.length > 0) { behavior.accentColor = appBehavior.accentColor; } const canvasTintPreset = appBehavior.canvasTintPreset ?? appearance.canvasTintPreset; if (typeof canvasTintPreset === 'string' && VALID_CANVAS_TINT_PRESETS.has(canvasTintPreset)) { behavior.canvasTintPreset = canvasTintPreset; } behavior.canvasTintStrengthLight = clampCanvasTintStrength( appBehavior.canvasTintStrengthLight ?? appearance.canvasTintStrengthLight, 'light' ); behavior.canvasTintStrengthDark = clampCanvasTintStrength( appBehavior.canvasTintStrengthDark ?? appearance.canvasTintStrengthDark, 'dark' ); behavior.canvasTintHue = clampCanvasTintHue( appBehavior.canvasTintHue ?? appearance.canvasTintHue ); } } catch (error) { console.warn('Unable to parse dormway-preferences during hydration', error); } try { const legacyTheme = window.localStorage.getItem('dormway-theme-mode'); if (VALID_THEMES.has(legacyTheme)) { if (legacyTheme === 'glass') { behavior.theme = 'dark'; behavior.glassEnabled = true; } else { behavior.theme = legacyTheme; } } } catch (error) { console.warn('Unable to read legacy theme mode', error); } try { const legacyGlass = window.localStorage.getItem('dormway-theme-glass'); if (legacyGlass === '1' || legacyGlass === 'true') { behavior.glassEnabled = true; } if (legacyGlass === '0' || legacyGlass === 'false') { behavior.glassEnabled = false; } } catch (error) { console.warn('Unable to read legacy glass mode', error); } try { const legacyFont = window.localStorage.getItem('dormway-font-size'); if (VALID_FONT_SIZES.has(legacyFont)) { behavior.fontSize = legacyFont; } } catch (error) { console.warn('Unable to read legacy font size', error); } try { const legacyAccent = window.localStorage.getItem('dormway-accent'); if (typeof legacyAccent === 'string' && legacyAccent.length > 0) { behavior.accentColor = legacyAccent; } } catch (error) { console.warn('Unable to read legacy accent color', error); } return behavior; }; const behavior = readBehavior(); // Guard matchMedia: some restrictive webviews expose no matchMedia (or throw // on call). An unguarded read here would abort the whole boot script into the // emergency catch below, so default to dark (matching the signed-out fallback). const prefersDark = (() => { try { return window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)').matches : true; } catch (error) { return true; } })(); const hasClerkSession = (() => { try { const cookie = document.cookie || ''; return /(__session|__clerk_db_jwt)=/.test(cookie); } catch { return false; } })(); const pathname = (() => { try { return (window.location && window.location.pathname) || '/'; } catch { return '/'; } })(); // CRITICAL: Early demo mode detection (before React hydration) // Check for demo mode indicators: demoStatic param, cookie, embed param, iframe context const isDemoMode = (() => { if (window.location.pathname === '/campus/umich') return false; try { // Check URL params const urlParams = new URLSearchParams(window.location.search); const hasDemoStaticParam = urlParams.get('demoStatic') === 'true'; const hasEmbedParam = urlParams.get('embed') === 'true'; // Check cookie const cookies = document.cookie.split(';'); let hasDemoStaticCookie = false; for (const cookie of cookies) { const [name, value] = cookie.trim().split('='); if (name === 'dw.demoStatic' && value === '1') { hasDemoStaticCookie = true; break; } } // Check iframe context let isInIframe = false; try { isInIframe = window.self !== window.top; } catch { // Cross-origin iframe - assume we're in iframe isInIframe = true; } // Demo mode requires: demoStatic param/cookie AND (embed param OR iframe context) return (hasDemoStaticParam || hasDemoStaticCookie) && (hasEmbedParam || isInIframe); } catch { return false; } })(); // Keep system preference for the public landing page. // For signed-out non-auth routes, preserve dark fallback unless demo mode is active. const isPublicLanding = pathname === '/'; const isAuthRoute = pathname.startsWith('/sign-in') || pathname.startsWith('/sign-up') || pathname.startsWith('/onboarding'); const isPublicCampusGuide = pathname === '/campus/umich'; const forceDark = isPublicLanding || (!hasClerkSession && !isDemoMode && !isAuthRoute && !isPublicCampusGuide); const disableCanvasTint = !hasClerkSession && !isDemoMode && !pathname.startsWith('/dashboard'); const resolvedTheme = forceDark ? 'dark' : (behavior.theme === 'system' ? (prefersDark ? 'dark' : 'light') : (behavior.theme === 'light' ? 'light' : 'dark')); const fontSizeChoice = THEME_DATA.fontSizes[behavior.fontSize] ? behavior.fontSize : 'medium'; const densityChoice = VALID_DENSITY_MODES.has(behavior.densityMode) ? behavior.densityMode : 'compact'; const accentChoice = THEME_DATA.accentPresets[behavior.accentColor] ? behavior.accentColor : 'default'; const canvasTintPresetChoice = VALID_CANVAS_TINT_PRESETS.has(behavior.canvasTintPreset) ? behavior.canvasTintPreset : 'none'; const effectiveCanvasTintPresetChoice = disableCanvasTint ? 'none' : canvasTintPresetChoice; const effectiveCanvasTintLight = disableCanvasTint ? 8 : behavior.canvasTintStrengthLight; const effectiveCanvasTintDark = disableCanvasTint ? 4 : behavior.canvasTintStrengthDark; const effectiveCanvasTintHue = disableCanvasTint ? 210 : behavior.canvasTintHue; applyTheme( resolvedTheme, fontSizeChoice, densityChoice, accentChoice, behavior.glassEnabled, effectiveCanvasTintPresetChoice, effectiveCanvasTintLight, effectiveCanvasTintDark, effectiveCanvasTintHue ); // Fallback: If theme wasn't applied (no theme class on html), force apply resolved theme after short delay // This prevents permanent invisibility if theme application fails setTimeout(() => { const root = document.documentElement; const hasThemeClass = root.classList.contains('dark') || root.classList.contains('light') || root.classList.contains('glass'); if (!hasThemeClass) { const fallbackThemeKey = resolvedTheme === 'light' ? 'light' : 'dark'; console.warn('[Theme] Theme class not applied, forcing ' + fallbackThemeKey + ' theme as fallback'); const fallbackConfig = THEME_DATA.themeConfigs[fallbackThemeKey] || THEME_DATA.themeConfigs.dark; const fallbackFontSize = THEME_DATA.fontSizes[fontSizeChoice] || THEME_DATA.fontSizes.medium; const fallbackCanvasBaseRgb = fallbackThemeKey === 'light' ? '250 249 246' : '0 0 0'; root.classList.remove(...THEME_DATA.themeClasses, ...THEME_DATA.fontSizeClasses); fallbackConfig.classes.forEach(cls => root.classList.add(cls)); root.classList.add('font-' + fontSizeChoice); // Runtime axes only; themed colors + accent come from the generated // stylesheet via the theme class added above and data-theme-accent below. const styleUpdates = Object.assign( {}, { '--theme-font-size': fallbackFontSize, '--ds-soft-topline-opacity': fallbackThemeKey === 'light' ? '0.58' : '0.5', '--dw-canvas-tint-rgb': fallbackCanvasBaseRgb, '--dw-canvas-tint-strength-light': '0', '--dw-canvas-tint-strength-dark': '0', '--dw-canvas-tint-strength-effective': '0', '--dw-canvas-tint-strength-effective-ratio': '0', '--dw-canvas-hue': '210', '--dw-canvas-base-rgb': fallbackCanvasBaseRgb, '--dw-canvas-base-blend-ratio': '0', } ); Object.keys(styleUpdates).forEach(key => { root.style.setProperty(key, styleUpdates[key]); }); root.style.backgroundColor = 'rgb(' + fallbackCanvasBaseRgb + ')'; root.style.colorScheme = fallbackConfig.colorScheme; root.dataset.theme = fallbackThemeKey; root.dataset.themeGlass = 'false'; root.dataset.fontSize = fontSizeChoice; root.dataset.density = densityChoice; root.dataset.themeAccent = accentChoice; root.dataset.themeCanvasPreset = 'none'; root.dataset.themeCanvasLight = '0'; root.dataset.themeCanvasDark = '0'; root.dataset.themeCanvasHue = '210'; // Also apply to body if it exists if (document.body) { document.body.classList.remove(...THEME_DATA.themeClasses, ...THEME_DATA.fontSizeClasses); fallbackConfig.classes.forEach(cls => document.body.classList.add(cls)); document.body.classList.add('font-' + fontSizeChoice); } } // Whether or not the fallback theme was needed, reveal the document by // dropping the boot attribute (idempotent if applyTheme already did). root.removeAttribute('data-theme-booting'); }, 100); } catch (error) { console.warn('Theme hydration failed', error); // Emergency fallback: apply system theme if script completely fails. // Guard matchMedia so a webview without it still lands a theme class here // (which removes the visibility gate) instead of throwing again and leaving // the page hidden. try { const root = document.documentElement; let prefersDark = true; try { prefersDark = !window.matchMedia || window.matchMedia('(prefers-color-scheme: dark)').matches; } catch (mediaError) { prefersDark = true; } const fallbackTheme = prefersDark ? 'dark' : 'light'; root.classList.add(fallbackTheme); root.dataset.theme = fallbackTheme; root.dataset.density = 'compact'; root.dataset.themeCanvasPreset = 'none'; root.dataset.themeCanvasLight = '0'; root.dataset.themeCanvasDark = '0'; // Reveal even on the emergency path so a mid-boot throw can't leave the // page (or its replay) stuck behind the visibility gate. root.removeAttribute('data-theme-booting'); if (document.body) { document.body.classList.add(fallbackTheme); } } catch (fallbackError) { console.error('Theme fallback also failed', fallbackError); } } })();

Feedback

Feedback