/* The Institute's own, taken from the Class-B note: kelp vellum, intaglio
   ink, a purple that only ever appears as a countersignature. Nothing here
   is borrowed from the Gazette — the paper is newsprint and a joke about
   newspapers; the Institute is a body that issues instruments. */

:root{
  --bone:#E7EFE9;
  --ink:#12332C;
  --soft:#4E6A63;
  --rule:#A9C3B8;
  --stamp:#5B3A8E;
  --serif:"Spectral","Petrona",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--bone);
  color:var(--ink);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.62;
  padding:0 24px 120px;
}
main,.plate,footer{max-width:640px;margin:0 auto}

.plate{padding:72px 0 40px}
.name{
  font-size:26px;
  letter-spacing:.02em;
  text-decoration:none;
  color:inherit;
  display:flex;
  align-items:center;
  gap:20px;
}
.name .seal{width:84px;height:84px;flex:none;display:block}
.name span{display:block;line-height:1.25}
.name small,.est{
  display:block;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:8px;
}

nav{margin-top:34px;border-top:1px solid var(--rule);padding-top:12px}
nav a{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  text-decoration:none;
  margin-right:26px;
}
nav a.on{color:var(--ink)}

main{padding-top:16px}
h1{font-size:30px;font-weight:400;line-height:1.2;margin:0 0 18px}
p{margin:0 0 18px;max-width:58ch}
.lede{color:var(--soft)}
.more{margin-top:44px}
a{color:inherit}

/* The refusal. It is set as a bar because the Institute is not being
   coy — it is occupying the space where the answer would be. */
.redact{
  display:inline-block;
  background:var(--ink);
  color:var(--bone);
  padding:2px 9px 3px;
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.06em;
}
.nobody{margin:26px 0 34px}

.standing{border:1px solid var(--ink);padding:24px 26px;margin:40px 0 0}
.standing .k{
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--soft);margin:0;
}
.standing .big{font-size:52px;line-height:1;margin:6px 0 12px}
.standing .sub{margin:0;color:var(--soft);font-size:16px}

table.probs{width:100%;border-collapse:collapse;margin-top:8px}
table.probs th,table.probs td{
  text-align:left;font-weight:400;vertical-align:top;
  padding:14px 0;border-bottom:1px solid var(--rule);
}
table.probs th{
  width:9.5em;font-family:var(--mono);font-size:12px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--soft);
  padding-top:17px;
}
table.probs td.st{
  width:9em;text-align:right;font-family:var(--mono);
  font-size:12px;color:var(--soft);
}

.num{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--soft);margin-bottom:10px;
}
.status{font-family:var(--mono);font-size:12px;color:var(--soft);margin-bottom:30px}
.attrib{color:var(--soft);font-size:16px;margin-top:34px}
.note{
  border-left:2px solid var(--rule);padding-left:18px;
  color:var(--soft);font-size:16px;
}
footer{
  margin-top:96px;padding-top:16px;border-top:1px solid var(--rule);
}
footer p{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  color:var(--soft);margin:0;
}
@media (max-width:560px){
  .plate{padding-top:44px}
  .name{font-size:22px;gap:14px}
  .name .seal{width:64px;height:64px}
  table.probs th{width:auto;display:block;border:0;padding-bottom:0}
  table.probs td{display:block;border:0;padding-top:4px}
  table.probs td.st{text-align:left;border-bottom:1px solid var(--rule);padding-bottom:14px}
}

/* Fields the Determinations brought with them. */
.warn{
  border:1px solid var(--ink);
  padding:16px 18px;
  margin:0 0 30px;
  font-size:16px;
}
.warn b{
  display:block;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  margin-bottom:8px;
  font-weight:400;
}
.meta{
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--soft);
  margin:0 0 4px;
}
.meta:last-of-type{margin-bottom:30px}
.directive{
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding:18px 0;
  margin:34px 0;
  font-size:16px;
  color:var(--soft);
}
.sponsor{font-size:15px;color:var(--soft);font-style:italic}
.offprint{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.instrument{
  border:1px double var(--ink);
  padding:26px 28px;
  margin:44px 0 0;
}
.instrument .portrait{
  display:block;
  width:200px;
  height:auto;
  margin:0 auto 18px;
}
.instrument .denom{
  font-family:var(--mono);
  letter-spacing:.42em;
  font-size:22px;
  margin:0 0 14px;
}
.instrument p{font-size:16px;margin:0 0 12px}
.instrument .sigs{color:var(--stamp);font-style:italic}
/* The impression rides up beside the signatures it countersigns, and the
   clauses that follow set round it, the way type sets round a stamp. */
.instrument .stamp{
  float:right;
  width:132px;
  height:auto;
  margin:-58px -10px 4px 20px;
  shape-outside:circle(50%);
}
.instrument::after{content:"";display:block;clear:both}
.offprint .imprint{
  width:19px;
  height:19px;
  vertical-align:-4px;
  margin-right:9px;
}
@media (max-width:560px){
  .instrument .stamp{width:96px;margin:-40px 0 4px 14px}
}