/* MoxKit popular-posts widget. Each post's rank color is --moxkit-pp-c (one color, medals, a blend, or a palette). */
.moxkit-pp{--moxkit-pp-accent:var(--moxkit-accent);--moxkit-pp-gold:#f5a524;
--moxkit-pp-silver:#94a3b8;--moxkit-pp-bronze:#c2703d;--moxkit-pp-from:#ec4899;
--moxkit-pp-to:#635bff;--moxkit-pp-p1:#635bff;--moxkit-pp-p2:#ec4899;--moxkit-pp-p3:#f59e0b;
--moxkit-pp-p4:#10b981;--moxkit-pp-p5:#0ea5e9;--moxkit-pp-p6:#8b5cf6;--moxkit-pp-gap:18px;
--moxkit-pp-cols:3;--moxkit-pp-thumb:96px;--moxkit-pp-img-radius:12px;
--moxkit-pp-badge:38px;--moxkit-pp-on-accent:#fff;--moxkit-pp-divider:var(--moxkit-line);
--moxkit-pp-shade:rgba(12,14,24,.86);--moxkit-pp-overlay-h:320px}
.moxkit-pp-item{--moxkit-pp-c:var(--moxkit-pp-accent)}
.moxkit-pp-colors--medals .is-medal-1{--moxkit-pp-c:var(--moxkit-pp-gold)}
.moxkit-pp-colors--medals .is-medal-2{--moxkit-pp-c:var(--moxkit-pp-silver)}
.moxkit-pp-colors--medals .is-medal-3{--moxkit-pp-c:var(--moxkit-pp-bronze)}
.moxkit-pp-colors--gradient .moxkit-pp-item{--moxkit-pp-c:color-mix(in oklab,var(--moxkit-pp-to) var(--moxkit-pp-t, 0%),var(--moxkit-pp-from))}
.moxkit-pp-c1{--moxkit-pp-c:var(--moxkit-pp-p1)}
.moxkit-pp-c2{--moxkit-pp-c:var(--moxkit-pp-p2)}
.moxkit-pp-c3{--moxkit-pp-c:var(--moxkit-pp-p3)}
.moxkit-pp-c4{--moxkit-pp-c:var(--moxkit-pp-p4)}
.moxkit-pp-c5{--moxkit-pp-c:var(--moxkit-pp-p5)}
.moxkit-pp-c6{--moxkit-pp-c:var(--moxkit-pp-p6)}

