﻿/* ===================================================================
   RESONANCE · занятые внешности | legume
   Правится свободно. Цвета — переменные темы форума, тёмная тема — .dark.
=================================================================== */
#rs-faces {
  --rsf-name:  var(--links, #A2706A);
  --rsf-text:  var(--text1, #323232);
  --rsf-head:  var(--text1, #323232);
  --rsf-paper: rgba(255, 255, 255, .55);
  --rsf-line:  rgba(50, 50, 50, .14);
  font: 400 12px/1.5 var(--font, Inter), Verdana, Arial, sans-serif;
  color: var(--rsf-text); text-align: left; margin: 10px 0;
}
.dark #rs-faces {
  --rsf-name:  #E9A584;
  --rsf-text:  #eee6e0;
  --rsf-head:  #f6efe9;
  --rsf-paper: rgba(89, 82, 80, .72);
  --rsf-line:  rgba(255, 255, 255, .16);
}
#rs-faces .rsf-title { font: 400 30px/1.1 Durik, var(--font2), serif; color: var(--rsf-head); text-align: center; margin: 0 0 6px; }
#rs-faces .rsf-intro { text-align: center; max-width: 560px; margin: 0 auto 14px; opacity: .85; }
#rs-faces .rsf-body { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
#rs-faces .rsf-col { background: var(--rsf-paper); border-radius: 6px; padding: 14px 18px 18px; box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
#rs-faces .rsf-col-t { font: 400 24px/1 Zaychik, var(--font2), cursive; color: var(--rsf-head); text-align: center; margin: 0 0 6px; }
#rs-faces .rsf-letters {
  margin: 14px 0 6px; padding-bottom: 3px; border-bottom: 1px solid var(--rsf-line);
  font: 600 14px/1 var(--font2, 'Alegreya Sans SC'), serif; letter-spacing: .25em; color: var(--rsf-name); text-transform: lowercase;
}
#rs-faces .rsf-list { list-style: none; margin: 0; padding: 0; }
#rs-faces .rsf-list li { padding: 1px 0; }
#rs-faces .rsf-name { color: var(--rsf-name) !important; font-weight: 600; text-decoration: none; }
#rs-faces .rsf-name:hover { text-decoration: underline; }
#rs-faces .rsf-empty { opacity: .6; text-align: center; padding: 10px 0; }
@media (max-width: 640px) { #rs-faces .rsf-body { grid-template-columns: 1fr; } }

/* придержанные — отдельный блок на всю ширину, в 3 столбца */
#rs-faces .rsf-holds { margin-top: 18px; background: var(--rsf-paper); border: 1px dashed var(--rsf-line); border-radius: 6px; padding: 14px 18px 18px; }
#rs-faces .rsf-holds .rsf-list { columns: 3 200px; column-gap: 24px; }
#rs-faces .rsf-holds .rsf-list li { break-inside: avoid; }
#rs-faces .rsf-hold .rsf-face { font-style: italic; opacity: .85; }
#rs-faces .rsf-hold-mark { font-family: var(--font, Inter), sans-serif; font-size: 16px; color: var(--rsf-name); }
#rs-faces .rsf-ent { opacity: .7; }
#rs-faces .rsf-until { display: inline-block; padding: 0 5px; border-radius: 8px; font-size: 10px; line-height: 15px; background: var(--rsf-line); white-space: nowrap; }
#rs-faces .rsf-note { text-align: center; font-size: 11px; opacity: .65; margin: -2px 0 4px; }
#rs-faces .rsf-buyouts { border-style: solid; }
