/* Phone header, middle way: old look, but Menu + search folded into icons beside the name. */
.p-icons { display: none; }
@media (max-width: 860px) {
  .mast .wrap { flex-wrap: wrap; align-items: center; gap: 12px 8px; padding-top: 14px; padding-bottom: 14px; }
  .mast .wm { flex: 1; min-width: 0; }
  .mast .wm small { font-size: 13px; }
  .mast .wm span { font-size: min(19px, 4.8vw); white-space: nowrap; }
  .p-icons { display: flex; margin-right: -8px; }
  .p-icons button { width: 42px; height: 42px; display: grid; place-items: center; background: none; border: 0; color: #fff; border-radius: 6px; cursor: pointer; }
  .p-icons button:active, .p-icons button[aria-expanded="true"] { background: rgba(255, 255, 255, .12); }
  .p-icons .ic { width: 21px; height: 21px; }
  .mast .side { width: 100%; margin: 0; }
  .mast .side .issn { display: none; }
  .mast .side .acts .btn { padding: 10px 8px; font-size: 14.5px; }
  /* the old Menu bar is hidden until the menu or search icon is tapped; then it opens in place as before */
  .menu { display: none; }
  body.nav-open .menu { display: block; }
  .menu .tog { display: none !important; }
  .menu .wrap { padding-top: 12px; padding-bottom: 6px; }
  .menu form { order: -1; flex: 1 1 100%; margin: 0 0 4px; }
  body.nav-open #jmenu { display: flex; }
}

/* owner: only the hamburger beside the name; search lives inside the menu */
@media (max-width: 860px) { .p-icons .p-search { display: none; } .mast .wm span { font-size: min(20px, 5.1vw); } }

/* owner: slimmer publisher bar on phones */
@media (max-width: 860px) { .pbar .wrap { height: 36px; } .pbar .brand img { height: 22px; } .pbar nav { font-size: 13px; } .pbar nav .ic { width: 13px; height: 13px; } }

/* homepage on phones: one "Current issue" card instead of the call strip + latest issue; metrics in two columns */
.ph-only { display: none; }
@media (min-width: 861px) { .ph-only { display: none !important; } }   /* desktop rules like .latest a / .latest span must not show them */
@media (max-width: 860px) {
  body .notice { display: none; }
  .open { padding-top: 16px; }
  .open .wrap { grid-template-columns: 1fr; gap: 14px; }
  .latest { display: grid !important; grid-template-columns: 78px minmax(0, 1fr); gap: 16px; align-items: center; background: #fff; border: 1px solid var(--rule); border-radius: 8px; padding: 14px; box-shadow: var(--shadow-sm); }
  .latest .cv { width: 78px; }
  .latest > div { display: flex; flex-wrap: wrap; column-gap: 18px; }
  .latest b { flex-basis: 100%; margin: 0 0 2px !important; font-size: 13px; font-weight: 600; color: var(--navy-md); text-transform: none; }
  .latest span { flex-basis: 100%; font-size: 15px; line-height: 1.4; color: var(--ink); }
  .latest span:nth-of-type(1) { font: 600 18px/1.3 var(--serif); }
  .latest span:nth-of-type(2) { color: var(--mu); font-size: 14px; }
  .latest .ph-only { display: block; }
  .latest .dl { margin-top: 6px; font-size: 14px; color: var(--body); }
  .latest .dl b { display: inline; flex-basis: auto; font: 600 14px var(--sans); color: var(--navy); }
  .latest a { margin-top: 8px; font-size: 15px; font-weight: 600; }
  .metrics { padding: 16px 16px 10px; }
  .metrics ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
  .metrics li { padding: 10px 0; }
  .metrics li:nth-child(2) { border-top: 0; }
  .metrics li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .metrics .ic { width: 19px; height: 19px; }
  .metrics b { font-size: 19px; }
  .metrics span { line-height: 1.35; display: block; font-size: 13px; }
}

@media (max-width: 860px) { .aboutblk p { text-align: left; hyphens: manual; } .aboutblk .top { padding: 22px 18px 16px; } }

/* page-head facts on phones (About, CFP, Charges, Indexing ...): an even 2-column grid of tiles */
@media (max-width: 860px) {
  .ph .ph-f { display: grid !important; grid-template-columns: 1fr 1fr; gap: 1px; padding: 0 !important; margin-top: 6px; background: var(--rule); border: 1px solid var(--rule) !important; border-radius: 8px; overflow: hidden; }
  .ph .ph-f div { background: #fff; padding: 11px 14px !important; border: 0 !important; }
  .ph .ph-f div:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .ph .ph-f dt { font-size: 12.5px; }
  .ph .ph-f dd { font-size: 16px; }
}

@media (max-width: 860px) { .ph .ph-a { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .ph .ph-a .btn:only-child { grid-column: 1 / -1; } .ph .ph-a .btn { padding: 12px 8px; font-size: 14.5px; white-space: normal; text-align: center; } }

/* journal metrics on phones: impact factor as a full-width lead tile, the other four as an even 2x2 grid */
@media (max-width: 860px) {
  .metrics { padding: 16px; }
  .metrics h2 { margin-bottom: 12px; }
  .metrics ul { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; column-gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 8px; overflow: hidden; }
  .metrics li, .metrics li:first-child { display: block; background: #fff; padding: 12px 14px !important; border: 0 !important; }
  .metrics li:last-child:nth-child(odd) { grid-column: auto; }
  .metrics li:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; align-items: center; background: #eef3f8; }
  .metrics li:first-child .ic { grid-row: span 2; width: 26px; height: 26px; margin: 0; }
  .metrics li:first-child b { font-size: 24px; }
  .metrics .ic { display: block; width: 18px; height: 18px; margin: 0 0 6px; }
  .metrics b { font-size: 19px; line-height: 1.2; }
  .metrics span { font-size: 13px; line-height: 1.35; margin-top: 2px; }
}

@media (max-width: 860px) { .metrics { background: none; border: 0; padding: 0; } .metrics h2 { font-size: 17px; } }

/* homepage article lists on phones: clean meta lines, compact caption, tighter cards */
@media (max-width: 860px) {
  .panel .cap { text-align: left; font-size: 13.5px; padding: 10px 16px; }
  .arts li { padding: 16px 16px 18px; }
  .arts .meta { font-size: 13px; row-gap: 3px; }
  .arts .meta > span:nth-child(3) { flex-basis: 100%; color: var(--mu); }
  .arts .meta > span:nth-child(3)::before { display: none; }
  .arts h3 { font-size: 17.5px; line-height: 1.35; margin: 6px 0 4px; }
  .arts .by { font-size: 14.5px; }
  .arts.mread li { grid-template-columns: 28px minmax(0, 1fr); }
  .arts.mread .rank { font-size: 18px; }
  .tabs button { font-size: 14.5px; padding: 12px 4px; }
  .panel .foot { padding: 14px 16px; }
}

/* owner: the article meta on ONE line on phones: Open access · Article · Vol. IX (2026) (pages dropped) */
@media (max-width: 860px) {
  .arts .meta { flex-wrap: nowrap; white-space: nowrap; overflow: hidden; }
  .arts .meta > span:nth-child(3) { flex-basis: auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .arts .meta > span + span::before, .arts .meta > span:nth-child(3)::before { display: inline-block; content: "\00b7"; width: auto; height: auto; background: none; margin: 0 7px; color: var(--fnt); }
  .arts .meta .pp { display: none; }
}

/* footer: plain columns on desktop, tap-to-open sections on phones (owner preferred the newer phone footer) */
.fcol summary { list-style: none; pointer-events: none; }
.fcol summary::-webkit-details-marker { display: none; }
@media (max-width: 860px) {
  .ftr .top { display: flex; flex-direction: column; gap: 0; padding-top: 8px; padding-bottom: 20px; }
  .ftr .wm { order: -1; text-align: left; padding: 22px 0 18px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .ftr .wm span { font-size: 24px; }
  .ftr .social { justify-content: flex-start; }
  .fcol { border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .fcol summary { pointer-events: auto; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 15px 0; }
  .fcol summary h4 { margin: 0; font-size: 16px; }
  .fcol summary::after { content: "+"; font-size: 22px; line-height: 1; color: #c3cfdb; }
  .fcol[open] summary::after { content: "\2212"; }
  .fcol ul { padding: 0 0 12px; }
  .fcol li { padding: 7px 0; }
  .ftr .pubby .wrap { flex-direction: column; align-items: flex-start; }
  .ftr .base .wrap { flex-direction: column; gap: 10px; }
}

/* owner: running text stays JUSTIFIED on phones too (hyphenated so spacing stays even) */
@media (max-width: 860px) {
  .aboutblk p, .prose p, .prose .abstract { text-align: justify !important; hyphens: auto !important; -webkit-hyphens: auto !important; }
}

/* phone type scale: everything steps down from the laptop sizes in proportion */
@media (max-width: 860px) {
  body { font-size: 15.5px; }
  .prose, .prose p, .aboutblk p, .sec-h p, .sub, .lede, .ph .lead { font-size: 15.5px; line-height: 1.62; }
  .ph h1, .ihead h1 { font-size: 26px; line-height: 1.22; }
  .ahead h1 { font-size: 23px; line-height: 1.3; }
  .h2, .dsec > h2, .prose h2, .split2 h2, .aboutblk h2, .isec h2.h2 { font-size: 21px !important; line-height: 1.3; }
  .prose h3, .dsec > h3, .dsec h3.sub3, .sc-h h3, .cols3 h3, .scope h3 { font-size: 17px !important; }
  .steps h3, .tline h3, .cards h3 { font-size: 16px !important; }
  .steps p, .tline p, .cards p, .sc-d, .note, .faq details p { font-size: 14.5px !important; }
  .faq summary { font-size: 15.5px; }
  .fgrid dd, .glance dd { font-size: 15px; }
  .fgrid dt, .glance dt, .info div { font-size: 13.5px; }
  .tbl table { font-size: 14px; }
  .ilist h3 { font-size: 17.5px; }
  .ilist .au { font-size: 14.5px; }
  .ilist .af { font-size: 13.5px; }
  .btn { font-size: 15px; }
  .crumb { font-size: 13.5px; }
  .ptabs a { font-size: 14.5px; }
}

/* ===== phone structure pass (12 Oct 2026) ===== */
@media (max-width: 860px) {
  /* full-width panels, lighter inner padding: the text column gains ~60px */
  .doc .wrap, .doc.solo .wrap { padding-left: 0 !important; padding-right: 0 !important; padding-top: 10px; gap: 10px; }
  .doc .dmain { gap: 10px; }
  .doc .dsec, .doc .dsec:first-child { border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; padding: 22px 16px 20px; }
  .dtoc { border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; }
  .steps > div, .steps.cards2 > div { padding: 14px 14px; box-shadow: none; }
  .glance dl div { padding: 9px 12px; }
  .glance .gh { padding: 10px 12px; }
  .form .fs-body { padding: 14px 12px 16px; }
  .note { padding: 12px 14px; }
  .note p, .note > div, .helpln p { text-align: left !important; }
  .helpln { padding: 14px 16px !important; align-items: flex-start; }
  .pull { padding: 14px 16px; }
  .tbl th, .tbl td { padding: 8px 9px !important; font-size: 13.5px; }
  .tbl.fees td:not(:first-child) { font-size: 14.5px; }
  .tbl th { white-space: normal; }

  /* About block: its four links as one list, arrow on the right */
  .aboutblk .bar { display: block; padding: 4px 18px; }
  .aboutblk .bar a { display: flex; justify-content: space-between; align-items: center; padding: 13px 0; border-top: 1px solid rgba(255, 255, 255, .12); }
  .aboutblk .bar a:first-child { border-top: 0; }

  /* issue page head: small cover beside the title */
  .ihead .wrap { grid-template-columns: 72px minmax(0, 1fr); gap: 14px 16px; align-items: center; }
  .ihead img { width: 72px; }
  .ihead dl { grid-column: 1 / -1; display: grid !important; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 8px; overflow: hidden; padding: 0; }
  .ihead dl div { display: block !important; background: #fff; padding: 10px 14px; }
  .ihead dt, .ihead dd { border: 0 !important; padding: 0 !important; text-align: left !important; }
  .ihead dt { font-size: 12.5px; }
  .ihead dd { font-size: 16px; }

  /* archives */
  .arch-cur { grid-template-columns: 68px minmax(0, 1fr); gap: 14px; padding: 16px; }
  .arch-cur img { width: 68px; }
  .arch-cur .acts { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .arch-cur .acts .btn { padding: 11px 8px; }
  .vol-h { flex-direction: column; align-items: flex-start; gap: 2px; }
  .vol-h h2 { font-size: 20px; }

  /* article head: buttons in a 2x2 grid, page numbers off the top line */
  .ahead .kick > span:nth-child(4) { display: none; }
  .ahead .row { flex-direction: column; align-items: stretch; gap: 14px; }
  .ahead .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .ahead .acts .btn { padding: 11px 8px; }
  .ahead .stat { justify-content: flex-start; }
}

@media (max-width: 860px) { .fgrid, .fgrid.c2, .fgrid.c3, .fgrid.c4 { grid-template-columns: 1fr 1fr !important; } .fgrid:has(small) { grid-template-columns: 1fr !important; } .fgrid > div:last-child:nth-child(odd) { grid-column: 1 / -1; } .fgrid div { padding: 11px 13px; } }

/* issue page article cards on phones: title, authors, pp · views, DOI line, then two equal buttons */
@media (max-width: 860px) {
  .ilist li { display: flex !important; flex-direction: column; gap: 0; padding: 18px 0 20px; }
  .ilist li > div:first-child { display: contents; }
  .ilist h3 { order: 1; margin: 0 0 6px; }
  .ilist .au, .ilist .af { order: 2; }
  .ilist .side { order: 3; display: flex !important; align-items: center; gap: 0; margin: 8px 0 0; font-size: 13.5px; color: var(--mu); text-align: left; }
  .ilist .side b { display: inline; font: 400 13.5px var(--sans); color: var(--mu); margin: 0 0 0 4px; }
  .ilist .side .v { margin: 0; }
  .ilist .side .v::before { content: "\00b7"; margin: 0 8px; }
  .ilist .side .v .ic { display: none; }
  .ilist .acts { order: 4; display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
  .ilist .acts .doi { grid-column: 1 / -1; order: -1; font-size: 13.5px; margin-bottom: 4px; }
  .ilist .acts > a:not(.doi) { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 11px 8px; border: 1.5px solid var(--navy); border-radius: 5px; font-size: 14.5px; font-weight: 600; color: var(--navy); background: #fff; text-decoration: none !important; }
  .ilist .acts > a:first-child { background: var(--navy); color: #fff; }
  .ilist .acts > a:first-child .ic { color: #fff; }
  .ilist .acts > a.abs-tog:only-of-type { grid-column: auto; }
  .ilist .abs { order: 5; margin-top: 12px; }
}

/* article page on phones: publication line under the stats; contents near the top (not 30,000px down); rail boxes trimmed */
@media (max-width: 860px) {
  .ahead .apub { display: block; font-size: 13.5px; color: var(--mu); margin-top: 8px; }
  .mtoc { display: block; margin: 0 0 22px; border: 1px solid var(--rule); border-radius: 8px; background: var(--tint); }
  .mtoc summary { list-style: none; cursor: pointer; padding: 13px 16px; font-weight: 600; font-size: 15px; display: flex; justify-content: space-between; color: var(--ink); }
  .mtoc summary::-webkit-details-marker { display: none; }
  .mtoc summary::after { content: "+"; font-weight: 400; color: var(--mu); }
  .mtoc[open] summary::after { content: "\2212"; }
  .mtoc[open] summary { border-bottom: 1px solid var(--rule); }
  .mtoc .toc { padding: 8px 16px 12px; }
  .mtoc .toc a { padding: 8px 0 8px 12px; font-size: 14.5px; text-decoration: none !important; }
  body .rail .box:has(.toc) { display: none; }
}

@media (max-width: 860px) { .prose .abstract { font-size: 15.5px !important; line-height: 1.62; } }

/* ===== justification (owner, 12 Oct 2026): all running text justified, at every width ===== */
.ph .lead, .sub, .lede, .sec-h p, .steps p, .tline p, .cards p, .sc-d, .faq details p, .note > div, .note p, .pull p,
.helpln p, .rnote, .cta p, .fgrid dd small, .numbered span, .ticks li > div, .prose li, .prose .abstract, .prose p,
.aboutblk p, .ilist .abs, .holdings + p, .dsec p {
  text-align: justify !important; hyphens: auto; -webkit-hyphens: auto;
}
/* reference-type text stays ragged-right: references, citations, tables, chips, affiliations, narrow side boxes */
.refs li, .citebox, .tbl td, .tbl th, .chips span, .sc-tags li, .ilist .af, .ilist .au, .rail .rnote, .rail p, .s-b .fgrid dd,
.relinks li, .kw span, .meta, .by, .toc a, .info dd, .glance dd { text-align: left !important; }
.scope p, .note-line, .libbig p, .holdings p { text-align: justify !important; hyphens: auto; }

/* gated pages (Author dashboard, Certificate) on phones: icon beside the heading, not alone on a row */
@media (max-width: 860px) {
  .gate { grid-template-columns: 40px minmax(0, 1fr) !important; gap: 12px !important; padding: 18px 16px !important; }
  .gate .ic { width: 32px !important; height: 32px !important; margin-top: 2px; }
  .gate .btnrow { display: grid; grid-template-columns: 1fr; gap: 8px; }
}
/* the help line is a short note: never justified */
.helpln p { text-align: left !important; }

/* forms on phones: full-width action buttons, 16px inputs (no iOS zoom) */
@media (max-width: 860px) { .form .acts { display: grid; grid-template-columns: 1fr; } .form .acts .btn, .form .acts button { width: 100%; padding: 13px; } .form input:not([type=checkbox]):not([type=radio]), .form select, .form textarea { font-size: 16px; } .tr-gate .btn { padding: 13px; } }

/* headings inside list items are never justified (fix: the justify rule on .prose li stretched step titles) */
.prose li h3, .prose li b, .tline h3, .numbered b, .steps h3, .prose li strong { text-align: left !important; display: block; }
.tline li > div, .numbered li { text-align: left; }
/* ...except the page range in an issue listing, which follows its column (right on a wide screen, left on a phone) */
.prose .ilist .side b { text-align: inherit !important; }

/* phones: give each section a clear start: wider grey break between sections, a short navy rule above every section heading */
@media (max-width: 860px) {
  .doc .dmain { gap: 14px !important; }
  .doc { background: #e8edf2 !important; }
  .doc .dsec, .doc .dsec:first-child { border-top: 0; border-bottom: 0; }
  .doc .dsec > h2::before, .doc .dsec > .skick + h2::before { content: ""; display: block; width: 36px; height: 3px; background: var(--navy); border-radius: 2px; margin-bottom: 12px; }
  .doc .dsec > .skick { margin-bottom: 4px; }
  .doc .dsec > .skick + h2::before { display: none; }
  .doc .dsec > .skick::before { content: ""; display: block; width: 36px; height: 3px; background: var(--navy); border-radius: 2px; margin-bottom: 12px; }
  .doc .dsec h3.sub3, .doc .dsec > h3 { padding-top: 14px; border-top: 1px solid var(--rule); margin-top: 26px; }
}