/* SQE Success ยท Liquid Glass v66 Stronger refractive glass while preserving textbook readability. */ :root { --liquid-ink: #183d31; --liquid-ink-strong: #102c24; --liquid-glass: rgba(255,255,255,.38); --liquid-glass-strong: rgba(255,255,255,.53); --liquid-edge: rgba(255,255,255,.76); --liquid-shadow: 0 18px 46px rgba(36,66,53,.11), inset 0 1px 0 rgba(255,255,255,.94), inset 0 -1px 0 rgba(126,157,143,.10); } body { background: radial-gradient(circle at 12% 7%, rgba(121,215,170,.34), transparent 27rem), radial-gradient(circle at 88% 10%, rgba(150,194,247,.33), transparent 31rem), radial-gradient(circle at 62% 92%, rgba(207,172,244,.24), transparent 36rem), linear-gradient(145deg,#edf4ef 0%,#f4f7f6 42%,#eef3f8 100%) !important; } /* Main glass surfaces: more refraction, less flat white. */ .nav, header.nav, .topbar, .app-topbar, .sidebar, .panel:not(.reader), .online-account-status, .chapter-toc, .subject-card, .dashboard-card, .study-card, .progress-card, .stat-card, .multi-mindmap-deck, .sqe-v54-mindmaps { background: linear-gradient(135deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,.26) 44%,rgba(222,240,232,.22) 100%) !important; border: 1px solid var(--liquid-edge) !important; box-shadow: var(--liquid-shadow) !important; -webkit-backdrop-filter: blur(32px) saturate(190%) contrast(103%); backdrop-filter: blur(32px) saturate(190%) contrast(103%); } .nav, header.nav, .topbar, .app-topbar { box-shadow: 0 14px 40px rgba(34,60,48,.10), inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(96,130,113,.12) !important; } /* Reflective top edge / soft colour refraction. */ .nav, header.nav, .sidebar, .multi-mindmap-deck, .sqe-v54-mindmaps, .panel:not(.reader) { position: relative; isolation: isolate; } .nav::before, header.nav::before, .sidebar::before, .multi-mindmap-deck::before, .sqe-v54-mindmaps::before, .panel:not(.reader)::before { content: ''; position: absolute; inset: 1px 1px auto 1px; height: 42%; border-radius: inherit; pointer-events: none; z-index: -1; background: linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0)); opacity: .82; } /* Liquid buttons */ .button, .nav-button, .chapter-tab, [data-tab], .multi-mindmap-tab, .sqe-v54-map-tab, .sqe-v53-jumpbar button, .online-top-link, #onlineLogoutBtn { color: #172b23 !important; background: linear-gradient(145deg,rgba(255,255,255,.66),rgba(255,255,255,.31)) !important; border: 1px solid rgba(255,255,255,.88) !important; box-shadow: 0 7px 20px rgba(35,63,50,.08), inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(89,120,104,.08) !important; -webkit-backdrop-filter: blur(22px) saturate(185%); backdrop-filter: blur(22px) saturate(185%); } .button:hover, .nav-button:hover, .chapter-tab:hover, [data-tab]:hover, .multi-mindmap-tab:hover, .sqe-v54-map-tab:hover, .sqe-v53-jumpbar button:hover, .online-top-link:hover, #onlineLogoutBtn:hover { background: linear-gradient(145deg,rgba(255,255,255,.82),rgba(238,248,243,.46)) !important; box-shadow: 0 11px 28px rgba(35,63,50,.12), inset 0 1px 0 rgba(255,255,255,1), inset 0 -1px 0 rgba(89,120,104,.10) !important; } /* Active segmented-control state: still glass, not a flat green pill. */ .multi-mindmap-tab.active, .sqe-v54-map-tab.active, .chapter-tab.active, [data-tab].active, [aria-selected='true'] { color: #fff !important; background: linear-gradient(145deg,rgba(48,119,88,.91),rgba(29,80,58,.86)) !important; border-color: rgba(255,255,255,.46) !important; box-shadow: 0 10px 25px rgba(30,81,59,.20), inset 0 1px 0 rgba(255,255,255,.34), inset 0 -1px 0 rgba(7,45,30,.18) !important; } /* Explicit fix for top-right Continue studying / Continue reading. */ .liquid-continue-cta, #continueReading, #continueStudying, .continue-reading, .continue-studying, [data-action='continue-reading'], [data-action='continue-studying'] { color: var(--liquid-ink-strong) !important; -webkit-text-fill-color: var(--liquid-ink-strong) !important; text-shadow: none !important; font-weight: 800 !important; background: linear-gradient(145deg,rgba(255,255,255,.68),rgba(238,248,243,.34)) !important; border-color: rgba(255,255,255,.92) !important; box-shadow: 0 8px 22px rgba(32,61,48,.10), inset 0 1px 0 rgba(255,255,255,1), inset 0 -1px 0 rgba(77,111,94,.10) !important; } .liquid-continue-cta:hover, #continueReading:hover, #continueStudying:hover, .continue-reading:hover, .continue-studying:hover { color: #0d3427 !important; -webkit-text-fill-color: #0d3427 !important; background: linear-gradient(145deg,rgba(255,255,255,.88),rgba(224,242,233,.50)) !important; } /* Mind map: more translucent / liquid while keeping full text readable. */ .multi-mindmap-canvas, .sqe-v54-map-canvas { background: radial-gradient(circle at 13% 45%,rgba(96,194,146,.20),transparent 34%), radial-gradient(circle at 86% 15%,rgba(155,195,238,.16),transparent 31%), rgba(255,255,255,.20) !important; border: 1px solid rgba(255,255,255,.76) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.90), inset 0 -1px 0 rgba(92,124,108,.07) !important; -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); } .multi-mindmap-branch, .sqe-v54-branch { background: linear-gradient(145deg,rgba(255,255,255,.70),rgba(255,255,255,.36)) !important; border: 1px solid rgba(255,255,255,.90) !important; box-shadow: 0 10px 28px rgba(36,66,53,.08), inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(87,120,103,.08) !important; -webkit-backdrop-filter: blur(24px) saturate(175%); backdrop-filter: blur(24px) saturate(175%); } .multi-mindmap-branch span, .sqe-v54-branch-items span { background: rgba(244,249,247,.58) !important; border: 1px solid rgba(255,255,255,.72) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.78); } /* Annotation UI: strong liquid popover */ .inline-annotator, .mindmap-inline-annotator, .rich-note-toolbar { background: linear-gradient(145deg,rgba(255,255,255,.78),rgba(239,247,243,.55)) !important; border: 1px solid rgba(255,255,255,.94) !important; box-shadow: 0 24px 60px rgba(22,48,37,.24), inset 0 1px 0 rgba(255,255,255,1), inset 0 -1px 0 rgba(72,105,88,.10) !important; -webkit-backdrop-filter: blur(38px) saturate(205%); backdrop-filter: blur(38px) saturate(205%); } /* Reading surfaces intentionally stay substantially opaque. */ #textbookReader .ebook-page, #textbookReader .sqe-v63-study-block, #textbookReader .sqe-v62-visual, .sqe-v53-card, .property-v52-reading-card, .property-v52-visual-card { background: rgba(255,255,255,.955) !important; } @media (max-width: 700px) { .nav, header.nav, .topbar, .app-topbar, .sidebar, .panel:not(.reader) { -webkit-backdrop-filter: blur(25px) saturate(175%); backdrop-filter: blur(25px) saturate(175%); } .liquid-continue-cta, #continueReading, #continueStudying, .continue-reading, .continue-studying { color: #12372b !important; -webkit-text-fill-color: #12372b !important; } }