/* Rankings use the journal's paper, ink, display face and five official tier colours. */
.rank-hero, .rank-detail { color:var(--app-text); }
.rank-hero { display:flex; align-items:end; justify-content:space-between; flex-wrap:wrap; gap:.75rem 1.5rem; padding-bottom:1rem; border-bottom:3px solid var(--zine-line); }
.rank-hero h1,.rank-heading h1,.rank-evidence h2 { margin:0; color:var(--app-text-strong); font-family:'Black Han Sans',sans-serif; font-weight:400; line-height:1.15; text-wrap:balance; overflow-wrap:anywhere; }
.rank-hero h1 { font-size:clamp(2.5rem,6vw,3.5rem); }
.rank-hero p { margin:.4rem 0 0; max-width:42rem; font-size:1.0625rem; line-height:1.6; color:var(--app-muted); }
.rank-hero .rank-stamp { display:flex; flex-wrap:wrap; gap:.5rem; align-items:baseline; font-size:.875rem; color:var(--app-text); }
@media (min-width:56rem) {
  .rank-hero { flex-wrap:nowrap; }
  .rank-hero > div { flex:1; min-width:0; }
  .rank-hero .rank-stamp { flex:0 0 auto; max-width:45%; }
}
.rank-stamp b { font-family:Gaegu,sans-serif; font-size:1.1rem; }
.ranking-views { display:flex; flex-wrap:wrap; gap:.35rem; }
.ranking-views a { padding:.4rem .8rem; border-radius:1.5rem; }
.ranking-views a[aria-current],.rank-segments a[aria-current],.rank-picker a[aria-current] { background:var(--zine-yellow); color:#231f20; }
.rank-method { border-style:dashed; line-height:1.65; background:var(--zine-paper); }
.rank-method summary,.rank-picker summary,.rank-cite summary { cursor:pointer; font-weight:800; }
.rank-method > p { margin:.6rem 0; max-width:75ch; }
.ranking-filters { margin:1.4rem 0; padding:0 0 1rem; border-bottom:3px solid var(--zine-line); display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1.5rem; }
.ranking-filters > div { min-width:0; display:flex; align-items:center; gap:.5rem; }
.ranking-filters > div > span { font-size:.82rem; font-weight:800; color:var(--app-muted); }
.rank-segments,.rank-picker { border:2px solid var(--zine-line); border-radius:2rem; background:var(--zine-paper); }
.rank-segments { display:inline-flex; flex-wrap:wrap; padding:.12rem; gap:.1rem; }
.rank-segments a,.rank-picker a { flex:1 1 auto; justify-content:center; padding:.28rem .65rem; min-height:2.4rem; border:0; border-radius:2rem; white-space:normal; text-align:center; line-height:1.25; }
.rank-picker { position:relative; min-width:7.5rem; }
.rank-picker summary { padding:.62rem 1rem; font-size:.875rem; line-height:1.2; }
.rank-picker nav { position:absolute; z-index:3; top:calc(100% + 5px); left:0; display:grid; width:max-content; min-width:100%; max-width:min(19rem,75vw); max-height:18rem; overflow:auto; background:var(--zine-paper); border:2px solid var(--zine-line); border-radius:.5rem; padding:.25rem; box-shadow:3px 3px var(--zine-drop); }
.rank-picker nav a { justify-content:flex-start; text-align:left; border-radius:.3rem; }
.rank-sort-small { display:none; }
.ranking-list,.rank-relations,.rank-keywords,.rank-evidence ul { margin:0; list-style:none; padding:0; }
.ranking-list { display:grid; gap:.6rem; }
.rank-row,.rank-profile,.rank-metrics > div,.rank-evidence,.rank-relations a,.rank-cite,.rank-community,.rank-news-item { background:var(--zine-paper); border:2px solid var(--zine-line); border-radius:.4rem; }
.rank-row { position:relative; display:flex; align-items:center; gap:.7rem; padding:.7rem 1rem; }
.rank-row:hover { background:var(--app-hover); }
.rank-position,.rank-value,.rank-metrics dd { font-family:'Black Han Sans',sans-serif; font-weight:400; font-variant-numeric:tabular-nums; }
.rank-position { display:grid; place-items:center; flex:0 0 2.1rem; height:2.1rem; font-size:1.3rem; line-height:1; }
.rank-row:nth-child(-n+3) .rank-position,.rank-consumer-row:first-child b { border:2px solid #231f20; border-radius:50%; background:var(--zine-yellow); color:#231f20; }
.rank-logo { display:inline-flex; flex:none; width:2.5rem; height:2.5rem; align-items:center; justify-content:center; overflow:hidden; border:2px solid var(--zine-line); border-radius:50%; background:white; color:#231f20; }
.rank-logo img { display:block; width:70%; height:70%; object-fit:contain; }
.rank-logo img.rank-owner-avatar { width:100%; height:100%; object-fit:cover; }
.rank-logo[data-brand-failed] { background:var(--zine-yellow); font:400 1.15rem 'Black Han Sans',sans-serif; }
.rank-logo [hidden] { display:none; }
.rank-name { flex:1 1 0; min-width:0; line-height:1.35; overflow-wrap:anywhere; }
.rank-name > a { color:var(--app-text-strong); font-weight:800; text-decoration:none; }
.rank-name > a::after { content:""; position:absolute; inset:0; border-radius:.35rem; }
.rank-name > a:focus-visible::after { outline:3px solid var(--zine-blue-ink); outline-offset:-4px; }
.rank-name > a:hover,.rank-row:hover .rank-name > a { text-decoration:underline; }
.rank-name small,.rank-relations small,.rank-news-item small { display:block; color:var(--app-muted); font-size:.81rem; line-height:1.45; margin-top:.25rem; }
.rank-tier { display:inline-flex; background:var(--grade-bg); color:var(--grade-fg); border:1px solid #231f20; border-radius:.2rem; padding:.05rem .35rem; font-size:.76rem; font-weight:800; }
.rank-meter { width:clamp(3rem,8vw,7rem); height:.85rem; border:2px solid var(--zine-line); border-radius:2rem; overflow:hidden; flex:none; }
.rank-meter i,.rank-evidence-bar i { display:block; height:100%; background:var(--zine-cyan); }
.rank-value { min-width:2rem; max-width:5rem; text-align:right; font-size:1.35rem; line-height:1.1; color:var(--app-text-strong); }
.rank-out,.rank-hero-actions { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:.4rem; }
.rank-out { position:relative; z-index:1; }
.rank-out a,.rank-hero-actions a,.rank-back { display:inline-flex; align-items:center; justify-content:center; min-height:2.5rem; padding:.4rem .75rem; border:2px solid #231f20; border-radius:3rem; text-decoration:none; background:var(--zine-yellow); color:#231f20; font-size:.85rem; line-height:1.2; font-weight:800; text-align:center; }
.rank-out a.rank-download,.rank-hero-actions a.rank-download { background:var(--zine-cyan); }
.rank-consumer-row { min-height:3.4rem; }
.rank-consumer-row > b { flex:0 0 2rem; height:2rem; display:grid; place-items:center; }
.rank-consumer-row .rank-logo { width:2.1rem; height:2.1rem; }
.rank-back { background:var(--zine-paper); border-color:var(--zine-line); color:var(--app-text-strong); margin:0 0 1rem; }
.rank-profile,.rank-community { padding:clamp(1rem,3vw,1.8rem); box-shadow:3px 3px var(--zine-drop); }
.rank-profile-top { display:flex; justify-content:space-between; align-items:start; gap:1rem; }
.rank-identity { min-width:0; flex:1; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:.65rem 1rem; }
.rank-identity > .rank-logo { grid-row:span 2; align-self:start; width:5rem; height:5rem; border-radius:.42rem; box-shadow:3px 3px var(--zine-drop); }
.rank-identity > .rank-logo img { width:80%; height:80%; object-fit:contain; }
.rank-identity .rank-logo[data-brand-failed] { background:var(--grade-bg,var(--zine-yellow)); color:var(--grade-fg,#231f20); font-size:2.3rem; }
.rank-heading,.rank-tags,.rank-keywords,.rank-attribution { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem .6rem; min-width:0; }
.rank-heading h1 { font-size:clamp(1.8rem,4vw,2.75rem); }
.rank-heading .rank-tier { font-size:.9rem; padding:.16rem .5rem; border-width:2px; }
.rank-tags > *,.rank-keywords li { border:2px solid var(--app-border); padding:.15rem .6rem; border-radius:2rem; font-size:.82rem; font-weight:700; }
.rank-tags a { border-color:var(--zine-line); background:var(--zine-yellow); color:#231f20; text-decoration:none; }
.rank-intro { margin-top:1.25rem; max-width:55rem; border:2px solid var(--zine-line); border-radius:.25rem; padding:.8rem 1rem; background:var(--zine-yellow-soft); }
.rank-intro p { margin:0; line-height:1.7; font-size:1rem; color:var(--app-text-strong); }
.rank-attribution { margin-top:.65rem; color:var(--app-muted); font-size:.8rem; line-height:1.5; }
.rank-attribution a,.rank-evidence a { font-weight:800; text-decoration:underline; text-underline-offset:3px; }
.rank-keywords { margin-top:1rem; }
.rank-keywords li { color:var(--app-muted); background:var(--app-panel-soft); }
.rank-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.6rem; margin:1.2rem 0; }
.rank-metrics > div { padding:.8rem 1rem; overflow-wrap:anywhere; }
.rank-metrics dt,.rank-facts dt { color:var(--app-muted); font-size:.82rem; font-weight:700; }
.rank-metrics dd { margin:.25rem 0 0; color:var(--app-text-strong); font-size:clamp(1.2rem,3vw,1.75rem); }
.rank-relations { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr)); gap:.6rem; }
.rank-relations a { display:flex; align-items:center; gap:.65rem; height:100%; padding:.75rem; text-decoration:none; color:var(--app-text); }
.rank-relations a > span:nth-child(2) { flex:1; overflow-wrap:anywhere; }
.rank-relations a:hover,.rank-hero-actions a:hover,.rank-out a:hover,.rank-back:hover { box-shadow:2px 2px var(--zine-drop); }
.rank-evidence { margin-top:1.4rem; overflow:hidden; }
.rank-evidence header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem; padding:1rem; border-bottom:2px solid var(--zine-line); }
.rank-evidence h2 { font-size:1.7rem; }
.rank-evidence header span { font-size:.85rem; font-weight:800; }
.rank-evidence li,.rank-evidence footer,.rank-cite,.rank-news-item { padding:.8rem 1rem; }
.rank-evidence li + li,.rank-evidence footer { border-top:1px solid var(--app-border); }
.rank-evidence li > div:first-child { display:flex; justify-content:space-between; gap:.5rem; }
.rank-evidence p,.rank-empty,.rank-news-item p { margin:.25rem 0; font-size:.89rem; line-height:1.6; overflow-wrap:anywhere; }
.rank-evidence-bar { display:flex; gap:.65rem; align-items:center; }
.rank-evidence-bar span { flex:1; height:.55rem; border:1px solid var(--zine-line); border-radius:1rem; overflow:hidden; }
.rank-evidence-bar i { background:var(--zine-yellow); }
.rank-evidence-bar b,.rank-evidence li small,.rank-evidence li a { font-size:.8rem; }
.rank-evidence footer { background:var(--app-panel-soft); }
.rank-facts { display:flex; flex-wrap:wrap; gap:1rem 2rem; padding:1rem; border-block:2px solid var(--app-border); }
.rank-facts dd { margin:0; font-weight:800; }
.rank-cite label,.rank-community label { display:grid; gap:.3rem; font-weight:700; }
.rank-cite textarea,.rank-community textarea,.rank-detail form textarea { display:block; width:100%; margin:.3rem 0; border:1px solid var(--app-border); background:var(--app-panel-soft); color:var(--app-text); padding:.5rem; }
.rank-cite textarea:focus,.rank-community textarea:focus,.rank-detail form textarea:focus { outline:0; border-color:var(--zine-blue-ink); box-shadow:inset 0 0 0 1px var(--zine-blue-ink); }
.rank-community,.rank-cite,.rank-news-item { margin-top:.8rem; }
.rank-community h2 { margin-top:0; }
.rank-detail :where(a,summary,button):focus-visible,.ranking-filters :where(a,summary):focus-visible,.rank-out a:focus-visible { outline:3px solid var(--zine-blue-ink); outline-offset:2px; }
@media (max-width:48rem) {
  .rank-meter,.rank-sort-wide { display:none; }
  .rank-sort-small { display:block; }
  .ranking-filters { display:grid; grid-template-columns:auto minmax(0,1fr); }
  .ranking-filters > div { display:contents; }
  .ranking-filters .rank-picker { width:100%; }
  .rank-picker nav { width:100%; max-width:100%; }
  .rank-profile-top { flex-direction:column; }
  .rank-identity { width:100%; }
  .rank-hero-actions { align-self:stretch; justify-content:flex-start; }
  .rank-row { gap:.45rem; padding:.6rem; }
}
@media (max-width:39.99rem) {
  .rank-row { display:grid; grid-template-columns:1.7rem 2rem minmax(0,1fr) auto; gap:.4rem .45rem; }
  .rank-row .rank-logo { width:2rem; height:2rem; }
  .rank-position { width:1.7rem; height:1.7rem; font-size:1rem; }
  .rank-value { max-width:3.3rem; font-size:1rem; }
  .rank-out { grid-column:3 / -1; justify-self:start; justify-content:start; }
  .rank-out:empty { display:none; }
  .rank-name small { font-size:.76rem; }
  .rank-identity { gap:.65rem .75rem; }
  .rank-identity > .rank-logo { grid-row:auto; width:3.5rem; height:3.5rem; }
  .rank-tags { grid-column:1/-1; }
  .rank-hero-actions a { flex:1; }
  .rank-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rank-metrics > div:last-child { grid-column:1/-1; }
}
.ranking-nav { border-bottom:1px solid var(--app-border); background:var(--zine-paper); }
.ranking-nav nav { max-width:72rem; margin:auto; padding:.4rem 1rem; display:flex; align-items:center; gap:.35rem; overflow-x:auto; }
.ranking-nav a { flex:none; display:inline-flex; align-items:center; justify-content:center; min-height:2.75rem; padding:.35rem .85rem; border:2px solid transparent; border-radius:.4rem; font-size:.86rem; font-weight:800; color:var(--app-text); white-space:nowrap; text-decoration:none; }
.ranking-nav a[aria-current] { border-color:var(--zine-line); background:var(--zine-yellow-soft); }
.ranking-nav a:hover,.ranking-nav a:focus-visible { border-color:var(--zine-line); }
.ranking-views a { border-radius:.35rem; box-shadow:2px 2px var(--zine-drop); }
.ranking-filters > div:first-child .rank-segments a[aria-current] { background:var(--zine-cyan); }
.rank-detail .rank-back { margin-top:-1rem; }
@media (max-width:39.99rem) { .ranking-nav nav { gap:.15rem; } .ranking-nav a { padding:.3rem .6rem; font-size:.78rem; } }
.rank-news-item { display:flex; gap:1rem; align-items:flex-start; }
.rank-news-item img { flex:none; width:clamp(4rem,12vw,7rem); aspect-ratio:4/3; border-radius:.3rem; object-fit:cover; }
.rank-news-item a { padding:0; min-height:0; }
.rank-snippet { margin-top:1rem; color:var(--app-text); }
.rank-snippet > div { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.rank-snippet pre { white-space:pre-wrap; overflow-wrap:anywhere; margin:.4rem 0; font-size:.85rem; padding:.65rem; background:var(--app-panel-soft); border:1px solid var(--app-border); }
.rank-snippet button { min-height:2.5rem; padding:.2rem .85rem; color:#231f20; border:2px solid #231f20; border-radius:2rem; background:var(--zine-yellow); }
.rank-snippet button span { margin-right:.2rem; }
.rank-hero { padding-top:1.7rem; }
.rank-hero .rank-stamp b { padding:.12rem .5rem; border:2px solid #231f20; border-radius:.15rem; background:var(--zine-yellow); color:#231f20; font:800 .8rem/1.35 'Nanum Gothic',sans-serif; }
.rank-hero-actions a { min-height:2.75rem; box-shadow:3px 3px var(--zine-drop); }
.rank-out a:not(.rank-download) { background:var(--zine-paper); color:var(--app-text-strong); border-color:var(--zine-line); }
.rank-out a:not(.rank-download):hover { background:var(--zine-yellow); color:#231f20; }
.rank-options { display:flex; align-items:center; gap:.4rem; min-width:0; }
.rank-picker.rank-more { min-width:2.5rem; width:auto; }
.rank-more summary { padding:0; width:2.5rem; height:2.5rem; display:grid; place-items:center; list-style:none; font-size:1.15rem; }
.rank-more summary::-webkit-details-marker { display:none; }
.rank-more nav { right:0; left:auto; min-width:10rem; }
.rank-segments > a { display:inline-flex; align-items:center; font-size:.875rem; font-weight:800; text-decoration:none; }
.rank-metrics > div { display:flex; flex-direction:column; justify-content:center; text-align:center; }
.rank-metrics dd { order:-1; margin:0 0 .16rem; }
.rank-reviews { margin:1.2rem 0; }
@media (max-width:39.99rem) { .rank-row .rank-out { display:none; } }