/* Shared additions layered on top of each page's inline styles. */
.site-search { flex: 1 1 200px; max-width: 320px; margin: 0; }
.site-search input { width: 100%; padding: 0.5rem 0.85rem; border: 1px solid #d1d5db; border-radius: 999px; font: inherit; font-size: 0.9rem; background: #fff; color: #111827; }
.site-search input:focus { outline: 2px solid #2563eb; outline-offset: 1px; border-color: #2563eb; }
header .header-content { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.symbol-item:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.copy-button:focus-visible, .copy-code:focus-visible { outline: 2px solid #111827; outline-offset: 2px; }
.symbol-meaning { margin-bottom: 1rem; }
.hub-group { margin: 2rem 0; }
.hub-group h2 { margin-bottom: 0.75rem; font-size: 1.35rem; }
.hub-copy-all { background: #2563eb; color: #fff; border: 0; border-radius: 6px; padding: 0.45rem 0.9rem; font: inherit; font-size: 0.875rem; font-weight: 600; cursor: pointer; margin-left: 0.75rem; vertical-align: middle; }
.hub-copy-all:hover { background: #1d4ed8; }
.symbols-grid.long-items { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.long-items .symbol-char { font-size: 1.15rem; overflow-wrap: anywhere; }
.hub-faq { margin: 2.5rem 0; }
.hub-faq h3 { margin: 1rem 0 0.25rem; font-size: 1.05rem; }
.hub-copy { margin: 2.5rem 0; }
.hub-copy h2 { margin: 1.75rem 0 0.5rem; font-size: 1.3rem; }
.hub-copy ul { margin: 0.5rem 0 0.5rem 1.25rem; }
.hub-copy code { background: #f3f4f6; padding: 0.1rem 0.3rem; border-radius: 4px; white-space: pre-wrap; }
.more-sets { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.75rem; margin: 1rem 0 2rem; }
.more-sets a { display: block; padding: 0.85rem 1rem; border: 1px solid #e5e7eb; border-radius: 8px; text-decoration: none; color: #111827; background: #fff; }
.more-sets a:hover { border-color: #2563eb; }
.more-sets .set-preview { display: block; font-size: 1.15rem; margin-bottom: 0.2rem; }
.more-sets .set-name { font-size: 0.9rem; font-weight: 600; }
@media (max-width: 540px) { .site-search { order: 3; flex-basis: 100%; max-width: none; } }
@media (max-width: 640px) { table { display: block; max-width: 100%; overflow-x: auto; } }
