/* Journal articles (T5 text pages, 10 nov 2026). Prefix jox-. The same file ships with every article folder
   (journal-*) so each article also stands alone when the generator splits the site. Static on purpose: no motion. */
.cell.jox-cell{padding-block:0 clamp(48px,6vw,88px)}
.jox-side-k{color:var(--fg)}
.jox-side time{color:inherit}
.jox-body a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--link) 35%,transparent)}
.jox-body a:hover{text-decoration-color:currentColor}
.jox-body b{color:var(--fg);font-weight:600}
.jox-head{display:flex;flex-direction:column;gap:22px}
.jox-k{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}

/* in short */
.jox-keys{display:flex;flex-direction:column;gap:12px;padding:clamp(20px,2.4vw,28px);background:#FBF8F3;border:1px solid #EAE2D4;border-radius:18px}
.pt-prose-body .jox-keys ul{gap:8px;font-size:16.5px;line-height:1.55}
.jox-keys li::marker{color:var(--amber)}

.jox-sec{display:flex;flex-direction:column;gap:18px;padding-top:clamp(24px,2.8vw,36px);border-top:1px solid var(--rule)}
.jox-body .jox-sec>h2{margin-top:0}
.jox-sec li::marker{color:var(--fg3)}

/* figures: one strong still object per article, with its source in text */
.jox-fig{margin:6px 0;display:flex;flex-direction:column;gap:14px;padding:clamp(20px,2.6vw,32px);background:#FFFDFA;border:1px solid #EAE2D4;border-radius:18px;box-shadow:0 22px 50px -38px rgba(92,83,69,.45)}
.jox-fig figcaption{font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--fg3);letter-spacing:.01em}
.jox-fig-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px}
.jox-big{font-family:var(--mono);font-weight:500;font-size:clamp(44px,5.2vw,68px);letter-spacing:-.05em;line-height:1;color:var(--fg)}
.jox-big .jox-spark{display:inline-block;width:14px;height:12px;margin-left:8px;background:var(--amber);clip-path:polygon(50% 0,100% 100%,0 100%);vertical-align:.5em}

/* bars: label, bar, value (widths are set inline as --w, 0..1) */
.jox-bars{display:grid;gap:12px}
.jox-bar{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 52px;gap:14px;align-items:center;font-size:15px;color:var(--fg2)}
.jox-bar i{display:block;height:18px;border-radius:5px;background:#E9DECD;width:calc(var(--w) * 100%)}
.jox-bar.jox-on i{background:var(--fg)}
.jox-bar b{font-family:var(--mono);font-weight:500;font-size:16px;text-align:right}

/* tables */
.jox-tbl{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}
.jox-tbl thead th{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3);text-align:left;padding:0 14px 10px 0;border-bottom:1px solid var(--fg)}
.jox-tbl thead th:not(:first-child),.jox-tbl td.jox-n{text-align:right}
.jox-tbl tbody tr{border-bottom:1px solid var(--rule)}
.jox-tbl tbody th{padding:12px 14px 12px 0;text-align:left;vertical-align:top;font-weight:500;color:var(--fg)}
.jox-tbl td{padding:12px 14px 12px 0;vertical-align:top;color:var(--fg2)}
.jox-tbl td:last-child,.jox-tbl thead th:last-child{padding-right:0}
.jox-tbl td.jox-n{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--fg)}
.jox-tbl tr.jox-total th,.jox-tbl tr.jox-total td{font-weight:600;border-top:1px solid var(--fg)}
.jox-tbl .jox-mark{display:inline-block;width:8px;height:7px;margin-right:6px;background:var(--amber);clip-path:polygon(50% 0,100% 100%,0 100%)}
.jox-tbl-text td{font-size:15px}
.jox-tbl-text thead th:not(:first-child){text-align:left}

/* numbered checks or steps, big numerals */
.jox-checks{display:grid;border-top:1px solid var(--rule);counter-reset:jxc}
.jox-checks li{counter-increment:jxc;display:grid;grid-template-columns:56px minmax(0,1fr);gap:4px 14px;padding:18px 0;border-bottom:1px solid var(--rule)}
.jox-checks li::before{content:counter(jxc,decimal-leading-zero);grid-row:span 2;font-family:var(--mono);font-size:clamp(24px,2.4vw,30px);letter-spacing:-.04em;color:var(--fg3);line-height:1}
.jox-checks li b{font-size:clamp(18px,1.6vw,21px);letter-spacing:-.015em;line-height:1.3}
.jox-checks li span{font-size:16px;line-height:1.55}
.jox-checks li.jox-last::before{color:var(--amber-text)}

