/* Shared stylesheet used by every generated html page. */
body { font-family: Arial, sans-serif; margin: 40px; }
h1 { color: #333; margin-bottom: 4px; }
h2 { color: #333; margin-top: 40px; }
a.back { display: inline-block; margin-bottom: 16px; color: #555; text-decoration: none; }
a.back:hover { text-decoration: underline; }
.page-indicator { color: #777; margin: 0 0 20px 0; font-size: 14px; }
.link-item { display: block; margin: 6px 0; color: #0645ad; text-decoration: none; word-break: break-all; }
.link-item:hover { text-decoration: underline; }
.pagination { display: flex; align-items: center; gap: 16px; margin-top: 28px; }
.page-btn { padding: 8px 14px; background: #f0f4ff; color: #0645ad; text-decoration: none; border-radius: 6px; font-size: 14px; }
.page-btn:hover { background: #dbe6ff; }
.page-btn.disabled { color: #aaa; background: #f2f2f2; cursor: default; }
.page-info { color: #555; font-size: 14px; }
/* Landing page only */
body.landing { max-width: 720px; }
.search-box { position: relative; margin-top: 12px; }
#search-input { width: 100%; box-sizing: border-box; padding: 10px 12px; font-size: 16px; border: 1px solid #ccc; border-radius: 6px; }
#suggestions { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #ccc; border-top: none; border-radius: 0 0 6px 6px; max-height: 260px; overflow-y: auto; z-index: 10; }
.suggestion-item { padding: 8px 12px; cursor: pointer; }
.suggestion-item:hover { background: #f0f4ff; }
.suggestion-empty { padding: 8px 12px; color: #888; }
#top-words { display: flex; flex-wrap: wrap; gap: 8px; }
.word-item { display: inline-block; padding: 6px 12px; background: #f0f4ff; color: #0645ad; text-decoration: none; border-radius: 16px; font-size: 14px; }
.word-item:hover { background: #dbe6ff; }