/* ============================================================================
   Классическая тема форума — стилистика phpBB subSilver середины 2000-х.
   Гипотеза: такому оформлению доверяют больше, чем «продающему» современному —
   оно читается как живое сообщество, а не как витрина.
   ========================================================================== */

body.classic {
  margin: 0;
  padding: 0 0 24px;
  background: #E5E5E5;
  color: #000000;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 1.45;
}

body.classic a { color: #006699; text-decoration: none; }
body.classic a:hover { color: #DD6900; text-decoration: underline; }
body.classic img { border: 0; }

.c-wrap {
  width: 96%; max-width: 1180px; margin: 0 auto;
  background: #FFFFFF;
  border-left: 1px solid #98AAB1; border-right: 1px solid #98AAB1;
}

/* ------------------------------------------------------------------ шапка */
.c-head { padding: 14px 16px 8px; }
.c-head-inner { display: table; width: 100%; }
.c-logo, .c-title { display: table-cell; vertical-align: middle; }
.c-logo { width: 210px; }
.c-logo-text {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 27px; font-weight: bold; color: #C9A227; letter-spacing: -.5px;
}
.c-logo-text span { color: #7B6317; }
.c-logo-sub { font-size: 10px; color: #666; letter-spacing: .5px; margin-top: 2px; }
.c-title { text-align: center; }
.c-title h1 {
  margin: 0 0 3px; font-family: Arial, Helvetica, sans-serif;
  font-size: 21px; font-weight: bold; color: #000;
}
.c-title .c-sub { font-size: 11px; color: #444; margin-bottom: 7px; }
.c-title .c-links { font-size: 12px; }
.c-title .c-links a { font-weight: bold; }
.c-title .c-links .sep { color: #999; margin: 0 5px; }

.c-menubar {
  border-top: 1px solid #A9B8C2; border-bottom: 1px solid #A9B8C2;
  background: #FFFFFF; padding: 5px 16px; font-size: 11px;
}
.c-menubar .left { float: left; }
.c-menubar .right { float: right; }
.c-menubar a { font-weight: bold; }
.c-menubar::after { content: ''; display: block; clear: both; }
.c-menubar .ico { color: #5C82A5; margin-right: 3px; }

.c-body { padding: 12px 16px 20px; }

/* --------------------------------------------------------- хлебные крошки */
.c-nav {
  background: #F0F2F5; border: 1px solid #A9B8C2;
  padding: 5px 9px; margin-bottom: 12px; font-size: 11px; font-weight: bold;
}
.c-nav .sep { color: #666; font-weight: normal; margin: 0 4px; }

/* --------------------------------------------------------- заголовок темы */
.c-pagetitle { text-align: center; margin: 4px 0 10px; }
.c-pagetitle h2 {
  margin: 0 0 3px; font-family: Arial, Helvetica, sans-serif;
  font-size: 17px; font-weight: bold; color: #000;
}
.c-pagetitle .c-section { font-size: 11px; color: #444; }

.c-toolbar { margin-bottom: 6px; }
.c-toolbar::after { content: ''; display: block; clear: both; }
.c-toolbar .left { float: left; }
.c-toolbar .right { float: right; padding-top: 4px; font-size: 11px; }

.c-btn {
  display: inline-block; font-family: Verdana, Arial, sans-serif;
  font-size: 11px; font-weight: bold; color: #000 !important;
  background: #ECECEC; border: 1px solid #999; border-radius: 2px;
  padding: 3px 12px; cursor: pointer; text-decoration: none !important;
}
.c-btn:hover { background: #DCDCDC; color: #000 !important; }

/* ---------------------------------------------------------------- таблицы */
table.c-tbl {
  width: 100%; border-collapse: collapse;
  background: #FFFFFF; border: 1px solid #A9B8C2; margin-bottom: 14px;
}
table.c-tbl th {
  background: #D1D7DC; color: #000; font-size: 11px; font-weight: bold;
  padding: 5px 8px; text-align: center; border: 1px solid #A9B8C2;
  white-space: nowrap;
}
table.c-tbl td {
  padding: 7px 9px; border: 1px solid #DDE1E6; font-size: 11px; vertical-align: top;
}
table.c-tbl tr.row1 td { background: #EFEFEF; }
table.c-tbl tr.row2 td { background: #DEE3E7; }
table.c-tbl td.c-num { text-align: center; width: 62px; white-space: nowrap; }
table.c-tbl td.c-last { width: 168px; font-size: 10px; white-space: nowrap; }

.c-topic { font-size: 12px; font-weight: bold; }
.c-forum-name { font-size: 12px; font-weight: bold; }
.c-desc { font-size: 11px; color: #333; margin-top: 3px; }
.c-meta { font-size: 10px; color: #444; margin-top: 3px; }
.c-folder {
  display: inline-block; width: 15px; height: 13px; margin-right: 5px;
  background: #5C82A5; border: 1px solid #3A5B78; vertical-align: -2px;
}

/* -------------------------------------------------------------- сообщения */
table.c-post { width: 100%; border-collapse: collapse; border: 1px solid #A9B8C2; margin-bottom: 3px; }
table.c-post th {
  background: #D1D7DC; padding: 4px 8px; font-size: 11px;
  border: 1px solid #A9B8C2; text-align: left;
}
table.c-post th.c-author-col { width: 190px; text-align: center; }
table.c-post td { border: 1px solid #DDE1E6; padding: 9px 10px; vertical-align: top; }
table.c-post td.c-postbody { background: #EFEFEF; }
table.c-post td.c-authorbox { background: #DEE3E7; width: 190px; text-align: center; font-size: 10px; }

.c-postnum { font-size: 10px; color: #444; }
.c-postnum b { color: #000; }
.c-posthead { font-size: 10px; color: #444; }
.c-postbody-text { font-size: 12px; line-height: 1.55; color: #000; padding-top: 4px; }
.c-postbody-text p { margin: 0 0 9px; }
.c-postbody-text p:last-child { margin-bottom: 0; }

.c-avatar {
  width: 54px; height: 54px; margin: 0 auto 6px;
  background: #FFFFFF; border: 1px solid #A9B8C2;
  display: grid; place-items: center;
  font-size: 22px; font-weight: bold; color: #5C82A5;
  font-family: Georgia, serif;
}
.c-username { font-size: 12px; font-weight: bold; color: #006699; }
.c-rank { font-size: 10px; color: #444; margin: 2px 0 6px; }
.c-userstats { font-size: 10px; color: #000; text-align: left; padding: 0 6px; }
.c-userstats div { margin: 2px 0; }

.c-quote {
  background: #FAFAFA; border: 1px solid #A9B8C2;
  padding: 7px 9px; margin: 6px 0 9px; font-size: 11px; color: #333;
}
.c-quote .c-quote-head { font-weight: bold; font-size: 10px; margin-bottom: 4px; }

/* ------------------------------------------------------------------ формы */
.c-form { border: 1px solid #A9B8C2; margin-bottom: 14px; }
.c-form-head { background: #D1D7DC; padding: 5px 9px; font-weight: bold; font-size: 11px; }
.c-form-body { background: #EFEFEF; padding: 12px; }
.c-form-row { margin-bottom: 10px; }
.c-form-row label {
  display: block; font-size: 11px; font-weight: bold; margin-bottom: 3px; color: #000;
}
.c-form input[type=text], .c-form input[type=password], .c-form textarea, .c-form select {
  width: 100%; font-family: Verdana, Arial, sans-serif; font-size: 11px;
  padding: 4px 5px; border: 1px solid #A9B8C2; background: #FFF; color: #000;
  box-sizing: border-box;
}
.c-form textarea { height: 170px; line-height: 1.5; resize: vertical; }
.c-form .c-hint { font-size: 10px; color: #555; margin-top: 3px; }
.c-form-foot { background: #D1D7DC; padding: 7px 9px; text-align: center; }

.c-msg { border: 1px solid #A9B8C2; margin-bottom: 12px; }
.c-msg-head { background: #D1D7DC; padding: 4px 9px; font-weight: bold; font-size: 11px; }
.c-msg-body { background: #EFEFEF; padding: 10px; font-size: 11px; }
.c-msg.err .c-msg-head { background: #C69; color: #FFF; }

.c-empty { background: #EFEFEF; padding: 20px; text-align: center; font-size: 11px; }
.c-empty b { display: block; font-size: 12px; margin-bottom: 5px; }

/* ----------------------------------------------------------------- подвал */
.c-foot {
  border-top: 1px solid #A9B8C2; margin-top: 14px; padding: 10px 16px 4px;
  text-align: center; font-size: 10px; color: #444;
}
.c-foot a { font-weight: normal; }
.c-disclaimer {
  margin: 10px auto 0; padding: 9px 12px; max-width: 900px;
  background: #F7F7F7; border: 1px solid #DDD;
  font-size: 10px; color: #555; text-align: left; line-height: 1.5;
}
.c-switch { margin-top: 8px; font-size: 10px; }

@media (max-width: 720px) {
  .c-wrap { width: 100%; border: 0; }
  .c-logo, .c-title { display: block; width: auto; text-align: center; }
  .c-logo { margin-bottom: 8px; }
  table.c-post td.c-authorbox, table.c-post th.c-author-col { display: none; }
  table.c-tbl td.c-last { display: none; }
  .c-body { padding: 10px; }
}

/* ============================================================================
   Контентные страницы в классическом оформлении: справочник, статьи,
   калькулятор. Каркас общий с форумом, но текст крупнее — статьи длинные.
   ========================================================================== */

.c-cols { display: table; width: 100%; border-spacing: 0; }
.c-main { display: table-cell; vertical-align: top; }
.c-side { display: table-cell; vertical-align: top; width: 208px; padding-left: 14px; }
@media (max-width: 860px) {
  .c-cols, .c-main, .c-side { display: block; width: auto; padding-left: 0; }
  .c-side { margin-top: 14px; }
}

.c-box { border: 1px solid #A9B8C2; margin-bottom: 14px; background: #FFF; }
.c-box-head {
  background: #D1D7DC; padding: 5px 9px; font-size: 11px; font-weight: bold;
  border-bottom: 1px solid #A9B8C2;
}
.c-box-body { padding: 11px 13px; background: #FFFFFF; }
.c-box-body.tint { background: #EFEFEF; }

/* ------------------------------------------------------------ текст статьи */
.c-article { font-size: 12px; line-height: 1.65; color: #000; }
.c-article h2 {
  font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: bold;
  color: #000; margin: 20px 0 8px; padding: 4px 8px;
  background: #D1D7DC; border: 1px solid #A9B8C2;
}
.c-article h2:first-child { margin-top: 2px; }
.c-article h3 { font-size: 12.5px; font-weight: bold; margin: 14px 0 5px; color: #006699; }
.c-article p { margin: 0 0 10px; }
.c-article ul, .c-article ol { margin: 0 0 11px; padding-left: 22px; }
.c-article li { margin: 4px 0; }
.c-article strong, .c-article b { color: #000; }
.c-article em { color: #444; }
.c-article a { text-decoration: underline; }
.c-article hr { border: 0; border-top: 1px solid #CCC; margin: 14px 0; }
.c-article code {
  background: #F4F4F4; border: 1px solid #DDD; padding: 0 3px; font-size: 11px;
  font-family: 'Courier New', monospace;
}
.c-article blockquote {
  background: #FAFAFA; border: 1px solid #A9B8C2; border-left: 3px solid #5C82A5;
  padding: 7px 10px; margin: 9px 0; font-size: 11.5px; color: #333;
}
.c-article blockquote p:last-child { margin-bottom: 0; }

.c-article table {
  width: 100%; border-collapse: collapse; margin: 10px 0;
  border: 1px solid #A9B8C2; background: #FFF; font-size: 11px;
}
.c-article th {
  background: #D1D7DC; padding: 5px 7px; text-align: left;
  border: 1px solid #A9B8C2; font-weight: bold; white-space: nowrap;
}
.c-article td { padding: 5px 7px; border: 1px solid #DDE1E6; vertical-align: top; }
.c-article tr:nth-child(even) td { background: #F7F8F9; }
.c-tblwrap { overflow-x: auto; }

/* Обёртку .table-wrap ставит рендер статей (content.py), но стиль для неё был
   только во второй теме. Без него широкая таблица распирала страницу вбок на
   узком экране: у заголовков стоит white-space: nowrap, и пять колонок в 375px
   не укладываются. Прокрутка живёт внутри таблицы, страница остаётся на месте. */
.c-article .table-wrap { overflow-x: auto; max-width: 100%; margin: 10px 0; }
.c-article .table-wrap table { margin: 0; }

.c-lead {
  background: #EFEFEF; border: 1px solid #A9B8C2;
  padding: 9px 11px; margin-bottom: 11px; font-size: 12px; line-height: 1.6;
}
.c-syn { font-size: 10px; color: #444; margin-bottom: 10px; }

.c-warn {
  background: #FFFCE5; border: 1px solid #D4C77A;
  padding: 8px 11px; margin: 11px 0; font-size: 11px; line-height: 1.55;
}
.c-warn b { color: #7A5C00; }

/* ------------------------------------------------------------ боковой блок */
.c-side .c-box-body { padding: 8px 10px; font-size: 11px; }
.c-side ul { list-style: none; margin: 0; padding: 0; }
.c-side li { margin: 4px 0; line-height: 1.35; }
.c-side li a { font-size: 11px; }

/* ------------------------------------------------------------------ списки */
.c-list-item { padding: 8px 10px; border-bottom: 1px solid #DDE1E6; }
.c-list-item:last-child { border-bottom: 0; }
.c-list-item.alt { background: #F7F8F9; }
.c-list-item .c-name { font-size: 12px; font-weight: bold; }
.c-list-item .c-note { font-size: 11px; color: #333; margin-top: 2px; }
.c-tag {
  display: inline-block; font-size: 10px; padding: 1px 5px; margin-right: 4px;
  background: #EFEFEF; border: 1px solid #BBB; color: #333;
}
.c-tag.warn { background: #FFF3CD; border-color: #D4C77A; color: #7A5C00; }
.c-tag.ok { background: #E7F1E7; border-color: #A8C4A8; color: #2E5C2E; }

/* --------------------------------------------------------------- главная */
.c-hero { border: 1px solid #A9B8C2; background: #EFEFEF; padding: 14px 16px; margin-bottom: 14px; }
.c-hero h2 {
  font-family: Arial, Helvetica, sans-serif; font-size: 18px;
  margin: 0 0 6px; color: #000;
}
.c-hero p { margin: 0 0 8px; font-size: 12px; line-height: 1.6; }
.c-stats { font-size: 11px; color: #333; margin-top: 8px; }
.c-stats b { color: #006699; }

.c-cat-grid { display: table; width: 100%; border-spacing: 0; }
.c-cat-cell { display: table-cell; width: 50%; vertical-align: top; padding-right: 12px; }
.c-cat-cell:last-child { padding-right: 0; }
@media (max-width: 700px) { .c-cat-cell { display: block; width: auto; padding-right: 0; } }

/* ------------------------------------------------------------ калькулятор */
.c-calc-grid { display: table; width: 100%; }
.c-calc-in, .c-calc-out { display: table-cell; vertical-align: top; padding: 12px; }
.c-calc-in { width: 55%; background: #FFF; }
.c-calc-out { background: #EFEFEF; border-left: 1px solid #A9B8C2; }
@media (max-width: 700px) {
  .c-calc-grid, .c-calc-in, .c-calc-out { display: block; width: auto; }
  .c-calc-out { border-left: 0; border-top: 1px solid #A9B8C2; }
}
.c-bignum {
  font-family: Arial, Helvetica, sans-serif; font-size: 40px; font-weight: bold;
  color: #006699; line-height: 1;
}
.c-bignum-sub { font-size: 11px; color: #444; margin-top: 4px; }
.c-outrow {
  display: table; width: 100%; padding: 4px 0; border-bottom: 1px dotted #BBB; font-size: 11px;
}
.c-outrow:last-child { border-bottom: 0; }
.c-outrow span { display: table-cell; color: #444; }
.c-outrow b { display: table-cell; text-align: right; }

/* ------------------------------------------------- опыт читателей под статьёй */
.c-ugc { border: 1px solid #A9B8C2; margin: 18px 0 6px; }
.c-ugc-head {
  background: #D1D7DC; padding: 5px 9px; font-weight: bold; font-size: 11px;
  border-bottom: 1px solid #A9B8C2;
}
.c-ugc-body { background: #FFFFFF; padding: 12px 14px; }
.c-ugc-call {
  background: #EFEFEF; border: 1px solid #DDE1E6;
  padding: 8px 11px; margin: 0 0 12px; font-size: 11.5px; line-height: 1.55;
}
.c-ugc-item { border-bottom: 1px solid #E5E8EB; padding: 9px 0; }
.c-ugc-item:last-of-type { border-bottom: 0; }
.c-ugc-meta { font-size: 10px; color: #444; margin-bottom: 3px; }
.c-ugc-meta b { color: #006699; font-size: 11px; }
.c-ugc-text { font-size: 12px; line-height: 1.55; }
.c-ugc-text p { margin: 0 0 7px; }
.c-ugc-text p:last-child { margin-bottom: 0; }
.c-ugc-more { padding-top: 8px; font-size: 11px; }
.c-ugc-empty {
  padding: 12px; background: #FAFAFA; border: 1px dashed #C8CFD5;
  font-size: 11px; color: #444; margin-bottom: 12px;
}
.c-ugc-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid #E5E8EB; }
.c-ugc-form label { display: block; font-size: 11px; font-weight: bold; margin-bottom: 4px; }
.c-ugc-form textarea {
  width: 100%; box-sizing: border-box; height: 110px;
  font-family: Verdana, Arial, sans-serif; font-size: 11px; line-height: 1.5;
  padding: 6px 7px; border: 1px solid #A9B8C2; background: #FFF; resize: vertical;
}
.c-ugc-note { font-size: 10px; color: #555; margin: 5px 0 8px; line-height: 1.5; }
.c-ugc-login {
  margin-top: 12px; padding: 9px 11px; background: #F7F7F7;
  border: 1px solid #DDD; font-size: 11px;
}

/* Код восстановления — единственный способ вернуть анонимный аккаунт */
.c-recovery {
  font-family: "Courier New", monospace;
  font-size: 17px;
  letter-spacing: 1px;
  text-align: center;
  padding: 12px 10px;
  background: #FFF;
  border: 2px solid #006699;
  color: #006699;
  font-weight: bold;
  word-break: break-all;
}

/* Панель модерации под сообщением — намеренно неброская, чтобы не спорить
   с содержимым: читатель видит только «Пожаловаться», модератор — действия */
.c-mod-bar { margin-top: 8px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.c-mod-bar form { display: inline; margin: 0; }
.c-mod-bar button {
  font-family: Verdana, Arial, sans-serif; font-size: 10px;
  padding: 2px 7px; background: #ECECEC; border: 1px solid #A9B8C2;
  color: #444; cursor: pointer;
}
.c-mod-bar button:hover { background: #DDE3E8; color: #006699; }
.c-mod-bar summary { font-size: 10px; color: #888; cursor: pointer; list-style: none; }
.c-mod-bar summary:hover { color: #006699; }
.c-mod-bar input[name="reason"] {
  font-family: Verdana, Arial, sans-serif; font-size: 10px;
  padding: 2px 5px; border: 1px solid #A9B8C2; width: 240px; margin-right: 5px;
}
.c-mod-note {
  margin-top: 8px; padding: 5px 8px; font-size: 10px;
  background: #FFF6E5; border: 1px solid #E8C97A; color: #7A5B00;
}

/* Галочка согласия при регистрации */
.c-form-row label input[type="checkbox"] { vertical-align: -1px; }

/* ============================================================================
   Мобильные экраны: читаемый размер текста.

   Классическая тема родом из времён, когда 11px на десктопе было нормой.
   На телефоне это нечитаемо, а статьи здесь длинные - по три тысячи слов.
   Поднимаем текст до 15-16px, интерфейс до 13-14. Вёрстка не меняется:
   каркас уже перестраивается в media-queries выше.
   ========================================================================== */
@media (max-width: 720px) {
  body.classic { font-size: 14px; }

  /* тело статей и сообщений - главное, ради чего сюда приходят */
  .c-article, .c-article p, .c-article li, .c-article td, .c-article th { font-size: 15.5px; }
  .c-article { line-height: 1.65; }
  .c-article h2 { font-size: 19px; }
  .c-article h3 { font-size: 16.5px; }
  .c-postbody-text { font-size: 15.5px; line-height: 1.65; }
  .c-lead { font-size: 15px; }
  .c-ugc-text, .c-ugc-call, .c-ugc-empty { font-size: 14.5px; line-height: 1.6; }

  /* списки материалов */
  .c-topic, .c-forum-name { font-size: 15px; }
  .c-desc { font-size: 13.5px; line-height: 1.5; }
  .c-meta, .c-postnum, .c-posthead { font-size: 12px; }
  table.c-tbl td, table.c-tbl th { font-size: 13.5px; padding: 9px; }

  /* шапка и навигация */
  .c-title h1 { font-size: 19px; }
  .c-title .c-sub { font-size: 13px; }
  .c-title .c-links, .c-menubar, .c-nav { font-size: 13.5px; }
  .c-pagetitle h2 { font-size: 19px; }
  .c-pagetitle .c-section { font-size: 13px; }
  .c-box-head, .c-form-head { font-size: 13.5px; }

  /* формы: шрифт меньше 16px заставляет iOS зумить страницу при фокусе */
  input[type="text"], input[type="password"], input:not([type]), textarea, select,
  .c-form input, .c-form textarea, .c-ugc-form textarea { font-size: 16px; padding: 9px; }
  .c-btn, button { font-size: 14px; padding: 8px 14px; }
  label { font-size: 14px; }
  .c-hint, .c-ugc-note { font-size: 12.5px; }

  /* мелочи, которые на телефоне превращаются в нечитаемое */
  .c-tag { font-size: 12px; }
  .c-foot, .c-disclaimer { font-size: 12.5px; line-height: 1.55; }
  .c-warn { font-size: 13.5px; }
  .c-mod-bar button, .c-mod-bar summary { font-size: 12.5px; }
  .c-recovery { font-size: 16px; }
}

/* Колонки, которые на телефоне только мешают. Скрывать нужно И ячейку, И её
   заголовок: если убрать только td, таблица останется с лишним th и разъедется —
   на этом уже обожглись на странице форума. */
@media (max-width: 720px) {
  .c-hide-m,
  table.c-tbl th.c-last { display: none; }

  /* «Чаще всего спрашивают» на главной идёт в две колонки: на 375px это даёт
     по восемь символов в строке. На телефоне — одна колонка. */
  .c-tbl td[style*="width:50%"] { display: block; width: auto !important; }

  /* кнопки в шапке страницы: одинаковой ширины, а не лесенкой */
  .c-hero .c-btn { display: block; margin: 6px 0 0; text-align: center; }
}

/* Справочник и категории: на телефоне колонка «Метки» отнимает половину
   ширины у названия и описания. Разворачиваем строку в блок — метки уезжают
   под текст, ничего не теряется и не режется по краю. */
@media (max-width: 720px) {
  .c-tbl.c-stack td { display: block; width: auto !important; }
  .c-tbl.c-stack th:not(:first-child) { display: none; }
  .c-tbl.c-stack th:first-child { display: block; width: auto !important; }
  .c-tbl.c-stack td:not(:first-child):empty { display: none; }
  .c-tbl.c-stack td + td { padding-top: 0; border-top: 0; }
}
@media (max-width: 720px) { .c-nomark { display: none; } }