/* Terms of Service Interstitial */ /* Hide curriculum content before ToS acceptance. The tos-pending class is set by an inline script that checks localStorage synchronously, preventing a flash of content. */ html.tos-pending .md-content { visibility: hidden; } /* Full-viewport backdrop: opaque so nothing shows through. */ .tos-overlay { position: fixed; inset: 0; z-index: 9999; background: #111; display: flex; align-items: center; justify-content: center; padding: 2rem; overflow: hidden; } /* Card: ~75% of viewport width, capped for ultrawide monitors. flex-column drives the branded-header / scroll-area / button layout. */ .tos-overlay__content { width: 75vw; max-height: calc(100vh - 4rem); background: #fff; border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; } /* Branded header: dark strip with logo + site name + heading */ .tos-overlay__header { background: #1e293b; color: #fff; padding: 1.25rem 2rem; flex-shrink: 0; text-align: center; } .tos-overlay__logo { height: 28px; width: auto; margin-bottom: 0.5rem; } .tos-overlay__site-name { font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.75rem; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); margin: 0 0 0.75rem; } .tos-overlay__heading { font-family: 'DM Sans', system-ui, sans-serif; font-size: 1.1rem; font-weight: 700; color: #fff; margin: 0; } /* Scrollable legal text: contained between header and footer */ .tos-overlay__body { font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.82rem; line-height: 1.6; color: #334155; overflow-y: auto; flex: 1 1 auto; min-height: 0; padding: 1.25rem 2rem; } .tos-overlay__body p { margin: 0 0 0.65rem; } .tos-overlay__body p:last-child { margin-bottom: 0; } .tos-overlay__body h2 { font-size: 0.85rem; font-weight: 700; color: #1e293b; margin: 1rem 0 0.3rem; } .tos-overlay__body h2:first-child { margin-top: 0; } .tos-overlay__body ul { margin: 0.3rem 0 0.65rem; padding-left: 1.25rem; } .tos-overlay__body li { margin-bottom: 0.25rem; } .tos-overlay__body a { color: #2563eb; text-decoration: underline; } /* Footer: button pinned below scroll area */ .tos-overlay__footer { padding: 1rem 2rem; border-top: 1px solid #e2e8f0; flex-shrink: 0; text-align: center; } .tos-overlay__button { display: inline-block; padding: 0.45rem 1.5rem; font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.82rem; font-weight: 600; color: #fff; background: #1e293b; border: none; border-radius: 6px; cursor: pointer; transition: background 0.15s ease; } .tos-overlay__button:hover { background: #334155; } .tos-overlay__button:focus-visible { outline: 2px solid #3b82f6; outline-offset: 2px; }