/* JAPTAP series section. Palette matched to the figures in the series. */
:root{
  --surf:#fcfcfb; --paper:#ffffff; --ink:#111110; --ink2:#4a4945; --ink3:#86847d;
  --rule:#e3e0d8; --navy:#0d366b; --navy-d:#001e51; --gold:#c9a227; --gold-d:#8a6d3b;
  --box:#fbf7ec; --flag:#8a3a12; --focus:#1c5cab;
  --serif:Georgia,"Liberation Serif","Times New Roman",serif;
  --sans:"Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif;
  --measure:38rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surf);color:var(--ink);font:400 1.0625rem/1.65 var(--serif)}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--paper);padding:.6rem 1rem;border:2px solid var(--navy)}

/* ---------- masthead and nav ---------- */
.masthead{background:var(--paper);border-bottom:1px solid var(--rule)}
.bar{max-width:64rem;margin:0 auto;padding:.85rem 1.25rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.brand{font:700 1.05rem/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand span{display:block;font-weight:400;font-size:.66rem;letter-spacing:.16em;color:var(--ink3);margin-top:.3rem}
nav{margin-left:auto}
nav ul{list-style:none;display:flex;align-items:center;gap:.35rem;margin:0;padding:0;flex-wrap:wrap}
nav a,nav summary{font:600 .8rem/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);text-decoration:none;padding:.55rem .65rem;display:block;border-radius:3px;cursor:pointer}
nav a:hover,nav summary:hover{color:var(--ink);background:#f2efe8}
nav a[aria-current="page"]{color:var(--navy-d);box-shadow:inset 0 -2px 0 var(--gold)}
details.menu{position:relative}
details.menu>summary{list-style:none}
details.menu>summary::-webkit-details-marker{display:none}
details.menu>summary::after{content:"";display:inline-block;margin-left:.4em;border:.3em solid transparent;border-top-color:currentColor;transform:translateY(.15em)}
details.menu[open]>summary{color:var(--ink);background:#f2efe8}
.menu-panel{position:absolute;right:0;top:calc(100% + .35rem);min-width:19rem;background:var(--paper);
  border:1px solid var(--rule);border-top:3px solid var(--gold);box-shadow:0 10px 28px rgba(0,0,0,.10);
  padding:.4rem;z-index:50}
.menu-panel ol{list-style:none;margin:0;padding:0;display:block}
.menu-panel a{text-transform:none;letter-spacing:0;font:400 .95rem/1.35 var(--serif);color:var(--ink);padding:.5rem .7rem}
.menu-panel a small{display:block;font:600 .64rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.25rem}
.menu-panel a:hover{background:#f6f3ec}
.menu-panel .sep{border-top:1px solid var(--rule);margin:.35rem .5rem}
@media (max-width:52rem){
  .bar{padding:.75rem 1rem}
  nav{margin-left:0;width:100%}
  nav ul{gap:.15rem}
  .menu-panel{position:static;min-width:0;box-shadow:none;margin:.3rem 0 .5rem}
}

/* ---------- article ---------- */
main{max-width:64rem;margin:0 auto;padding:0 1.25rem 4rem}
.wrap{max-width:var(--measure);margin:0 auto}
.eyebrow{font:700 .7rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-d);margin:2.75rem 0 .75rem}
h1{font:700 2.15rem/1.15 var(--serif);margin:0 0 .6rem;letter-spacing:-.01em}
.standfirst{font:italic 400 1.2rem/1.5 var(--serif);color:var(--ink2);margin:0 0 1.35rem}
.hr{border:0;border-top:1px solid var(--rule);margin:0 0 1.9rem}
article p{margin:0 0 1.15rem}
article p:first-of-type::first-letter{font-size:1.02em}
figure{margin:2rem 0 2.25rem}
figure img{border:1px solid var(--rule);background:#fff;margin-inline:auto}
figcaption{font:italic 400 .85rem/1.45 var(--sans);color:var(--ink3);text-align:center;margin-top:.6rem}

/* ---------- platform box ---------- */
.point{border:2px solid var(--gold);background:var(--box);padding:1.5rem 1.6rem;margin:2.5rem 0 1rem}
.point h2{font:700 .8rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--flag);margin:0 0 1rem}
.point dl{margin:0}
.point dt{font:700 .86rem/1.4 var(--sans);color:var(--ink);margin:0 0 .3rem}
.point dd{margin:0 0 1rem;font-size:.99rem;color:#2a2a2a}
.point dd:last-child{margin-bottom:0}
.point-note{font:italic 400 .78rem/1.45 var(--sans);color:#9b9890;margin:.5rem 0 0}

/* ---------- pager ---------- */
.pager{display:flex;gap:1rem;justify-content:space-between;margin:3rem 0 0;padding-top:1.5rem;border-top:1px solid var(--rule)}
.pager a{flex:1 1 0;text-decoration:none;color:var(--ink);font:400 1rem/1.35 var(--serif);text-transform:none;letter-spacing:normal;padding:.9rem 1rem;border:1px solid var(--rule);background:var(--paper)}
.pager a:hover{border-color:var(--gold)}
.pager a small{display:block;font:600 .64rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:.35rem}
.pager .next{text-align:right}
.pager .spacer{flex:1 1 0}

/* ---------- series index ---------- */
.lede{font:400 1.2rem/1.6 var(--serif);color:var(--ink2);margin:0 0 2rem}
.toc{list-style:none;margin:2rem 0 0;padding:0;counter-reset:none}
.toc li{border-top:1px solid var(--rule)}
.toc li:last-child{border-bottom:1px solid var(--rule)}
.toc a{display:grid;grid-template-columns:7.5rem 1fr;gap:1.25rem;align-items:baseline;padding:1.15rem .25rem;text-decoration:none;color:var(--ink)}
.toc a:hover{background:#f6f3ec}
.toc .n{font:700 .68rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d)}
.toc .t{font:700 1.15rem/1.3 var(--serif)}
.toc .d{grid-column:2;font:400 .95rem/1.5 var(--serif);color:var(--ink2);margin-top:.3rem}
.toc .p{grid-column:2;font:600 .66rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--flag);margin-top:.55rem}
@media (max-width:40rem){
  .toc a{grid-template-columns:1fr;gap:.2rem}
  .toc .d,.toc .p{grid-column:1}
  h1{font-size:1.75rem}
}

/* ---------- appendix ---------- */
table.appendix{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:1.5rem}
table.appendix th{text-align:left;font:700 .68rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;
  background:#f0ede6;padding:.7rem .8rem;border-bottom:1px solid var(--rule)}
table.appendix td{padding:.85rem .8rem;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.5}
table.appendix td:first-child{font-weight:700;width:10rem}
table.appendix td:last-child{color:var(--ink2);font-size:.86rem;width:14rem}
@media (max-width:46rem){
  table.appendix,table.appendix tbody,table.appendix tr,table.appendix td{display:block;width:auto}
  table.appendix thead{display:none}
  table.appendix tr{border-bottom:1px solid var(--rule);padding:.9rem 0}
  table.appendix td{border:0;padding:.2rem 0}
  table.appendix td:first-child,table.appendix td:last-child{width:auto}
  table.appendix td:last-child::before{content:"Source: ";font-weight:700}
}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);background:var(--paper);margin-top:3rem}
footer .bar{display:block;padding:2rem 1.25rem 2.5rem;font:400 .88rem/1.6 var(--sans);color:var(--ink3)}
footer a{color:var(--ink2)}

@media print{
  .masthead,.pager,footer,.skip{display:none}
  body{background:#fff;font-size:11pt}
  main{max-width:none;padding:0}
  .point{break-inside:avoid}
  figure{break-inside:avoid}
}
