/* Большой квадратик с текстом новости */

html, body { height: 100%; }
.card.nameblock,
.card.mini{
  text-align: center;
}
/* portrait fix: border on wrapper, not on img */
.frame{
  height: 440px;             /* твоя высота */
  border: 3px solid #000;    /* рамка тут */
  border-radius: 12px;
  overflow: hidden;          /* обрезает края, если что */
}

.frame-img{
  width: 100%;
  height: 100%;
  object-fit: cover;         /* заполняет без искажений */
  display: block;
  border: 0;                 /* важно: без бордера, иначе «вылезает» */
}

.panel.about{
  min-height: 0;
  padding-bottom: 40px;  /* чтобы last upd. не наезжал на текст */
}
.cornerLink{
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 0; height: 0;          /* рисуем треугольник бордерами */
  display: block;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 26px solid #000; /* OUTLINE (чёрная окантовка) */
  background: transparent;
  border-radius: 0;             /* на всякий случай */
}

/* Внутренняя заливка треугольника (подбери под свой цвет панелей) */
.cornerLink::after{
  content: "";
  position: absolute;
  left: -24px;  /* сдвигаем внутрь чёрного контура */
  top: -14px;
  width: 0; height: 0;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-left: 24px solid #cf7e3d; /* ← цвет заливки стрелки (оранжевый панели) */
}
/* portrait fix: border on wrapper, not on img */
.frame{
  height: 440px;             /* твоя высота */
  border: 3px solid #000;    /* рамка тут */
  border-radius: 12px;
  overflow: hidden;          /* обрезает края, если что */
}

.frame-img{
  width: 100%;
  height: 100%;
  object-fit: cover;         /* заполняет без искажений */
  display: block;
  border: 0;                 /* важно: без бордера, иначе «вылезает» */
}


/* лёгкий ховер (не обязателен) */
.cornerLink:hover{ filter: brightness(1.05); }
.newsText{
  border: var(--panel-border, 3px) solid var(--ink, #000);
  border-radius: 0;
  padding: 12px;
  min-height: 170px;
}

/* Пагинация: previous | 1 | next */
.pager{
  display: grid;
  grid-template-columns: 1fr auto 1fr; /* prev | 1 | next */
  align-items: center;
  gap: 12px;
  margin: 12px 0;
}

.pager .pill,
.pager .pageNum{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 3px solid var(--ink, #000);
  color: var(--ink, #000);
  text-decoration: none;
  border-radius: 0;     /* острые углы */
  line-height: 1;
  box-shadow: none;
}

.pager .pill{ padding: 6px 14px; min-width: 92px; }
.pager .pageNum{ width: 36px; height: 30px; padding: 0; }

/* ====== ТРЕУГОЛЬНИК «НАЗАД» ВНИЗУ-СЛЕВА ====== */
.backTri{
  position: fixed;
  left: 16px;
  bottom: 16px;
  width: 0; height: 0;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-right: 24px solid var(--ink, #000);
}

/* Space background only on index */
body.bg-space{
  background: url("/space.jpg") center / cover no-repeat fixed;
}

/* smoother scrolling on mobile */
@media (max-width: 900px){
  body.bg-space{ background-attachment: scroll; }
}
.panel,
.card,
.nameblock,
.mini,
.facts .panel,
.newsText,
.newsTop {
  background: rgba(255, 255, 255, 0.94); /* чуть прозрачный белый; можно поставить #fff для 100% */
  border: 3px solid #000;                 /* чтобы контур не потерялся поверх фона */
}

/* лента вверху на левом блоке */
.ribbon .band { background: rgba(255,255,255,0.94); }

/* «рамка с диагональными полосками» — добавим базовый белый под полоски */
.frame .ph { background-color: rgba(255,255,255,0.94); }

/* (не обязательно) немного контраста внутри панелей */
.panel, .card, .newsText, .newsTop { box-shadow: 0 0 0 0 rgba(0,0,0,0); }
.frame{ height: 440px; } /* уже есть у тебя — ок */
.frame-img{
  width: 100%;
  height: 100%;
  object-fit: cover;      /* заполняет, не тянет */
  border: 3px solid #000; /* как у других панелей */
  border-radius: 12px;    /* как у панелек слева */
  display: block;
}
/* portrait fix: border on wrapper, not on img */
.frame{
  height: 440px;             /* твоя высота */
  border: 3px solid #000;    /* рамка тут */
  border-radius: 12px;
  overflow: hidden;          /* обрезает края, если что */
}

.frame-img{
  width: 100%;
  height: 100%;
  object-fit: cover;         /* заполняет без искажений */
  display: block;
  border: 0;                 /* важно: без бордера, иначе «вылезает» */
}