.portal{padding:30px 0 64px;background:#f6f4fa;color:#292333}.portal .wrap{padding-inline:20px}.portal-head{margin:0 0 26px}.portal-head .label{font:500 10px/1.6 'Space Grotesk',sans-serif;letter-spacing:.14em;color:#79619c}.portal-head h1{margin:12px 0 16px;font:400 clamp(32px,9.4cqi,40px)/1.25 'Song Myung',serif;letter-spacing:-.04em}.portal-head p:last-child{margin:0;color:#756c7e;font-size:16px;line-height:1.6}
.poster{--poster-scale:1;position:relative;display:block;min-width:0;overflow:hidden;border-radius:23px;aspect-ratio:2/3;container-type:inline-size;isolation:isolate;background:#17172a;color:#fff;text-decoration:none;scroll-snap-align:start;box-shadow:0 12px 28px #17102c15;transition:transform .25s ease}.poster img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover}.poster:after{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,#11112200 26%,#11112222 46%,#111122aa 69%,#111122f2 100%)}.poster:hover{transform:translateY(-3px)}.poster:focus-visible{outline:3px solid #8563b3;outline-offset:4px}
.poster-body{position:absolute;bottom:0;left:0;right:0;display:grid;gap:12px;padding:26px 22px 28px}.poster-eyebrow{font:500 10px/1.5 'Space Grotesk',sans-serif;letter-spacing:.12em;color:#ddd1ef}.poster-title{font:400 calc(clamp(28px,10.8cqw,39px) * var(--poster-scale))/1.25 'Song Myung',serif;letter-spacing:-.045em;word-break:keep-all;text-shadow:0 2px 18px #08071780}.poster-tag{font-size:15px;line-height:1.65;color:#e1dce8;word-break:keep-all}.poster-badge{position:absolute;top:16px;right:16px;border:1px solid #ffffff45;background:#1a182b8c;backdrop-filter:blur(8px);border-radius:30px;color:#f2ebff;padding:7px 12px;font:500 12px/1.4 var(--font);font-style:normal}.poster.is-premium .poster-badge{background:#103136a8;color:#d0eeee;border-color:#a4d1cc80}.poster-sans .poster-title{font-family:var(--font);font-weight:700;line-height:1.28}.poster-center .poster-body{text-align:center}.poster-middle .poster-body{top:50%;bottom:auto;transform:translateY(-50%)}.poster-top .poster-body{top:34px;bottom:auto}.poster-top:after{background:linear-gradient(180deg,#111122f2,#11112280 40%,#11112200 78%)}.poster-middle:after{background:linear-gradient(180deg,#11112215,#111122bb 44%,#111122bb 66%,#11112225)}
.portal-hero,.portal-shelf{display:grid;grid-auto-flow:column;grid-auto-columns:88%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;overscroll-behavior-x:contain;padding:2px 2px 18px;scrollbar-width:thin;scrollbar-color:#c2b5d7 transparent}.portal-hero{grid-auto-columns:94%;margin-bottom:42px}.portal-hero .poster{aspect-ratio:2/3}.portal-hero .poster-title{font-size:calc(clamp(30px,10cqw,40px) * var(--poster-scale))}.portal-sec{margin:0 0 42px}.portal-sec h2{font:650 24px/1.4 var(--font);letter-spacing:-.045em;margin:0 0 8px;word-break:keep-all}.portal-sec>p{font-size:15px;line-height:1.65;color:#756c7e;margin:0 0 18px}.portal-shelf .poster{aspect-ratio:2/3}.portal-swipe{font-size:12px;color:#8b7c9a;margin:-32px 0 34px;text-align:right}.portal-sec .portal-swipe{margin:0 0 14px}
@container app (max-width:360px){.portal .wrap{padding-inline:16px}.portal-head h1{font-size:33px}.poster-body{padding:22px 18px}.poster-tag{font-size:14px}.portal-sec h2{font-size:22px}.portal-hero,.portal-shelf{grid-auto-columns:94%}}
/* The nine orbs are meaningful cover art: put the caption below, never across them. */
.portal-topic-links{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;margin:0 -2px 24px;padding:3px 2px 8px;scrollbar-width:thin;scrollbar-color:#d6ccdf transparent}.portal-topic-links a{flex:0 0 auto;scroll-snap-align:start;display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 13px;border:1px solid #e0d6e9;border-radius:999px;background:#fff;color:#604978;text-decoration:none;white-space:nowrap;font-size:13px;line-height:1.5}.portal-topic-links a:hover{background:#f0eaf5}.portal-topic-links a:focus-visible{outline:2px solid #8563b3;outline-offset:2px}
.poster-flagship{position:absolute;top:16px;left:16px;border:1px solid #b4d9d180;background:#103136c9;border-radius:30px;color:#e2f5ef;padding:7px 11px;font:600 10px/1.7 'Space Grotesk',sans-serif;letter-spacing:.08em;font-style:normal}
.portal-shelf .poster-reading-guide{aspect-ratio:auto;background:#171127;align-self:start}
.poster-reading-guide img{position:relative;inset:auto;z-index:0;display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain}
.poster-reading-guide:after{display:none}
.poster-reading-guide .poster-body{position:relative;inset:auto;transform:none;gap:8px;padding:20px}
.poster-reading-guide .poster-title{font-size:calc(clamp(25px,8.8cqw,34px) * var(--poster-scale))}
@media(prefers-reduced-motion:reduce){.poster{transition:none}.poster:hover{transform:none}}