/* Ad fields — a reserved, fixed-shape box on every page that carries advertising. Hidden until the head snippet marks (never inside the app), so the box never flashes in a WebView. Inside it: Google's unit first; our own generated Luntrack banner if Google gives nothing (not approved yet, unfilled, blocked, or unconfigured). The fields are the banners' shapes — 21:9 wide, 9:16 tall — so a house banner always fits whole, nothing cropped. */ .lt-slot-wrap { display: none; position: relative; z-index: 1; margin: 28px auto; padding: 0 16px; max-width: 760px; text-align: center; } html.lt-ads-on .lt-slot-wrap { display: block; } .lt-slot-label { display: block; margin-bottom: 6px; font: 600 10px/1 'DM Sans', -apple-system, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.38); } .lt-slot { position: relative; margin: 0 auto; width: 100%; overflow: hidden; border-radius: 16px; background: #0e0b20; border: 1px solid rgba(160,140,255,.16); box-shadow: 0 16px 50px rgba(0,0,0,.35); } .lt-slot[data-size="leader"] { max-width: 600px; aspect-ratio: 21 / 9; } .lt-slot[data-size="box"] { max-width: 728px; aspect-ratio: 21 / 9; } .lt-slot[data-size="rail"] { max-width: 728px; aspect-ratio: 21 / 9; } .lt-slot ins.adsbygoogle { display: block; width: 100%; height: 100%; } .lt-slot ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; } .lt-slot.is-house ins.adsbygoogle { display: none !important; } .lt-slot:not(.is-house) .lt-house { display: none; } .lt-house { position: absolute; inset: 0; display: block; animation: lt-house-in .5s ease-out both; } .lt-house picture, .lt-house img { display: block; width: 100%; height: 100%; } .lt-house img { object-fit: cover; transition: transform .6s cubic-bezier(.22,.61,.36,1); } .lt-house:hover img { transform: scale(1.02); } @keyframes lt-house-in { from { opacity: 0; } to { opacity: 1; } } @media (prefers-reduced-motion: reduce) { .lt-house { animation: none; } .lt-house img { transition: none; } } /* ── Blog post: two tall rails in the empty gutters on wide screens; on narrow screens the same two fields sit above and below the post. ──── */ .ch-ad-grid { display: grid; grid-template-columns: 1fr; } .ch-rail .lt-slot-wrap { margin: 18px auto; } @media (min-width: 1240px) { .ch-ad-grid { grid-template-columns: 1fr minmax(0, 720px) 1fr; column-gap: 32px; align-items: start; } .ch-rail { position: sticky; top: 24px; } .ch-rail-l { justify-self: end; } .ch-rail-r { justify-self: start; } .ch-rail .lt-slot-wrap { margin: 40px 0 0; padding: 0; } .ch-rail .lt-slot[data-size="rail"] { width: 300px; max-width: none; aspect-ratio: 9 / 16; } }