
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: #ffffff;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #000;
}

.fff-page {
  max-width: 900px;
  margin: 0 auto;
  background: #fff;
  overflow-x: hidden;
}

.fff-page-h1 {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* Header */
.fff-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 6px 10px 4px;
  border-bottom: 1px solid #ccc;
}
.fff-logo-img { display: block; max-height: 60px; }
.fff-header-right { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.fff-site-title { font-size: 13px; font-weight: bold; }
.fff-site-title a { color: #000; text-decoration: none; }
.fff-site-tagline { font-size: 10px; color: #666; }
.fff-nav-imgs { display: flex; gap: 4px; margin-top: 3px; }
.fff-nav-img-btn { display: block; }
.fff-nav-img-btn img { display: block; }
.fff-nav-img-btn:hover { opacity: 0.8; }

/* Welcome bar */
.fff-welcome-bar {
  background: #dce8f8;
  border-bottom: 1px solid #aabbd8;
  padding: 2px 10px;
  font-size: 10px;
  color: #333;
  display: flex;
  align-items: center;
  gap: 6px;
}
.fff-archive-note { color: #888; font-style: italic; margin-left: auto; }

/* Pinned admin notice */
.fff-pinned-notice {
  background: #fffbe6;
  border: 1px solid #e6c84a;
  border-left: 4px solid #e6a800;
  padding: 8px 12px;
  margin: 8px 0;
  font-size: 11px;
  color: #333;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.fff-pinned-label {
  font-weight: bold;
  color: #7a5000;
  white-space: nowrap;
}
.fff-pinned-text { flex: 1; }
.fff-pinned-link {
  color: #cc0000;
  font-weight: bold;
  white-space: nowrap;
  text-decoration: none;
}
.fff-pinned-link:hover { text-decoration: underline; }

/* Breadcrumb */
.fff-breadcrumb {
  background: #f0f0f0;
  border-bottom: 1px solid #ccc;
  padding: 2px 8px;
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
  color: #333;
}
.fff-breadcrumb a { color: #000080; }
.fff-breadcrumb a:hover { color: #cc0000; }
.fff-bsep { color: #888; font-size: 13px; }
.fff-nav-img { display: block; flex-shrink: 0; }

/* Links */
a { color: #000080; }
a:hover { color: #cc0000; }

/* Tables */
.fff-table {
  width: calc(100% - 16px);
  margin: 6px 8px;
  border-collapse: separate;
  border-spacing: 1px;
  background: #8a90a8;
  font-size: 11px;
  table-layout: fixed;
}
.fff-cat-header {
  background-color: #6878a0;
  background-image: url('/fff-data/skin/catcell.jpg');
  background-repeat: repeat-x;
  background-size: auto 100%;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  padding: 4px 8px;
  text-align: left;
}
.fff-col-header th {
  background-color: #505878;
  background-image: url('/fff-data/skin/topcell.jpg');
  background-repeat: repeat-x;
  background-size: auto 100%;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  padding: 2px 6px;
  text-align: left;
}
.fff-col-num  { width: 55px; text-align: center; }
.fff-col-last { width: 155px; }
.fff-col-author { width: 90px; }

/* Forum index rows */
.fff-forum-row td { background: #fff; padding: 4px 7px; vertical-align: top; }
.fff-forum-row:nth-child(even) td { background: #efefef; }
.fff-forum-name-cell { display: flex; align-items: flex-start; gap: 7px; }
.fff-forum-icon-img { flex-shrink: 0; display: block; margin-top: 2px; }
.fff-forum-text { flex: 1; }
.fff-forum-link { font-size: 11px; font-weight: bold; }
.fff-forum-desc { font-size: 10px; color: #555; margin-top: 1px; }
.fff-forum-active { font-size: 10px; color: #777; margin-top: 1px; }

/* Numbers */
.fff-num { text-align: center; color: #333; vertical-align: middle; }

/* Last post */
.fff-last { font-size: 10px; vertical-align: top; }
.fff-last-topic-link { color: #cc3030; font-size: 10px; margin-bottom: 1px; }
.fff-last-date { color: #cc3030; margin-bottom: 1px; }
.fff-last-by { color: #cc3030; font-size: 10px; }
.fff-last-none { color: #999; font-style: italic; font-size: 10px; }

/* Topic rows */
.fff-topic-row td { background: #fff; padding: 3px 7px; vertical-align: middle; }
.fff-topic-row:nth-child(even) td { background: #efefef; }
.fff-topic-pinned td { background: #fffadc !important; }
.fff-topic-name-cell { display: flex; align-items: flex-start; gap: 5px; }
.fff-topic-icon-wrap { flex-shrink: 0; display: block; margin-top: 1px; }
.fff-topic-icon-wrap img { display: block; }
.fff-topic-text { flex: 1; }
.fff-topic-link { font-size: 11px; font-weight: bold; }
.fff-topic-sub { font-size: 10px; color: #666; font-style: italic; margin-top: 1px; }
.fff-author { font-size: 10px; color: #333; vertical-align: middle; }

/* Post rows */
.fff-post-row td { background: #fff; vertical-align: top; border-bottom: 1px solid #8a90a8; }
.fff-post-row:nth-child(even) td { background: #f4f4f8; }
.fff-post-author-col {
  width: 130px; padding: 6px 8px; text-align: center;
  border-right: 1px solid #8a90a8;
  background: #efefef !important; font-size: 11px;
}
.fff-post-member-name { font-size: 12px; font-weight: bold; color: #000080; word-break: break-word; margin-bottom: 2px; }
.fff-post-rank { font-size: 10px; color: #555; font-style: italic; margin-bottom: 4px; }
.fff-post-avatar { margin: 4px auto; }
.fff-avatar-img { max-width: 80px; max-height: 80px; display: block; margin: 0 auto; }
.fff-post-postcount { font-size: 10px; color: #666; margin-top: 4px; }
.fff-post-location { font-size: 10px; color: #888; margin-top: 2px; }
.fff-post-body-col { padding: 5px 10px; max-width: 0; overflow-wrap: break-word; word-break: break-word; }
.fff-post-meta {
  display: flex; justify-content: space-between;
  font-size: 10px; color: #666;
  border-bottom: 1px dotted #8a90a8;
  padding-bottom: 3px; margin-bottom: 6px;
}
.fff-post-num { font-weight: bold; color: #505878; }
.fff-post-body { font-size: 11px; line-height: 1.5; color: #000; word-break: break-word; }
.fff-post-body img { max-width: 100%; height: auto; }
.fff-post-body .post-quote {
  background: #e8e8f8; border-left: 3px solid #6878a0;
  padding: 4px 8px; margin: 6px 0; font-size: 10px; color: #333;
}
.fff-post-sig { margin-top: 10px; font-size: 10px; color: #666; }
.fff-sig-hr { border: none; border-top: 1px dashed #8a90a8; margin: 4px 0; }

/* Poll */
.fff-poll { margin: 6px 8px; background: #fffbe6; border: 1px solid #c8a000; font-size: 11px; }
.fff-poll-header {
  background-color: #6878a0;
  background-image: url('/fff-data/skin/catcell.jpg');
  background-repeat: repeat-x; background-size: auto 100%;
  color: #fff; font-weight: bold; padding: 3px 8px;
}
.fff-poll-options { padding: 6px 10px; display: flex; flex-direction: column; gap: 3px; }
.fff-poll-note { font-size: 10px; color: #888; padding: 2px 10px 6px; font-style: italic; }

/* Thread subtitle */
.fff-thread-sub { font-weight: normal; font-size: 10px; color: #d8e0ff; }

/* Member rows */
.fff-member-row td { background: #fff; padding: 3px 7px; }
.fff-member-row:nth-child(even) td { background: #efefef; }
.fff-member-name { font-weight: bold; color: #000080; }

/* Stats row */
.fff-stats-row td { background: #fff; padding: 5px 8px; font-size: 10px; color: #555; }
.fff-stats-icon { vertical-align: middle; margin-right: 4px; }

/* Bar row */
.fff-bar-row { display: flex; align-items: center; margin: 0 8px 8px; min-height: 16px; }
.fff-bar-left, .fff-bar-right { display: block; flex-shrink: 0; }
.fff-bar-mid {
  flex: 1;
  background-image: url('/fff-data/skin/bar.gif');
  background-repeat: repeat-x; background-color: #6878a0;
  background-size: auto 100%; color: #fff;
  font-size: 10px; padding: 1px 6px;
  min-height: 16px; display: flex; align-items: center;
}

/* Empty */
.fff-empty { background: #f8f8f8 !important; padding: 12px !important; text-align: center; color: #888; font-style: italic; }
