.article-utility-rail {
  position:fixed;
  z-index:55;
  left:0;
  bottom:18px;
  display:grid;
  gap:8px;
  pointer-events:none;
}

.article-utility-tab {
  --utility-bg:#11110f;
  --utility-fg:#f2efe8;
  appearance:none;
  width:188px;
  min-height:48px;
  padding:0 0 0 17px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px;
  align-items:center;
  gap:10px;
  border:1px solid rgba(17,17,15,.22);
  border-left:0;
  border-radius:0 13px 13px 0;
  background:var(--utility-bg);
  color:var(--utility-fg);
  box-shadow:0 9px 24px rgba(17,17,15,.18);
  font:700 11px/1.1 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  letter-spacing:.065em;
  text-decoration:none;
  text-transform:uppercase;
  cursor:pointer;
  pointer-events:auto;
  transform:translateX(calc(-100% + 48px));
  transition:transform .22s ease,box-shadow .22s ease;
}

.article-utility-tab:hover,
.article-utility-tab:focus-visible,
.article-utility-tab.is-open {
  z-index:1;
  outline:none;
  box-shadow:0 13px 32px rgba(17,17,15,.25);
  transform:translateX(0);
}

.article-utility-tab:focus-visible {
  outline:3px solid #11110f;
  outline-offset:3px;
}

.article-utility-tab span {
  overflow:hidden;
  white-space:nowrap;
}

.article-utility-tab svg {
  width:23px;
  height:23px;
  justify-self:center;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.article-utility-rail .visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

.article-utility-tab--share {
  --utility-bg:#d8ff57;
  --utility-fg:#11110f;
}

.article-utility-tab--rss {
  --utility-bg:#ff826d;
  --utility-fg:#11110f;
}

.article-utility-tab--settings {
  --utility-bg:#7358ff;
  --utility-fg:#fff;
}

html.article-utility-active .pp-privacy__settings,
html.portfolio-utility-active .pp-privacy__settings {
  display:none!important;
}

.article-rss-dialog {
  width:min(640px,calc(100vw - 32px));
  max-height:calc(100vh - 32px);
  padding:0;
  overflow:auto;
  border:1px solid rgba(17,17,15,.45);
  border-radius:24px;
  background:#f2efe8;
  color:#11110f;
  box-shadow:0 30px 90px rgba(17,17,15,.38);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}

.article-rss-dialog::backdrop {
  background:rgba(17,17,15,.62);
  backdrop-filter:blur(5px);
}

.article-rss-dialog__panel {
  position:relative;
  padding:clamp(26px,5vw,46px);
}

.article-rss-dialog__close {
  appearance:none;
  position:absolute;
  top:16px;
  right:16px;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid #11110f;
  border-radius:50%;
  background:transparent;
  color:#11110f;
  font:400 27px/1 Georgia,"Times New Roman",serif;
  cursor:pointer;
}

.article-rss-dialog__close:hover,
.article-rss-dialog__close:focus-visible {
  background:#11110f;
  color:#f2efe8;
  outline:none;
}

.article-rss-dialog__eyebrow {
  display:inline-block;
  margin:0 58px 18px 0;
  padding:6px 9px;
  background:#ff826d;
  font-size:10px;
  font-weight:850;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.article-rss-dialog h2 {
  max-width:540px;
  margin:0;
  font-size:clamp(31px,5vw,48px);
  line-height:.98;
  letter-spacing:-.045em;
}

.article-rss-dialog__panel > p {
  max-width:540px;
  margin:20px 0 0;
  color:#6d6a63;
  font:17px/1.5 Georgia,"Times New Roman",serif;
}

.article-rss-dialog__address {
  margin-top:26px;
  padding:14px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  border:1px solid rgba(17,17,15,.24);
  border-radius:17px;
  background:#e8e2d8;
}

.article-rss-dialog__address code {
  min-width:0;
  overflow-wrap:anywhere;
  font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

.article-rss-dialog__address button {
  appearance:none;
  min-height:48px;
  padding:0 16px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  border:1px solid #11110f;
  border-radius:999px;
  background:#d8ff57;
  color:#11110f;
  font:800 10px/1 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}

.article-rss-dialog__address button:hover,
.article-rss-dialog__address button:focus-visible {
  box-shadow:4px 4px 0 #7358ff;
  outline:none;
  transform:translate(-2px,-2px);
}

.article-rss-dialog__address svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.article-rss-dialog__foot {
  min-height:36px;
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:#6d6a63;
  font-size:11px;
}

.article-rss-dialog__foot p {
  margin:0;
}

.article-rss-dialog__foot a {
  flex:none;
  color:#11110f;
  font-weight:750;
  text-underline-offset:3px;
}

@media (max-width:700px) {
  .article-utility-rail {
    bottom:10px;
    gap:6px;
  }

  .article-utility-tab {
    width:174px;
    min-height:46px;
    grid-template-columns:minmax(0,1fr) 46px;
    transform:translateX(calc(-100% + 46px));
  }

  .article-rss-dialog {
    width:calc(100vw - 20px);
    max-height:calc(100vh - 20px);
    border-radius:20px;
  }

  .article-rss-dialog__panel {
    padding:24px 20px;
  }

  .article-rss-dialog__address {
    grid-template-columns:1fr;
  }

  .article-rss-dialog__address button {
    justify-content:center;
  }

  .article-rss-dialog__foot {
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (prefers-reduced-motion:reduce) {
  .article-utility-tab,
  .article-rss-dialog__address button {
    transition:none;
  }
}