/* stat tiles: in -> out */
.jox-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.jox-stats>div{display:flex;flex-direction:column;gap:6px;padding:16px 14px 4px 0}
.jox-stats>div+div{padding-left:14px;border-left:1px solid var(--rule)}
.jox-stats b{font-family:var(--mono);font-weight:500;font-size:clamp(34px,3.6vw,48px);letter-spacing:-.045em;line-height:1;color:var(--fg)}
.jox-stats span{font-size:14.5px;line-height:1.4;color:var(--fg2)}
.jox-stats.jox-out b{color:var(--fg)}
.jox-turn{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}
.jox-turn::before{content:"";width:9px;height:8px;background:var(--amber);clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(180deg)}

/* formula */
.jox-formula{display:grid;gap:10px;padding:16px 18px;border-left:3px solid var(--fg);background:var(--subtle);font-family:var(--mono);font-size:14.5px;line-height:1.55;color:var(--fg)}
.jox-formula span{display:block}
.jox-formula em{font-style:normal;color:var(--fg3)}

/* definition list of the rates */
.jox-defs{display:grid;margin:0;border-top:1px solid var(--rule)}
.jox-defs>div{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:14px;padding:13px 0;border-bottom:1px solid var(--rule)}
.jox-defs dt{font-weight:600;color:var(--fg);font-size:16px}
.jox-defs dd{margin:0;font-size:16px;line-height:1.55}

.jox-faq .faq summary{font-size:17px}
.jox-faq .faq details>div{font-size:16.5px;line-height:1.6}

/* by-line at the end of the article */
.jox-by{display:flex;gap:14px;align-items:flex-start;padding:18px 0 0;border-top:1px solid var(--rule);font-size:15px;line-height:1.55;color:var(--fg3)}
.jox-by svg{flex:none;margin-top:2px;color:var(--fg)}

/* keep reading */
.cell.jox-more-cell{padding-block:clamp(48px,6vw,88px)}
.jox-more{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(24px,5vw,80px);align-items:start}
.jox-more-head{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.jox-more-head h2{font-size:clamp(28px,3vw,40px);line-height:1.05;letter-spacing:-.035em}
.jox-more-head p{font-size:16px;color:var(--fg2);max-width:36ch}
.jox-reads{border-top:1px solid var(--rule)}
.jox-read{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 20px;align-items:baseline;padding:18px 2px;border-bottom:1px solid var(--rule);color:inherit}
.jox-read:hover{text-decoration:none;background:var(--subtle)}
.jox-read .jox-k{grid-column:1}
.jox-read b{grid-column:1;font-size:clamp(18px,1.6vw,21px);letter-spacing:-.015em;line-height:1.3}
.jox-read i{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-size:20px;color:var(--fg3);transition:transform .2s ease}
.jox-read:hover i{transform:translateX(4px);color:var(--fg)}

@media (max-width:900px){
  .jox-more{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .jox-fig{padding:16px}
  .jox-tbl{font-size:14px}
  .jox-tbl tbody th,.jox-tbl td{padding-right:10px}
  .jox-bar{grid-template-columns:minmax(0,1fr) 48px;gap:6px 10px}
  .jox-bar span{grid-column:1 / -1}
  .jox-bar i{grid-column:1}
  .jox-stats{grid-template-columns:minmax(0,1fr)}
  .jox-stats>div{flex-direction:row;align-items:baseline;gap:14px;padding:12px 0}
  .jox-stats>div+div{padding-left:0;border-left:0;border-top:1px solid var(--rule)}
  .jox-stats b{min-width:72px}
  .jox-defs>div{grid-template-columns:minmax(0,1fr);gap:4px}
  .jox-checks li{grid-template-columns:44px minmax(0,1fr)}
  .jox-tbl-text thead{display:none}
  .jox-tbl-text tr,.jox-tbl-text tbody th,.jox-tbl-text td{display:block;width:auto}
  .jox-tbl-text tbody th{padding:14px 0 6px}
  .jox-tbl-text td{padding:0 0 10px}
  .jox-tbl-text td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}
}