.moxkit-pp-list{display:flex;flex-direction:column;gap:var(--moxkit-pp-gap);margin:0;padding:0;list-style:none}
.moxkit-pp-item{position:relative;display:flex;align-items:center;gap:16px;
min-width:0;margin:0;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background-color .3s}
.moxkit-pp-item::marker{content:none}
.moxkit-pp-body{position:relative;z-index:1;flex:1;min-width:0}
.moxkit-pp-media{position:relative;display:block;flex:0 0 var(--moxkit-pp-thumb);
width:var(--moxkit-pp-thumb);aspect-ratio:var(--moxkit-pp-ratio, 1/1);
overflow:hidden;border-radius:var(--moxkit-pp-img-radius);background:color-mix(in srgb,var(--moxkit-pp-c) 10%,#f2f4f7)}
.moxkit-root .moxkit-pp-media img,.moxkit-pp-ph{width:100%;height:100%;
object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.moxkit-pp-ph{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--moxkit-pp-c),color-mix(in oklab,var(--moxkit-pp-c) 55%,#1e1b4b));
color:#fff;font-size:28px;font-weight:800;text-transform:uppercase}
/* Titles carry their own color, so the Site Settings link color does not repaint them. */
.moxkit-pp .moxkit-pp-title{margin:0 0 6px;font-size:17px;font-weight:700;line-height:1.35;letter-spacing:-.01em}
.moxkit-pp .moxkit-pp-title a{color:var(--moxkit-ink);transition:color .2s}
.moxkit-pp .moxkit-pp-title a:is(:hover,:focus-visible){color:var(--moxkit-pp-c)}
.moxkit-pp-excerpt{margin:0 0 8px;color:var(--moxkit-muted);font-size:14px;line-height:1.6}
.moxkit-pp-meta{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--moxkit-muted);font-size:12.5px;line-height:1.4}
.moxkit-pp-m{display:inline-flex;align-items:center;gap:5px}
.moxkit-pp-meta svg{flex:0 0 auto;width:1.1em;height:1.1em;color:var(--moxkit-pp-c)}
.moxkit-pp-cat{position:absolute;z-index:2;right:12px;top:12px;padding:5px 10px;
border-radius:999px;background:var(--moxkit-pp-c);color:var(--moxkit-pp-on-accent);
font-size:11.5px;font-weight:700;line-height:1;letter-spacing:.02em}

/* Rank numbers beside the text (list and ranking). */
.moxkit-pp-num{position:relative;z-index:1;flex:0 0 auto;white-space:nowrap;
color:var(--moxkit-pp-c);font-weight:800;line-height:1;font-variant-numeric:tabular-nums;
letter-spacing:-.04em}
.moxkit-pp-num--big .moxkit-pp-num{min-width:1.3em;font-size:34px;text-align:center}
.moxkit-pp:is(.moxkit-pp-num--circle,.moxkit-pp-num--square) .moxkit-pp-num{
display:inline-flex;align-items:center;justify-content:center;width:var(--moxkit-pp-badge);
height:var(--moxkit-pp-badge);border-radius:50%;background:var(--moxkit-pp-c);
color:var(--moxkit-pp-on-accent);font-size:calc(var(--moxkit-pp-badge) * .4);
letter-spacing:0;box-shadow:0 6px 16px -8px var(--moxkit-pp-c)}
.moxkit-pp-num--square .moxkit-pp-num{border-radius:28%}
.moxkit-pp-num--outline .moxkit-pp-num{min-width:1.3em;color:transparent;
font-size:40px;text-align:center;-webkit-text-stroke:1.5px var(--moxkit-pp-c)}
.moxkit-pp-num--gradient .moxkit-pp-num{min-width:1.3em;background:linear-gradient(160deg,var(--moxkit-pp-c) 20%,color-mix(in oklab,var(--moxkit-pp-c) 45%,#fff));
-webkit-background-clip:text;background-clip:text;color:transparent;font-size:40px;
text-align:center}
.moxkit-pp-num--watermark .moxkit-pp-item>.moxkit-pp-num{position:absolute;
z-index:0;top:50%;right:6px;color:var(--moxkit-pp-c);font-size:72px;opacity:.13;
transform:translateY(-50%);pointer-events:none}

/* Rank numbers on the picture (cards, overlay, featured, and the corner ribbon). */
.moxkit-pp-media .moxkit-pp-num{position:absolute;z-index:2;top:12px;left:12px}
.moxkit-pp-num--big .moxkit-pp-media .moxkit-pp-num{top:auto;bottom:10px;
min-width:0;color:#fff;font-size:42px;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.moxkit-pp-num--outline .moxkit-pp-media .moxkit-pp-num{top:auto;bottom:10px;
min-width:0;font-size:48px;-webkit-text-stroke:1.5px #fff}
.moxkit-pp-num--gradient .moxkit-pp-media .moxkit-pp-num{top:auto;bottom:10px;
min-width:0;background-image:linear-gradient(160deg,#fff 30%,color-mix(in oklab,var(--moxkit-pp-c) 40%,#fff));
font-size:48px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
.moxkit-pp-num--ribbon .moxkit-pp-media .moxkit-pp-num{top:0;left:0;padding:8px 12px 9px;
border-bottom-right-radius:var(--moxkit-pp-img-radius);background:var(--moxkit-pp-c);
color:var(--moxkit-pp-on-accent);font-size:14px;letter-spacing:0}
.moxkit-pp-num--watermark .moxkit-pp-media .moxkit-pp-num{top:auto;left:auto;
right:10px;bottom:-.14em;color:#fff;font-size:110px;opacity:.6;mix-blend-mode:overlay}
/* Small thumbnails (the list, and the posts beside a featured one) get smaller numbers. */
.moxkit-pp--list.moxkit-pp-num--ribbon .moxkit-pp-media .moxkit-pp-num{padding:5px 8px 6px;font-size:12px}
.moxkit-pp--rest-side .moxkit-pp-item:not(.is-featured) .moxkit-pp-media .moxkit-pp-num{
top:6px;left:6px;bottom:auto;font-size:22px}
.moxkit-pp--rest-side:is(.moxkit-pp-num--circle,.moxkit-pp-num--square) .moxkit-pp-item:not(.is-featured) .moxkit-pp-media .moxkit-pp-num{
width:calc(var(--moxkit-pp-badge) * .7);height:calc(var(--moxkit-pp-badge) * .7);
font-size:calc(var(--moxkit-pp-badge) * .3)}
.moxkit-pp--rest-side.moxkit-pp-num--ribbon .moxkit-pp-item:not(.is-featured) .moxkit-pp-media .moxkit-pp-num{
top:0;left:0;padding:4px 7px 5px;font-size:11px}
.moxkit-pp--rest-side.moxkit-pp-num--watermark .moxkit-pp-item:not(.is-featured) .moxkit-pp-media .moxkit-pp-num{
top:auto;left:auto;right:4px;bottom:-.12em;font-size:52px}

/* Vertical lists: dividers and the accent bar. */
.moxkit-pp.has-dividers .moxkit-pp-list{gap:0}
.moxkit-pp.has-dividers .moxkit-pp-item{padding-block:calc(var(--moxkit-pp-gap) / 2)}
.moxkit-pp.has-dividers .moxkit-pp-item+.moxkit-pp-item{border-top:1px solid var(--moxkit-pp-divider)}
.moxkit-pp.has-bar .moxkit-pp-item{padding-inline-start:16px}
.moxkit-pp.has-bar .moxkit-pp-item::before{content:"";position:absolute;
left:0;top:18%;bottom:18%;width:3px;border-radius:3px;background:var(--moxkit-pp-c)}
.moxkit-pp--ranking .moxkit-pp-item{align-items:center}

/* Side by side, and the swipeable row. */
.moxkit-pp--horizontal .moxkit-pp-list{display:grid;grid-template-columns:repeat(var(--moxkit-pp-cols),minmax(0,1fr))}
.moxkit-pp--carousel .moxkit-pp-list{display:grid;grid-auto-flow:column;
grid-auto-columns:calc((100% - (var(--moxkit-pp-cols) - 1) * var(--moxkit-pp-gap)) / var(--moxkit-pp-cols));
overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
scroll-behavior:smooth;padding-bottom:10px;scrollbar-width:thin}
.moxkit-pp--carousel .moxkit-pp-item{scroll-snap-align:start}
.moxkit-pp--carousel .moxkit-pp-list:focus-visible{outline:3px solid var(--moxkit-pp-accent);outline-offset:4px}
.moxkit-pp-nav{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.moxkit-pp-nav button{display:inline-flex;align-items:center;justify-content:center;
width:40px;height:40px;padding:0;border:1px solid var(--moxkit-line);border-radius:50%;
background:#fff;color:var(--moxkit-ink);font-size:18px;cursor:pointer;
transition:background-color .2s,color .2s,opacity .2s}
.moxkit-pp-nav button:is(:hover,:focus-visible){background:var(--moxkit-pp-accent);border-color:transparent;color:#fff}
.moxkit-pp-nav button[disabled]{opacity:.35;cursor:default;pointer-events:none}

/* Cards. */
.moxkit-pp--cards .moxkit-pp-item{flex-direction:column;align-items:stretch;
gap:0;overflow:hidden;border:1px solid var(--moxkit-line);border-radius:18px;
background:#fff}
.moxkit-pp--cards .moxkit-pp-media{flex:none;width:100%;aspect-ratio:var(--moxkit-pp-ratio, 16/10);border-radius:0}
.moxkit-pp--cards .moxkit-pp-body{padding:16px 18px 18px}
.moxkit-pp--cards.is-imageless .moxkit-pp-item{flex-direction:row;align-items:center;padding:16px 18px}
.moxkit-pp--cards.is-imageless .moxkit-pp-body{padding:0}

/* Image with text on top. */
.moxkit-pp--overlay .moxkit-pp-item{display:block;min-height:var(--moxkit-pp-overlay-h);
overflow:hidden;border-radius:18px;background:linear-gradient(135deg,var(--moxkit-pp-c),color-mix(in oklab,var(--moxkit-pp-c) 50%,#111827))}
.moxkit-pp--overlay .moxkit-pp-media{position:absolute;inset:0;width:auto;aspect-ratio:auto;border-radius:0}
.moxkit-pp--overlay .moxkit-pp-media::after,.moxkit-pp--featured .is-featured .moxkit-pp-media::after{
content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--moxkit-pp-shade) 0%,color-mix(in srgb,var(--moxkit-pp-shade) 35%,transparent) 50%,transparent 80%);
pointer-events:none}
.moxkit-pp--overlay .moxkit-pp-body,.moxkit-pp--featured .is-featured .moxkit-pp-body{
position:absolute;z-index:3;left:0;right:0;bottom:0;padding:22px;pointer-events:none}
.moxkit-pp--overlay .moxkit-pp-body a,.moxkit-pp--featured .is-featured .moxkit-pp-body a{pointer-events:auto}
.moxkit-pp--overlay .moxkit-pp-media .moxkit-pp-num,.moxkit-pp--featured .is-featured .moxkit-pp-media .moxkit-pp-num{
bottom:auto;top:14px}
.moxkit-pp.moxkit-pp--overlay .moxkit-pp-title a,.moxkit-pp.moxkit-pp--featured .is-featured .moxkit-pp-title a{
color:#fff}
.moxkit-pp--overlay :is(.moxkit-pp-excerpt,.moxkit-pp-meta),.moxkit-pp--featured .is-featured :is(.moxkit-pp-excerpt,.moxkit-pp-meta){
color:rgba(255,255,255,.84)}
.moxkit-pp--overlay .moxkit-pp-meta svg,.moxkit-pp--featured .is-featured .moxkit-pp-meta svg{color:#fff}
.moxkit-pp--overlay.is-imageless .moxkit-pp-item>.moxkit-pp-num{position:absolute;top:18px;left:20px;color:#fff}
.moxkit-pp--overlay.is-imageless.moxkit-pp-num--outline .moxkit-pp-item>.moxkit-pp-num{-webkit-text-stroke-color:#fff}

/* Featured first post, the rest beside or below it. */
.moxkit-pp--featured .moxkit-pp-list{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);
align-items:stretch}
.moxkit-pp--featured .is-featured{grid-row:1 / span var(--moxkit-pp-rest, 4);
display:block;min-height:var(--moxkit-pp-overlay-h);overflow:hidden;border-radius:18px;
background:linear-gradient(135deg,var(--moxkit-pp-c),color-mix(in oklab,var(--moxkit-pp-c) 50%,#111827))}
.moxkit-pp--featured .is-featured .moxkit-pp-media{position:absolute;inset:0;
width:auto;aspect-ratio:auto;border-radius:0}
.moxkit-pp--featured .is-featured .moxkit-pp-title{font-size:26px;line-height:1.25}
.moxkit-pp--featured .moxkit-pp-item:not(.is-featured) .moxkit-pp-media{
flex-basis:calc(var(--moxkit-pp-thumb) * .9);width:calc(var(--moxkit-pp-thumb) * .9)}
.moxkit-pp--featured .moxkit-pp-item:not(.is-featured) .moxkit-pp-title{font-size:15.5px}
.moxkit-pp--featured.moxkit-pp--rest-below .moxkit-pp-list{grid-template-columns:repeat(var(--moxkit-pp-cols),minmax(0,1fr))}
.moxkit-pp--featured.moxkit-pp--rest-below .is-featured{grid-row:auto;grid-column:1 / -1}
.moxkit-pp--featured.moxkit-pp--rest-below .moxkit-pp-item:not(.is-featured){
flex-direction:column;align-items:stretch;gap:10px}
.moxkit-pp--featured.moxkit-pp--rest-below .moxkit-pp-item:not(.is-featured) .moxkit-pp-media{
flex:none;width:100%;aspect-ratio:var(--moxkit-pp-ratio, 16/10)}
.moxkit-pp--featured.is-imageless .is-featured>.moxkit-pp-num{position:absolute;top:18px;left:20px;color:#fff}
.moxkit-pp--featured.is-imageless .is-featured .moxkit-pp-body{position:absolute;
z-index:3;left:0;right:0;bottom:0;padding:22px}

/* Hover. */
.moxkit-pp-hover--zoom .moxkit-pp-item:is(:hover,:focus-within) .moxkit-pp-media :is(img,.moxkit-pp-ph){
transform:scale(1.07)}
.moxkit-pp-hover--lift .moxkit-pp-item:is(:hover,:focus-within){transform:translateY(-4px);
box-shadow:0 18px 36px -22px color-mix(in srgb,var(--moxkit-pp-c) 80%,transparent)}
.moxkit-pp-hover--tint .moxkit-pp-item:is(:hover,:focus-within){background-color:color-mix(in srgb,var(--moxkit-pp-c) 8%,transparent)}

@media(max-width:767px){
 .moxkit-pp--featured.moxkit-pp--rest-side .moxkit-pp-list{grid-template-columns:minmax(0,1fr)}
 .moxkit-pp--featured.moxkit-pp--rest-side .is-featured{grid-row:auto}
 .moxkit-pp--featured .is-featured .moxkit-pp-title{font-size:21px}
}
@media(prefers-reduced-motion:reduce){.moxkit-pp *,.moxkit-pp-item{transition:none!important}
.moxkit-pp-item:is(:hover,:focus-within),.moxkit-pp-item:is(:hover,:focus-within) .moxkit-pp-media :is(img,.moxkit-pp-ph){
transform:none!important}
.moxkit-pp--carousel .moxkit-pp-list{scroll-behavior:auto}
}