.jl-tile{--tile-paper:#292724;--tile-ink:#e8e4dc;display:block;position:relative;isolation:isolate;aspect-ratio:1;width:100%;min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:2px;background:none;color:var(--tile-ink);text-align:left;perspective:1100px;container-type:inline-size;cursor:pointer;font-family:'Newsreader',Georgia,serif;-webkit-tap-highlight-color:transparent}
.jl-tile[data-tone=ink]{--tile-paper:#242527;--tile-ink:#e5e5e3}.jl-tile[data-tone=slate]{--tile-paper:#252b2d;--tile-ink:#e1e6e5}
.jl-tile-turn{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .48s cubic-bezier(.2,.7,.25,1)}
.jl-tile-face{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:var(--tile-paper);color:var(--tile-ink);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jl-tile-image{position:relative;display:block;flex:none;width:100%;height:100%;overflow:hidden;background:#303437}
.jl-tile-photo{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.jl-tile-copy{display:flex;flex:1;min-height:0;flex-direction:column;justify-content:space-between;gap:12px;padding:clamp(16px,7cqi,30px)}
.jl-tile-title{display:block;overflow-wrap:anywhere;hyphens:auto;font:400 clamp(19px,10cqi,38px)/1.1 'Newsreader',Georgia,serif;letter-spacing:-.025em}
.jl-tile-author{display:block;font:400 clamp(10px,3.8cqi,13px)/1.4 'Space Grotesk',Arial,sans-serif;letter-spacing:.01em;overflow-wrap:anywhere;opacity:.78}
.jl-tile[data-variant=image-text] .jl-tile-image{height:58%}.jl-tile[data-variant=image-text] .jl-tile-copy{padding:clamp(12px,5cqi,21px);gap:8px}
.jl-tile[data-variant=image-text] .jl-tile-title{font-size:clamp(15px,6.7cqi,26px);line-height:1.08}
.jl-tile-back{transform:rotateY(180deg);justify-content:center;gap:18px;padding:clamp(16px,7cqi,30px)}
.jl-tile-intro{display:block;white-space:pre-line;overflow-wrap:anywhere;hyphens:auto;font:400 clamp(13px,5.6cqi,21px)/1.36 'Newsreader',Georgia,serif}
.jl-tile-missing{display:grid;place-items:center;width:100%;height:100%;font:12px 'Space Grotesk',Arial,sans-serif;color:#d2d4d6}
@media(hover:hover) and (pointer:fine){.jl-tile:not([data-locked=true]):hover .jl-tile-turn{transform:rotateY(180deg)}}
.jl-tile:not([data-locked=true]):focus-visible .jl-tile-turn,.jl-tile[data-back=true] .jl-tile-turn{transform:rotateY(180deg)}
.jl-tile:focus-visible{outline:2px solid #d4a24e;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.jl-tile-turn{transition:none}}
