/* 面经分享 / 面试陪练 */
.ib-page { max-width: 880px; margin: 0 auto; }
.ib-hero {
  padding: 8px 0 18px;
  border-bottom: 1px solid var(--line, #e6eaee);
  margin-bottom: 18px;
}
.ib-hero h2 { font-size: 22px; margin: 0 0 6px; color: var(--ink, #1a1b1c); }
.ib-hero p { margin: 0; color: var(--ink2, #5b6470); font-size: 14px; line-height: 1.6; }
.ib-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.ib-tab {
  border: 1px solid var(--line, #e6eaee);
  background: #fff;
  color: var(--ink2, #5b6470);
  padding: 8px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
}
.ib-tab.active {
  border-color: #00BEBD;
  color: #009a99;
  background: #eefbfa;
  font-weight: 600;
}
.ib-panel { display: none; }
.ib-panel.active { display: block; }
.ib-form .field { margin-bottom: 12px; }
.ib-form label { display: block; font-size: 13px; color: var(--ink2, #5b6470); margin-bottom: 4px; }
.ib-form input, .ib-form textarea, .ib-form select {
  width: 100%;
  border: 1px solid var(--line, #e6eaee);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  background: #fff;
  box-sizing: border-box;
}
.ib-form textarea { min-height: 88px; resize: vertical; }
.ib-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ib-chip {
  border: 1px solid var(--line, #e6eaee);
  background: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  cursor: pointer;
  color: var(--ink2, #5b6470);
}
.ib-chip.on { border-color: #00BEBD; background: #eefbfa; color: #009a99; }
.ib-q-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.ib-q-item {
  border: 1px solid var(--line, #e6eaee);
  border-radius: 10px;
  padding: 12px;
  background: #fbfdfd;
}
.ib-q-item .ib-q-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-size: 13px;
  color: var(--ink2, #5b6470);
}
.ib-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.ib-agree {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 12.5px;
  color: var(--ink2, #5b6470);
  line-height: 1.5;
  margin-top: 10px;
}
.ib-agree input { margin-top: 3px; }
.ib-flags {
  margin-top: 12px;
  padding: 12px;
  border-radius: 10px;
  background: #fdf4ec;
  border: 1px solid #f3d9bd;
  font-size: 13px;
  color: #8a5a20;
}
.ib-flags li { margin: 4px 0 4px 16px; }
.ib-list { display: flex; flex-direction: column; gap: 10px; }
.ib-card {
  border-top: 1px solid var(--line, #e6eaee);
  padding: 14px 0;
}
.ib-card:first-child { border-top: none; padding-top: 4px; }
.ib-card-title { font-weight: 700; font-size: 15px; margin-bottom: 4px; }
.ib-card-meta { font-size: 12.5px; color: var(--ink3, #8a93a0); margin-bottom: 6px; }
.ib-status {
  display: inline-block;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 600;
}
.ib-status.pending { background: #fdf3e4; color: #d98a1c; }
.ib-status.approved { background: #e5f6ee; color: #2fa869; }
.ib-status.rejected { background: #fdeaea; color: #d64545; }
.ib-status.removed { background: #eef1f4; color: #5b6470; }
.ib-practice-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 14px;
}
.ib-practice-toolbar select {
  border: 1px solid var(--line, #e6eaee);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
}
.ib-q-result {
  border-top: 1px solid var(--line, #e6eaee);
  padding: 14px 0;
}
.ib-q-result .cat {
  font-size: 12px;
  color: #009a99;
  font-weight: 600;
  margin-bottom: 4px;
}
.ib-q-result .q { font-size: 15px; font-weight: 600; margin-bottom: 6px; color: var(--ink, #1a1b1c); }
.ib-q-result .meta { font-size: 13px; color: var(--ink2, #5b6470); line-height: 1.55; }
.ib-empty { color: var(--ink3, #8a93a0); font-size: 14px; padding: 24px 0; text-align: center; }
.ib-home-entry {
  margin: 14px 0 0;
  padding: 14px 0 4px;
  border-top: 1px solid var(--line, #e6eaee);
}
.ib-home-entry .row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.ib-home-entry .tip { font-size: 13px; color: var(--ink2, #5b6470); flex: 1; min-width: 180px; }
@media (max-width: 720px) {
  .ib-hero h2 { font-size: 19px; }
}