.hpp-cite {
  margin-block: 2.5rem 1.5rem;
  padding: clamp(1rem, 3vw, 1.6rem);
  border: 1px solid var(--theme-border-color, #d7dce2);
  border-radius: 10px;
  background: var(--theme-palette-color-8, #f7f8fa);
  color: var(--theme-text-color, inherit);
  font-size: .95em;
  line-height: 1.65;
}
.hpp-cite h2 { font-size: clamp(1.2rem, 2vw, 1.4rem); margin: 0 0 .1rem; }
.hpp-cite-pub { color: var(--theme-text-color, #4b5563); opacity: .76; font-size: .85em; margin: 0 0 1rem; }
.hpp-cite-label { display: block; font-weight: 600; margin-bottom: .3rem; }
.hpp-cite-select { display: block; width: 100%; max-width: 430px; min-height: 42px; padding: .5rem .65rem; border: 1px solid #aeb8c4; background: #fff; color: #1b2430; border-radius: 6px; font: inherit; }
.hpp-cite-panel { margin-top: 1.2rem; }
.hpp-cite-panel[hidden] { display: none !important; }
.hpp-cite-entry + .hpp-cite-entry { border-top: 1px solid var(--theme-border-color, #d7dce2); padding-top: 1rem; margin-top: 1.3rem; }
.hpp-cite-entry-title { margin: 0 0 .3rem; font-size: 1em; font-weight: 650; }
.hpp-cite-output { margin: .4rem 0 .85rem; overflow-wrap: anywhere; }
.hpp-cite-output a { text-decoration: underline; text-underline-offset: 2px; }
.hpp-cite-copy { cursor: pointer; min-height: 38px; padding: .4rem 1rem; border: 1px solid currentColor; border-radius: 6px; background: transparent; color: inherit; font: inherit; font-weight: 600; }
.hpp-cite-copy:hover { background: rgba(115, 125, 135, .1); }
.hpp-cite-copy:focus-visible, .hpp-cite-select:focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
.hpp-cite-status { font-size: .85em; margin: .6rem 0 0; min-height: 1em; }
@media print { .hpp-cite-select, .hpp-cite-label, .hpp-cite-copy, .hpp-cite-status { display: none !important; } .hpp-cite { border: 1px solid #bbb; background: transparent; } }