/* WoW PRIME 2026-10-30 — «Идеи и предложения» (ideas.html) и «Известные баги» (bugs.html).
   Только классы fb-*; общие кнопки, карточки, поиск и метки — из main.css и pages.css. */

.fb-wrap{display:flex;flex-direction:column;gap:18px}
.fb-wrap a:not([class]){color:var(--cy-soft)}

/* заметки и сообщения */
.fb-note{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border-radius:14px;font-size:14px;line-height:1.6;color:var(--body);background:rgba(90,216,255,.07);border:1px solid rgba(90,216,255,.28)}
.fb-note b{color:var(--head)}
.fb-note a{font-weight:600;color:var(--cy-soft)}
.fb-note.is-ok{background:rgba(70,224,138,.08);border-color:rgba(70,224,138,.38);color:var(--ok-soft)}
.fb-note.is-warn{background:rgba(255,107,107,.07);border-color:rgba(255,107,107,.32);color:#FFC2C2}

/* загрузка */
.fb-loading{display:flex;justify-content:center;gap:10px;padding:48px 20px}
.fb-loading span{width:10px;height:10px;transform:rotate(45deg);border-radius:2px;background:var(--cy);box-shadow:0 0 10px var(--cy);animation:fb-pulse 1.1s ease-in-out infinite}
.fb-loading span:nth-child(2){animation-delay:.18s}
.fb-loading span:nth-child(3){animation-delay:.36s}
@keyframes fb-pulse{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.fb-loading span{animation:none;opacity:.7}}

/* счётчики */
.fb-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.fb-stat{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 14px;text-align:center}
.fb-stat .num{font-size:38px}
.fb-stat .lbl{line-height:1.45}
.fb-c-gd{color:var(--gd)}

/* панель: вкладки + фильтры */
.fb-toolbar{margin:4px 0 0;flex-direction:column;align-items:stretch;gap:12px}
.fb-count{margin-left:8px;padding:1px 7px;border-radius:999px;font-family:var(--sans);font-size:11px;letter-spacing:0;color:var(--muted);background:rgba(140,180,255,.12)}
.is-on .fb-count{color:var(--head);background:rgba(90,216,255,.22)}
.fb-find{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fb-find .search{flex:1 1 220px;width:auto}
.fb-select,.fb-input{height:44px;padding:0 14px;border-radius:12px;font:inherit;font-size:15px;color:var(--head);background:rgba(8,12,30,.6);border:1px solid var(--line3);outline:0;transition:border-color .2s,box-shadow .2s}
.fb-select{padding-right:34px;appearance:none;-webkit-appearance:none;cursor:pointer;
  background:rgba(8,12,30,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238F9BC4' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center}
.fb-select option{color:var(--text);background:#0B1230}
.fb-select:focus,.fb-input:focus{border-color:rgba(90,216,255,.7);box-shadow:0 0 0 3px rgba(90,216,255,.15)}
.fb-input::placeholder{color:var(--muted2)}
.fb-textarea{height:auto;min-height:150px;padding:12px 14px;line-height:1.6;resize:vertical}

/* список */
.fb-list{display:flex;flex-direction:column;gap:12px}
.fb-card{display:flex;gap:18px;padding:20px 22px}
.fb-card:hover::before{opacity:.9}
.fb-main{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.fb-title{font-family:var(--serif);font-size:21px;line-height:1.25;color:var(--head);text-decoration:none;overflow-wrap:anywhere;transition:color .2s}
.fb-title:hover{color:var(--cy-soft)}
.fb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13px;color:var(--muted)}
.fb-text{font-size:15px;line-height:1.6;color:var(--body);overflow-wrap:anywhere}
.fb-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;width:100%}
.fb-more{font-size:14px}

/* статусы */
.fb-st{display:inline-flex;align-items:center;padding:3px 10px;border-radius:7px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
  color:var(--body);background:rgba(140,160,220,.1);border:1px solid rgba(140,160,220,.32)}
.fb-st.is-cy{color:var(--cy-soft);background:rgba(90,216,255,.1);border-color:rgba(90,216,255,.4)}
.fb-st.is-ok{color:var(--ok-soft);background:rgba(70,224,138,.1);border-color:rgba(70,224,138,.42)}
.fb-st.is-vi{color:var(--vi-soft);background:rgba(167,123,255,.12);border-color:rgba(167,123,255,.45)}
.fb-st.is-gd{color:var(--gd-soft);background:rgba(242,196,109,.12);border-color:rgba(242,196,109,.45)}
.fb-st.is-bad{color:#FFB0B0;background:rgba(255,107,107,.1);border-color:rgba(255,107,107,.42)}
.fb-cat{padding:2px 8px;border-radius:7px;font-size:12px;color:var(--body);border:1px dashed var(--line3)}
.fb-int{padding:1px 7px;border-radius:6px;font-size:11px;font-weight:600;color:var(--gd-soft);border:1px dashed rgba(242,196,109,.5)}

/* ответ команды */
.fb-answer{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px 14px;border-radius:12px;
  background:linear-gradient(90deg,rgba(242,196,109,.09),rgba(10,15,36,.45) 65%);border:1px solid rgba(242,196,109,.3);border-left:3px solid var(--gd)}
.fb-answer .lbl{color:var(--gd-soft)}
.fb-answer p{font-size:14px;line-height:1.6;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
.fb-answer.is-big p{font-size:16px}
.fb-answer.is-flag{border-style:dashed;border-left-style:solid}
.fb-answer.is-muted{background:rgba(10,15,36,.4);border-color:var(--line2);border-left-color:var(--muted2)}
.fb-answer.is-muted p{color:var(--muted);font-style:italic}
.fb-answer + .fb-answer{margin-top:10px}

/* голосование */
.fb-vote{display:flex;flex-direction:column;align-items:center;gap:4px;flex:none;width:58px}
.fb-v{display:inline-flex;align-items:center;justify-content:center;width:40px;height:32px;border-radius:10px;color:var(--muted);cursor:pointer;
  background:rgba(8,12,30,.6);border:1px solid var(--line3);transition:color .15s,border-color .15s,background .15s,box-shadow .15s}
.fb-v:hover:not(:disabled){color:var(--head);border-color:rgba(90,216,255,.6)}
.fb-v.up.is-on{color:var(--ok);border-color:rgba(70,224,138,.75);background:rgba(70,224,138,.14);box-shadow:0 0 14px -4px var(--ok)}
.fb-v.down.is-on{color:#FF8A8A;border-color:rgba(255,107,107,.7);background:rgba(255,107,107,.12);box-shadow:0 0 14px -4px #FF6B6B}
.fb-v:disabled{cursor:default;opacity:.45}
.fb-score{font-size:24px;line-height:1.1}
.fb-score.pos{color:var(--ok)}
.fb-score.neg{color:#FF8A8A}
.fb-split{font-size:11px;color:var(--muted2);white-space:nowrap}
.fb-vote-msg{font-size:12px;color:#FF9A9A}
.fb-vote-msg:empty{display:none}

/* форма идеи и «как это работает» */
.fb-form,.fb-howto{padding:0}
.fb-form>summary,.fb-howto>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;cursor:pointer;list-style:none}
.fb-form>summary::-webkit-details-marker,.fb-howto>summary::-webkit-details-marker{display:none}
.fb-form>summary .ico,.fb-howto>summary .ico{color:var(--cy-soft);transition:transform .2s}
.fb-form[open]>summary .ico,.fb-howto[open]>summary .ico{transform:rotate(180deg)}
.fb-howto>summary{padding:14px 22px}
.fb-form form{display:flex;flex-direction:column;gap:14px;padding:0 22px 22px}
.fb-form .field .lbl{display:flex;justify-content:space-between;gap:10px}
.fb-form .field .fb-select,.fb-form .field .fb-input{width:100%}
.fb-form .btn-prime{align-self:flex-start}
.fb-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.fb-rules{display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.6;color:var(--body)}
.fb-rules li{display:flex;gap:12px;align-items:baseline}
.fb-rules li::before{content:"";width:6px;height:6px;flex:none;transform:translateY(-2px) rotate(45deg);background:var(--cy);box-shadow:0 0 8px var(--cy)}
.fb-rules a{color:var(--cy-soft);font-weight:600}
.fb-howto p{padding:0 22px;font-size:14px;line-height:1.6;color:var(--body)}
.fb-legend{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px 18px;padding:14px 22px 20px}
.fb-legend>span{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.fb-legend small{font-size:13px;line-height:1.45;color:var(--muted)}

/* страницы */
.fb-pager{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:6px;font-size:14px}
.fb-pager button[disabled]{opacity:.38;pointer-events:none}

/* подробная страница */
.fb-back{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-size:14px;font-weight:600;color:var(--body);text-decoration:none}
.fb-back:hover{color:#fff}
.fb-back .ico{color:var(--cy)}
.fb-detail{display:flex;flex-direction:column;gap:18px;padding:26px 28px}
.fb-head{display:flex;gap:18px;align-items:flex-start}
.fb-dtitle{font-family:var(--serif);font-size:clamp(24px,2.6vw,34px);line-height:1.15;color:var(--head);overflow-wrap:anywhere}
.fb-hint{font-size:13px;line-height:1.55;color:var(--muted)}
.fb-hint a{color:var(--cy-soft);font-weight:600}
.fb-body{font-size:16px;line-height:1.75;color:var(--body);white-space:pre-wrap;overflow-wrap:anywhere}
.fb-panel{display:flex;flex-direction:column;gap:14px;padding:22px 24px}

/* шкала событий — как в баг-репортах кабинета */
.fb-tl{position:relative;display:flex;flex-direction:column;gap:12px;padding-left:20px}
.fb-tl::before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:2px;border-radius:2px;background:linear-gradient(180deg,rgba(90,216,255,.5),rgba(167,123,255,.22))}
.fb-ev{position:relative;display:flex;flex-direction:column;gap:6px;padding:10px 14px;border-radius:12px;background:rgba(10,15,36,.5);border:1px solid var(--line)}
.fb-ev::before{content:"";position:absolute;left:-19px;top:15px;width:10px;height:10px;border-radius:50%;background:#0A0F24;border:2px solid var(--cy)}
.fb-ev.is-team{border-color:rgba(242,196,109,.32);background:linear-gradient(90deg,rgba(242,196,109,.08),rgba(10,15,36,.5) 60%)}
.fb-ev.is-team::before{border-color:var(--gd)}
.fb-ev.is-done::before{border-color:var(--ok);background:var(--ok)}
.fb-ev.is-wait{border-style:dashed}
.fb-ev.is-wait::before{border-color:var(--muted2)}
.fb-ev.is-internal{border-style:dashed;opacity:.85}
.fb-ev.is-internal::before{border-color:var(--muted2)}
.fb-ev-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:12px;color:var(--muted)}
.fb-ev-head b{font-size:14px;font-weight:600;color:var(--head)}
.fb-ev-head time{color:var(--muted2)}
.fb-ev-body{font-size:14px;line-height:1.55;color:var(--body);white-space:pre-wrap;overflow-wrap:anywhere}

/* панель команды */
.fb-staff{outline:1px dashed rgba(242,196,109,.4);outline-offset:-1px}
.fb-staff>.lbl{color:var(--gd-soft)}
.fb-staff form{display:flex;flex-direction:column;gap:12px}
.fb-staff .fb-select,.fb-staff .fb-input{width:100%}
.fb-actions{display:flex;flex-wrap:wrap;gap:10px}
.fb-danger{color:#FFB0B0}

@media (max-width:900px){
  .fb-wrap{gap:14px}
  .fb-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .fb-stat{padding:16px 10px}
  .fb-stat .num{font-size:30px}
  .fb-find{width:100%}
  .fb-find .fb-select{flex:1 1 140px}
  .fb-find .search{width:100%}
  .fb-card{gap:12px;padding:16px 14px}
  .fb-vote{width:46px}
  .fb-v{width:38px;height:30px}
  .fb-score{font-size:21px}
  .fb-title{font-size:18px}
  .fb-grid2{grid-template-columns:1fr}
  .fb-detail{padding:18px 16px}
  .fb-head{gap:12px}
  .fb-panel{padding:18px 16px}
  .fb-form>summary,.fb-howto>summary{padding:16px}
  .fb-form form{padding:0 16px 18px}
  .fb-howto p{padding:0 16px}
  .fb-legend{padding:12px 16px 16px;grid-template-columns:1fr}
}