/* Homepage top banner stays in document flow; it never covers navigation or content. */
.bookmark-strip{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 16px;width:100%;box-sizing:border-box;margin:0;padding:2px 20px;background:#e4f3f0;border-bottom:1px solid #cce8e5;color:var(--teal-dark);text-align:center}
.bookmark-strip strong{font-size:.875rem;font-weight:500;line-height:1.5}
.bookmark-actions{display:flex;align-items:center}
.bookmark-actions button{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;border:0;background:none;color:var(--teal-dark);font:inherit;font-size:.875rem;font-weight:600;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.bookmark-actions button:focus-visible{outline:2px solid var(--teal-dark);outline-offset:1px;border-radius:2px}
#bookmark-help{flex-basis:100%;max-width:760px;text-align:left;border-top:1px solid #cce8e5;padding:10px 0}
.bookmark-strip #bookmark-help p{font-size:.875rem;line-height:1.65;margin:0 0 6px;color:var(--body)}
.bookmark-strip #bookmark-help p:last-child{margin-bottom:0}
@media(max-width:600px){.bookmark-strip{padding:2px 12px;gap:0 10px}.bookmark-strip strong,.bookmark-actions button{font-size:.8125rem}}

.bookmark-shortcut{display:none}
@media(min-width:601px) and (hover:hover) and (pointer:fine){
  .bookmark-strip{min-height:32px;padding:5px 20px;gap:0 10px;background:#f2f7f6;border-bottom-color:#e6efed;color:#576d69}
  .bookmark-strip strong{font-size:.8125rem;font-weight:400;line-height:21px}
  .bookmark-strip strong::before{content:"☆";margin-right:7px;color:#718b85}
  .bookmark-shortcut{display:inline-flex;align-items:center;gap:10px;font-size:.8125rem;line-height:21px}
  .bookmark-shortcut kbd{font:inherit;color:inherit}
  .bookmark-actions,#bookmark-help{display:none}
}