/* Shared shell, textures and project theme. */
@font-face {
  font-family: "WarHelios";
  src: url("../../../assets/warhelioscondc-webfont.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "DIN Pro";
  src: url("../../../assets/din-pro-condensed-bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --font-section-title: "DIN Pro", "WarHelios", "Arial Narrow", sans-serif;
  color-scheme: dark;
  --page-width: 1090px;
  --line: #252827;
  --line-light: #3a3d3b;
  --panel: #0c0e0e;
  --panel-soft: #141616;
  --text: #929493;
  --text-dim: #555a58;
  --heading: #d7d29a;
  --heading-glow: rgba(210, 238, 87, .58);
  --cyan: #cfe4e2;
  --orange: #f35b2d;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  min-height: 100%;
  overscroll-behavior-y: none;
  background: #050606;
}

body {
  min-height: 100%;
  margin: 0;
  overscroll-behavior-y: none;
  color: var(--text);
  background:
    radial-gradient(circle at 50% -15%, rgba(40, 51, 48, .32), transparent 48rem),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 5px),
    #050606;
  font: 13px/1.34 Arial, Helvetica, sans-serif;
}

a {
  color: #d7dfdd;
  text-decoration: none;
  transition: color .2s ease, background-color .2s ease, opacity .2s ease;
}

a:hover,
a:focus-visible {
  color: #fff;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

.svg-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.icon {
  width: 1em;
  height: 1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -.12em;
}

#icon-home,
#icon-user,
#icon-comment,
#icon-folder {
  fill: currentColor;
  stroke: none;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.site-shell {
  width: min(100%, var(--page-width));
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #090a0a;
  box-shadow: 0 0 32px #000, inset 0 0 0 1px #1e2220;
}

.site-header {
  height: 160px;
  background-color: #101312;
  background-image: url("../../../assets/design-reference.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 1090px 1007px;
}

/* Navigation keeps the original metal texture and condensed lettering. */
.main-nav {
  min-height: 65px;
  position: relative;
  z-index: 20;
  background: #0a0d0d url("../../../assets/menu.jpg") center top / 1090px 65px no-repeat;
}

.nav-toggle {
  display: none;
}

.nav-list {
  height: 39px;
  margin: 0;
  padding: 12px 17px 0;
  display: flex;
  list-style: none;
}

.nav-list > li {
  min-width: 0;
  height: 39px;
  position: relative;
  display: flex;
  flex: 1 1 auto;
  background: url("../../../assets/line.jpg") right center / 1px 43px no-repeat;
}

.nav-list > li:last-child {
  background: none;
}

.nav-list > li > .nav-label {
  width: 100%;
  padding: 1px 11px 0;
  display: grid;
  place-items: center;
  color: #d1d7d6;
  background: url("../../../assets/ap-menu_activ.jpg") left 3000px / auto 39px repeat-x;
  font-family: "WarHelios", "Arial Narrow", sans-serif;
  font-size: 17px;
  line-height: 38px;
  text-align: center;
  text-shadow: 1px -1px #000;
  text-transform: uppercase;
  white-space: nowrap;
}

.nav-list > li > .nav-label:hover,
.nav-list > li > .nav-label:focus-visible {
  background-position: left top;
  outline: none;
}

.nav-list .home-item {
  flex: 0 0 56px;
}

.nav-list .home-item .icon {
  width: 17px;
  height: 17px;
}

.nav-list .wide-item {
  flex-grow: 1.35;
}

.dropdown {
  min-width: 176px;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 39px;
  left: 0;
  display: none;
  list-style: none;
  background: #171918;
  border: 1px solid #050505;
  box-shadow: 0 15px 24px #000;
}

.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown {
  display: block;
}

.dropdown a {
  min-height: 32px;
  padding: 8px 10px;
  display: block;
  color: #8f9492;
  border: 1px solid #292c2b;
  border-bottom-color: #0d0f0e;
  background: #171918;
}

.dropdown a:hover,
.dropdown a:focus-visible {
  color: #fff;
  background: #233b39;
}

/* The three informer panels use the same sliced frame as the source design. */
.info-frame {
  min-height: 293px;
  position: relative;
  padding: 34px 20px;
  isolation: isolate;
  background: url("../../../assets/inf_c.jpg") center / 1090px 32px repeat-y;
}

.info-frame::before,
.info-frame::after {
  position: absolute;
  right: 0;
  left: 0;
  z-index: -1;
  height: 34px;
  content: "";
  background-position: center;
  background-size: 1090px 34px;
  background-repeat: no-repeat;
}

.info-frame::before {
  top: 0;
  background-image: url("../../../assets/inf_t.jpg");
}

.info-frame::after {
  bottom: 0;
  background-image: url("../../../assets/inf_f.jpg");
}

.info-grid {
  min-height: 225px;
  display: grid;
  grid-template-columns: 1.85fr 1.03fr 1.03fr;
  overflow: hidden;
  background: #070808;
  border: 1px solid #050606;
  box-shadow: 0 0 0 1px #292d2b, inset 0 0 18px #000;
}

.info-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #050606;
  box-shadow: 1px 0 #2d302f;
}

.info-panel:last-child {
  border-right: 0;
  box-shadow: none;
}

.info-heading {
  height: 25px;
  margin: 0;
  padding: 5px 5px 3px;
  overflow: hidden;
  color: #c9ccca;
  border-bottom: 1px solid #494b4a;
  background: linear-gradient(#242726, #121414 64%, #090a0a);
  font-size: 11px;
  font-weight: 400;
  line-height: 16px;
  white-space: nowrap;
}

.video-box {
  min-height: 198px;
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #777;
  background:
    radial-gradient(circle, rgba(40, 45, 43, .2), transparent 30%),
    #080909;
  border: 5px solid #0b0c0c;
  box-shadow: inset 0 0 0 1px #242726, inset 0 0 42px #000;
}

.video-play {
  width: 48px;
  height: 48px;
  display: block;
  opacity: 0;
  border: 1px solid #555;
  border-radius: 50%;
  background: rgba(0, 0, 0, .6);
  transition: opacity .2s ease;
}

.video-play::after {
  width: 0;
  height: 0;
  margin: 14px 0 0 19px;
  display: block;
  content: "";
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 14px solid #b9bdba;
}

.video-caption {
  position: absolute;
  right: 12px;
  bottom: 8px;
  left: 12px;
  opacity: 0;
  font-size: 11px;
  text-align: center;
}

.video-box:hover .video-play,
.video-box:focus-visible .video-play,
.video-box:hover .video-caption,
.video-box:focus-visible .video-caption {
  opacity: .85;
}

.compact-list {
  padding: 6px 5px 0;
}

.compact-item {
  min-width: 0;
  height: 40px;
  padding: 3px 5px;
  display: block;
  overflow: hidden;
  color: #858987;
  background: #171919;
  border: 1px solid #252827;
  border-radius: 2px;
}

.compact-extra[hidden] {
  display: none !important;
}

.compact-item + .compact-item {
  margin-top: 1px;
}

.compact-item:hover,
.compact-item:focus-visible {
  color: #dfe7e5;
  background: #202322;
}

.compact-item span,
.compact-item small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-item span {
  line-height: 17px;
}

.compact-item small {
  color: #4f5351;
  font-size: 9px;
}

.compact-item .icon {
  margin-right: 4px;
}

.compact-more {
  min-height: 28px;
  margin-top: auto;
  padding: 4px 8px 5px;
  color: #c4c8c6;
  border: 0;
  border-top: 1px solid #1a1c1c;
  background: #0a0b0b;
  font-size: 10px;
  text-align: left;
  cursor: pointer;
}

.compact-more:hover,
.compact-more:focus-visible {
  color: #fff;
  background: #151717;
}

.link-more {
  display: block;
}

.body-top {
  height: 15px;
  background: url("../../../assets/top_t.jpg") center / 1090px 15px no-repeat;
}

.page-body {
  padding: 0 0 26px;
  background: url("../../../assets/top_c.jpg") center top / 1090px 34px repeat-y;
}

.main-layout {
  padding: 0 22px;
  display: grid;
  grid-template-columns: 303px minmax(0, 732px);
  gap: 13px;
  align-items: start;
}

.sidebar,
.news-column {
  min-width: 0;
}

.side-section + .side-section {
  margin-top: 5px;
}

.side-title {
  width: calc(100% + 9px);
  height: 49px;
  margin: -10px 0 0 -1px;
  padding: 13px 10px 5px;
  color: var(--heading);
  background: url("../../../assets/ap-bl_sh.png") left top / 312px 49px no-repeat;
  font: 22px/26px "WarHelios", "Arial Narrow", sans-serif;
  font-weight: 400;
  text-shadow: 0 0 10px var(--heading-glow);
}

.side-content,
.release-list {
  margin: -1px 6px 0 3px;
  background: rgba(7, 9, 9, .82);
  border-right: 1px solid #232625;
  border-bottom: 1px solid #232625;
  border-left: 1px solid #080909;
  box-shadow: inset 0 0 18px rgba(0, 0, 0, .72);
}

.profile-content {
  padding: 13px 5px 0;
}

.login-form input[type="text"],
.login-form input[type="password"] {
  width: 100%;
  height: 27px;
  margin-bottom: 10px;
  padding: 4px 6px;
  color: #b5b7b6;
  outline: 0;
  border: 1px solid #242725;
  background: #101212;
  box-shadow: inset 0 1px 3px #050505;
  font-size: 11px;
}

.login-form input:focus {
  border-color: #48504b;
}

.login-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.login-button {
  min-width: 30px;
  height: 24px;
  padding: 0 4px;
  color: #d3d5d4;
  border: 1px solid #3a3d3c;
  background: linear-gradient(#373b39, #1c1f1e);
  font-size: 9px;
  cursor: pointer;
}

.login-button:hover,
.login-button:focus-visible {
  border-color: #5e6561;
  background: linear-gradient(#464b48, #262a28);
}

.remember {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #898c8a;
  font-size: 12px;
  cursor: pointer;
}

.remember input {
  position: absolute;
  opacity: 0;
}

.checkmark {
  width: 14px;
  height: 14px;
  display: grid;
  place-items: center;
  color: transparent;
  border-radius: 2px;
  background: #383b39;
  font-size: 11px;
  font-weight: 700;
}

.remember input:checked + .checkmark {
  color: #fff;
  background: var(--orange);
}

.remember input:focus-visible + .checkmark {
  outline: 1px solid #fff;
  outline-offset: 2px;
}

.profile-links {
  margin: 9px -5px 0;
}

.profile-links a {
  height: 29px;
  padding: 6px 4px;
  display: block;
  color: #c2c5c3;
  border-top: 1px solid #1f2221;
  background: rgba(20, 22, 21, .75);
  font-size: 13px;
}

.profile-links a:hover,
.profile-links a:focus-visible {
  color: #fff;
  background: #222523;
}

.profile-links .icon {
  width: 14px;
  height: 14px;
  margin-right: 3px;
  color: #9da19f;
}

.ad-space {
  min-height: 5px;
  padding: 0;
  color: transparent;
  font-size: 0;
}

.release-list {
  padding: 0 4px 8px;
}

.release-card {
  height: 200px;
  position: relative;
  display: block;
  overflow: hidden;
  border-bottom: 5px solid #070808;
  background: #0b0c0c;
}

.release-card img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(.7) brightness(.72);
  transition: filter .25s ease, transform .4s ease;
}

.release-card:hover img,
.release-card:focus-visible img {
  filter: saturate(.95) brightness(.9);
  transform: scale(1.025);
}

.release-card strong,
.release-category,
.release-rating {
  position: absolute;
  z-index: 1;
  color: #bcb680;
  background: rgba(8, 9, 9, .9);
  font-family: "WarHelios", "Arial Narrow", sans-serif;
  font-weight: 400;
}

.release-card strong {
  top: 5px;
  left: 0;
  max-width: 95%;
  padding: 5px 8px;
  border-radius: 0 0 14px;
  font-size: 18px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.release-card strong .icon,
.release-category .icon,
.release-rating .icon {
  margin-right: 4px;
}

.release-category {
  bottom: 0;
  left: 0;
  padding: 5px 6px;
  border-radius: 0 14px 0 0;
  font-size: 14px;
}

.release-rating {
  right: 0;
  bottom: 0;
  padding: 5px 6px;
  border-radius: 14px 0 0;
  font-size: 14px;
}

.all-releases {
  padding: 8px;
  display: block;
  color: #777d79;
  text-align: center;
}

.stats-content {
  padding: 8px 10px;
}

.stats-content p {
  margin: 3px 0;
}

.stats-content strong {
  color: #c5c9c6;
}

.news-card {
  width: 100%;
  margin-bottom: 14px;
}

.news-header {
  min-height: 50px;
  position: relative;
  padding: 12px 12px 8px 20px;
  background: #121514 url("../../../assets/ap-news_t.jpg") center top / 100% 50px no-repeat;
}

.news-header h1,
.news-header h2 {
  max-width: calc(100% - 230px);
  margin: 0;
  overflow: hidden;
  font: 22px/25px "WarHelios", "Arial Narrow", sans-serif;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 0 10px var(--heading-glow);
}

.news-header h1 a,
.news-header h2 a {
  color: var(--heading);
}

.news-header h1 a:hover,
.news-header h2 a:hover {
  color: #fffbd0;
}

.news-meta {
  position: absolute;
  top: 16px;
  right: 11px;
  display: flex;
  gap: 8px;
  color: #4d5250;
  font-size: 11px;
  white-space: nowrap;
}

.news-meta span {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.news-meta .icon {
  width: 13px;
  height: 13px;
}

.news-body {
  min-height: 190px;
  padding: 5px 10px 5px 15px;
  display: grid;
  grid-template-columns: 237px minmax(0, 1fr);
  gap: 11px;
  color: #919493;
  background: #0a0c0c url("../../../assets/ap-news_c.png") center / 100% 10px repeat-y;
}

.news-image {
  width: 237px;
  height: 180px;
  display: block;
  overflow: hidden;
  border: 1px solid #2c302e;
  box-shadow: 0 0 0 4px #101212, 0 0 0 5px #272a29;
}

.news-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(.66) brightness(.8);
  transition: filter .25s ease, transform .4s ease;
}

.news-card:first-child .news-image img {
  filter: grayscale(1) contrast(1.05) brightness(.9);
}

.news-image:hover img,
.news-image:focus-visible img {
  filter: saturate(1) brightness(1);
  transform: scale(1.025);
}

.news-card:first-child .news-image:hover img,
.news-card:first-child .news-image:focus-visible img {
  filter: grayscale(.4) contrast(1.05) brightness(1);
}

.news-body p {
  margin: 0;
  padding: 0 0 6px;
  line-height: 1.3;
}

.news-body p a {
  color: #d1d7d5;
  white-space: nowrap;
}

.news-footer {
  height: 10px;
  margin-top: -5px;
  background: url("../../../assets/ap-news_f.png") center / 100% 10px no-repeat;
}

.site-footer {
  min-height: 110px;
  padding: 31px 20px 18px;
  color: #454947;
  background: #070808 url("../../../assets/top_f.jpg") center top / 1090px 110px no-repeat;
  font-size: 11px;
  text-align: center;
}

.site-footer p {
  margin: 4px 0;
}

/* --------------------------------------------------------------------------
   V2: one material system

   The texture is deliberately kept strong. Cohesion comes from shared light,
   patina, depth and hardware instead of flattening the original artwork.
   -------------------------------------------------------------------------- */

.material-v2 {
  --text: #9b9f9c;
  --text-dim: #606663;
  --metal-highlight: rgba(166, 174, 168, .32);
  --metal-shadow: rgba(0, 0, 0, .92);
  --patina: rgba(76, 126, 115, .32);
  --patina-bright: rgba(117, 174, 159, .35);
  --warm-light: rgba(220, 216, 151, .3);
  background:
    radial-gradient(ellipse at 50% -18%, rgba(49, 74, 68, .32), transparent 52rem),
    repeating-linear-gradient(125deg, rgba(126, 144, 137, .018) 0 1px, transparent 1px 6px),
    #050606;
}

.material-v2 .site-shell {
  position: relative;
  isolation: isolate;
  background-color: #090c0b;
  box-shadow:
    0 0 0 1px #000,
    0 0 0 2px rgba(68, 77, 73, .36),
    0 18px 55px #000,
    inset 1px 0 rgba(135, 145, 140, .16),
    inset -1px 0 #000;
}

.material-v2 .site-shell::before,
.material-v2 .site-shell::after {
  position: absolute;
  inset: 0;
  z-index: 60;
  content: "";
  pointer-events: none;
}

.material-v2 .site-shell::before {
  opacity: .2;
  background:
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(194, 205, 199, .045) 3px 4px),
    repeating-linear-gradient(117deg, transparent 0 23px, rgba(62, 102, 93, .1) 24px 25px);
  mix-blend-mode: soft-light;
}

.material-v2 .site-shell::after {
  z-index: 61;
  box-shadow:
    inset 0 0 0 1px rgba(132, 143, 137, .17),
    inset 0 0 34px rgba(0, 0, 0, .5);
}

.material-v2 .site-header {
  position: relative;
  box-shadow:
    inset 0 1px rgba(190, 198, 192, .2),
    inset 0 -19px 24px rgba(0, 0, 0, .48),
    0 2px 6px #000;
}

.material-v2 .site-header::after,
.material-v2 .site-footer::before {
  position: absolute;
  right: 12px;
  left: 12px;
  height: 8px;
  content: "";
  background:
    radial-gradient(circle at 8px 50%, #858d87 0 1px, #191d1b 1.5px 3px, transparent 3.5px) 0 0 / 92px 100% repeat-x,
    linear-gradient(to bottom, #262c29, #080a09 48%, #1c211f 55%, #050606);
  border: 1px solid #030404;
  box-shadow: 0 1px rgba(116, 128, 121, .2), inset 0 1px rgba(171, 181, 175, .15);
}

.material-v2 .site-header::after {
  bottom: 4px;
}

.material-v2 .main-nav {
  border-top: 1px solid #252b28;
  border-bottom: 1px solid #020303;
  box-shadow:
    inset 0 1px rgba(139, 151, 145, .18),
    inset 0 -10px 16px rgba(0, 0, 0, .48),
    0 4px 9px #000;
}

.material-v2 .nav-list > li > .nav-label {
  box-shadow: inset 0 0 0 rgba(84, 137, 124, 0);
  transition: color .18s ease, background-position .24s ease, box-shadow .24s ease, text-shadow .24s ease;
}

.material-v2 .nav-list > li > .nav-label:hover {
  color: #f0f5f2;
  box-shadow:
    inset 0 1px rgba(147, 189, 178, .22),
    inset 0 -1px rgba(0, 0, 0, .72),
    inset 0 0 18px var(--patina);
  text-shadow: 0 0 8px rgba(158, 210, 195, .55), 1px -1px #000;
}

.material-v2 .dropdown {
  border-color: #020303;
  background:
    linear-gradient(105deg, rgba(68, 105, 96, .12), transparent 48%),
    #111413;
  box-shadow: 0 15px 24px #000, inset 0 1px var(--metal-highlight);
}

.material-v2 .dropdown a {
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px),
    #151817;
}

.material-v2 .dropdown a:hover,
.material-v2 .dropdown a:focus-visible {
  background:
    linear-gradient(90deg, rgba(84, 143, 130, .38), rgba(28, 48, 44, .78)),
    #18201e;
}

.material-v2 .info-frame {
  box-shadow:
    inset 0 11px 18px rgba(0, 0, 0, .54),
    inset 0 -9px 14px rgba(0, 0, 0, .48);
}

.material-v2 .info-grid,
.material-v2 .side-section,
.material-v2 .news-card {
  position: relative;
  box-shadow:
    0 1px rgba(143, 153, 147, .22),
    0 4px 9px rgba(0, 0, 0, .82),
    inset 1px 1px rgba(147, 157, 151, .08),
    inset -1px -1px rgba(0, 0, 0, .82);
}

.material-v2 .info-grid::after,
.material-v2 .side-section::after,
.material-v2 .news-card::after {
  position: absolute;
  inset: 0;
  z-index: 8;
  content: "";
  background:
    radial-gradient(circle at 6px 6px, #747b77 0 1px, #111513 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at calc(100% - 6px) 6px, #747b77 0 1px, #111513 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at 6px calc(100% - 6px), #555b58 0 1px, #090b0a 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at calc(100% - 6px) calc(100% - 6px), #555b58 0 1px, #090b0a 1.5px 3px, transparent 3.5px);
  pointer-events: none;
}

.material-v2 .info-heading,
.material-v2 .side-title,
.material-v2 .news-header {
  box-shadow:
    inset 0 1px var(--metal-highlight),
    inset 0 -1px rgba(0, 0, 0, .92),
    0 2px 4px rgba(0, 0, 0, .72);
}

.material-v2 .info-heading {
  background:
    linear-gradient(100deg, rgba(82, 126, 115, .2), transparent 43%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 4px),
    linear-gradient(#282c2a, #141716 64%, #080a09);
}

.material-v2 .side-title {
  background-image:
    linear-gradient(100deg, rgba(87, 132, 121, .22), transparent 56%, rgba(0, 0, 0, .2)),
    url("../../../assets/ap-bl_sh.png");
  background-position: left top, left top;
  background-size: 100% 49px, 312px 49px;
  background-repeat: no-repeat;
  background-blend-mode: screen, normal;
}

.material-v2 .news-header {
  background-image:
    linear-gradient(100deg, rgba(89, 135, 124, .19), transparent 55%, rgba(0, 0, 0, .28)),
    url("../../../assets/ap-news_t.jpg");
  background-position: center, center top;
  background-size: 100% 50px, 100% 50px;
  background-repeat: no-repeat;
  background-blend-mode: screen, normal;
}

.material-v2 .side-content,
.material-v2 .release-list,
.material-v2 .news-body {
  border-color: #242a27 #050706 #050706 #303531;
  box-shadow:
    inset 0 1px 4px #000,
    inset 12px 0 22px rgba(0, 0, 0, .3),
    inset -12px 0 22px rgba(0, 0, 0, .32);
}

.material-v2 .news-body {
  background-image:
    linear-gradient(90deg, rgba(73, 113, 103, .07), transparent 22%, transparent 78%, rgba(38, 68, 61, .07)),
    repeating-linear-gradient(0deg, rgba(178, 190, 184, .018) 0 1px, transparent 1px 4px),
    url("../../../assets/ap-news_c.png");
  background-position: center;
  background-size: 100% 100%, 100% 4px, 100% 10px;
  background-repeat: no-repeat, repeat, repeat-y;
}

.material-v2 .side-content,
.material-v2 .release-list {
  background-image:
    radial-gradient(ellipse at 18% 0, rgba(77, 114, 105, .09), transparent 55%),
    repeating-linear-gradient(0deg, rgba(163, 176, 169, .018) 0 1px, transparent 1px 5px);
  background-color: rgba(7, 10, 9, .9);
}

.material-v2 .info-panel {
  border-right-color: #040605;
  box-shadow: 1px 0 rgba(115, 128, 121, .24), inset -8px 0 15px rgba(0, 0, 0, .26);
}

.material-v2 .video-box {
  background:
    radial-gradient(ellipse at 50% 35%, rgba(64, 99, 90, .13), transparent 43%),
    repeating-linear-gradient(0deg, rgba(160, 176, 168, .018) 0 1px, transparent 1px 4px),
    #070909;
  border-color: #080a09;
  box-shadow:
    inset 0 0 0 1px #303632,
    inset 0 0 58px #000,
    0 1px rgba(111, 125, 118, .18);
}

.material-v2 .compact-item {
  color: #8f9591;
  border-color: #2b302d #101312 #0a0c0b #333936;
  background:
    linear-gradient(100deg, rgba(64, 99, 91, .09), transparent 58%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px),
    #161918;
  box-shadow: inset 0 1px rgba(153, 164, 157, .04);
}

.material-v2 .compact-item:hover,
.material-v2 .compact-item:focus-visible {
  color: #e1e8e4;
  border-color: #4c6a62 #183029 #10211d #537269;
  background:
    linear-gradient(100deg, rgba(73, 129, 116, .35), rgba(19, 31, 28, .72) 68%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .022) 0 1px, transparent 1px 4px),
    #17201e;
  box-shadow: inset 0 1px rgba(159, 196, 186, .18), inset 0 0 14px rgba(54, 95, 85, .2);
}

.material-v2 .compact-more {
  background:
    linear-gradient(90deg, rgba(53, 85, 77, .12), transparent 64%),
    #090b0a;
  box-shadow: inset 0 1px rgba(127, 138, 132, .08);
}

.material-v2 .compact-more:hover,
.material-v2 .compact-more:focus-visible {
  background:
    linear-gradient(90deg, rgba(62, 111, 99, .3), transparent 72%),
    #111614;
}

.material-v2 .body-top {
  position: relative;
  box-shadow: inset 0 1px rgba(142, 151, 146, .12), 0 3px 8px #000;
}

.material-v2 .page-body {
  box-shadow: inset 0 12px 24px rgba(0, 0, 0, .45);
}

.material-v2 .main-layout {
  position: relative;
}

.material-v2 .main-layout::before {
  width: 7px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 328px;
  z-index: 0;
  content: "";
  background:
    radial-gradient(circle at 50% 12px, #747c77 0 1px, #0b0e0d 1.5px 3px, transparent 3.5px) center top / 7px 94px repeat-y,
    linear-gradient(90deg, #050606, #343a36 37%, #0b0d0c 52%, #202522 72%, #030404);
  border-top: 1px solid #444b47;
  border-bottom: 1px solid #010202;
  box-shadow: 1px 0 rgba(111, 123, 116, .14), -1px 0 #000;
}

.material-v2 .sidebar,
.material-v2 .news-column {
  position: relative;
  z-index: 1;
}

.material-v2 .login-form input[type="text"],
.material-v2 .login-form input[type="password"] {
  border-color: #252b28 #101311 #080a09 #303632;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .016) 0 1px, transparent 1px 4px),
    #0e1210;
  box-shadow: inset 0 2px 5px #030504, 0 1px rgba(126, 137, 130, .07);
}

.material-v2 .login-form input:focus {
  border-color: #537268;
  box-shadow: inset 0 2px 5px #020403, 0 0 7px rgba(87, 139, 126, .22);
}

.material-v2 .login-button {
  border-color: #444b47 #111412 #080a09 #525954;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 4px),
    linear-gradient(#39413d, #171b19);
  box-shadow: inset 0 1px rgba(192, 201, 195, .15), 0 1px 2px #000;
}

.material-v2 .login-button:hover,
.material-v2 .login-button:focus-visible {
  border-color: #64877d #1c332d #0e1e1a #71968b;
  background: linear-gradient(#3e5b53, #1b2d28);
  box-shadow: inset 0 1px rgba(186, 220, 210, .2), 0 0 8px rgba(75, 130, 116, .2);
}

.material-v2 .profile-links a {
  border-top-color: #242925;
  background:
    linear-gradient(90deg, rgba(57, 88, 80, .08), transparent 55%),
    rgba(17, 20, 19, .82);
}

.material-v2 .profile-links a:hover,
.material-v2 .profile-links a:focus-visible {
  background:
    linear-gradient(90deg, rgba(70, 126, 112, .34), transparent 78%),
    #171d1a;
}

.material-v2 .release-card {
  box-shadow: inset 0 0 0 1px #313632, inset 0 0 24px #000;
}

.material-v2 .release-card::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background:
    linear-gradient(135deg, rgba(129, 149, 140, .12), transparent 28%),
    radial-gradient(ellipse at center, transparent 43%, rgba(0, 0, 0, .62));
  box-shadow: inset 0 0 0 1px rgba(110, 122, 115, .16);
  pointer-events: none;
}

.material-v2 .release-card strong,
.material-v2 .release-category,
.material-v2 .release-rating {
  z-index: 2;
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .022) 0 1px, transparent 1px 4px),
    rgba(7, 10, 9, .91);
  box-shadow: inset 0 1px rgba(139, 150, 143, .09);
}

.material-v2 .news-card {
  transition: filter .22s ease;
}

.material-v2 .news-card:hover {
  filter: drop-shadow(0 4px 7px rgba(0, 0, 0, .52));
}

.material-v2 .news-card:hover .news-header {
  box-shadow:
    inset 0 1px rgba(183, 196, 188, .34),
    inset 0 -1px rgba(0, 0, 0, .92),
    inset 0 0 18px rgba(75, 117, 107, .11),
    0 2px 4px rgba(0, 0, 0, .72);
}

.material-v2 .news-card:hover .news-header h1,
.material-v2 .news-card:hover .news-header h2 {
  text-shadow: 0 0 12px rgba(224, 226, 154, .68);
}

.material-v2 .news-image {
  border-color: #39413c;
  box-shadow:
    0 0 0 1px #050706,
    0 0 0 4px #151a17,
    0 0 0 5px #3a423d,
    2px 3px 8px #000;
}

.material-v2 .news-image:hover,
.material-v2 .news-image:focus-visible {
  box-shadow:
    0 0 0 1px #08100d,
    0 0 0 4px #1a2823,
    0 0 0 5px #58756c,
    0 0 12px rgba(74, 126, 113, .24);
}

.material-v2 .news-body p a {
  color: #d8d1a2;
  text-shadow: 0 0 7px rgba(214, 211, 147, .15);
}

.material-v2 .news-body p a:hover,
.material-v2 .news-body p a:focus-visible {
  color: #fffbd1;
  text-shadow: 0 0 9px rgba(231, 232, 165, .45);
}

.material-v2 .site-footer {
  position: relative;
  box-shadow: inset 0 12px 22px rgba(0, 0, 0, .38);
}

.material-v2 .site-footer::before {
  top: 7px;
}

@media (max-width: 920px) {
  .material-v2 .main-layout::before {
    display: none;
  }

  .material-v2 .side-title {
    background-size: 100% 49px, 100% 49px;
  }
}

@media (max-width: 680px) {
  .material-v2 .site-shell::before {
    opacity: .14;
  }

  .material-v2 .nav-toggle {
    border-color: #35443f #101412 #080a09 #43554f;
    background:
      linear-gradient(100deg, rgba(67, 112, 101, .23), transparent 62%),
      repeating-linear-gradient(0deg, rgba(255, 255, 255, .022) 0 1px, transparent 1px 4px),
      rgba(8, 13, 11, .94);
    box-shadow: inset 0 1px rgba(160, 174, 166, .13), inset 0 0 12px #000, 0 2px 5px #000;
  }

  .material-v2 .main-nav.is-open .nav-toggle {
    border-color: #56736a #15221e #0a100e #617e75;
    box-shadow: inset 0 0 18px rgba(64, 111, 99, .26), 0 2px 5px #000;
  }

  .material-v2 .nav-list {
    border-top: 1px solid rgba(105, 121, 113, .16);
    background:
      repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px),
      rgba(7, 10, 9, .98);
    box-shadow: inset 0 10px 18px #000;
  }

  .material-v2 .nav-list > li {
    border-color: #242b27 #090b0a #060807 #303a35;
  }

  .material-v2 .info-grid::after,
  .material-v2 .side-section::after,
  .material-v2 .news-card::after {
    opacity: .74;
  }

  .material-v2 .news-header {
    background-size: 100% 100%, auto 68px;
  }

  .material-v2 .news-body {
    background-size: 100% 100%, 100% 4px, auto 10px;
  }
}

@media (max-width: 920px) {
  .site-header {
    height: 132px;
    background-position: left top;
    background-size: 900px auto;
  }

  .main-nav {
    min-height: 54px;
    background-size: auto 65px;
  }

  .nav-list {
    padding-right: 10px;
    padding-left: 10px;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: #38413e #0b0d0c;
  }

  .nav-list > li {
    flex: 0 0 auto;
  }

  .nav-list > li > .nav-label {
    padding-right: 15px;
    padding-left: 15px;
  }

  .info-frame {
    padding-right: 16px;
    padding-left: 16px;
  }

  .info-grid {
    grid-template-columns: 1.4fr 1fr;
  }

  .video-panel {
    grid-row: span 2;
  }

  .blogs-panel {
    border-top: 1px solid #303331;
  }

  .compact-item {
    height: 36px;
  }

  .compact-item:nth-child(4) {
    display: none;
  }

  .main-layout {
    grid-template-columns: minmax(250px, 30%) minmax(0, 1fr);
    gap: 10px;
    padding-right: 14px;
    padding-left: 14px;
  }

  .side-title {
    background-size: 100% 49px;
  }

  .news-header h1,
  .news-header h2 {
    max-width: 100%;
    padding-right: 0;
  }

  .news-header {
    padding-bottom: 24px;
  }

  .news-meta {
    top: auto;
    right: 12px;
    bottom: 8px;
  }

  .news-body {
    grid-template-columns: minmax(180px, 42%) minmax(0, 1fr);
  }

  .news-image {
    width: 100%;
  }
}

@media (max-width: 680px) {
  body {
    font-size: 13px;
  }

  .site-shell {
    box-shadow: none;
  }

  .site-header {
    height: 104px;
    background-position: left top;
    background-size: auto 655px;
  }

  .main-nav {
    min-height: 56px;
    overflow: visible;
    background-position: center top;
    background-size: auto 65px;
  }

  .nav-toggle {
    width: calc(100% - 28px);
    height: 39px;
    margin: 10px 14px 7px;
    padding: 0 13px;
    display: flex;
    align-items: center;
    gap: 11px;
    color: #d8dedd;
    border: 1px solid #25302d;
    background: rgba(11, 17, 16, .86);
    box-shadow: inset 0 0 9px #000;
    font: 17px "WarHelios", "Arial Narrow", sans-serif;
    text-transform: uppercase;
    cursor: pointer;
  }

  .nav-toggle-lines,
  .nav-toggle-lines::before,
  .nav-toggle-lines::after {
    width: 19px;
    height: 2px;
    display: block;
    background: #bcc5c2;
  }

  .nav-toggle-lines {
    position: relative;
  }

  .nav-toggle-lines::before,
  .nav-toggle-lines::after {
    position: absolute;
    left: 0;
    content: "";
  }

  .nav-toggle-lines::before {
    top: -6px;
  }

  .nav-toggle-lines::after {
    top: 6px;
  }

  .nav-list {
    height: auto;
    max-height: 0;
    padding: 0 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    opacity: 0;
    background: rgba(8, 10, 10, .98);
    transition: max-height .28s ease, opacity .2s ease, padding .28s ease;
  }

  .main-nav.is-open .nav-list {
    max-height: 380px;
    padding-top: 3px;
    padding-bottom: 12px;
    opacity: 1;
  }

  .nav-list > li,
  .nav-list .home-item,
  .nav-list .wide-item {
    width: auto;
    height: 37px;
    flex: initial;
    background: none;
    border: 1px solid #1c201f;
  }

  .nav-list > li > .nav-label {
    padding: 0 8px;
    font-size: 16px;
    line-height: 35px;
  }

  .dropdown {
    display: none !important;
  }

  .info-frame {
    padding: 30px 13px 33px;
    background-size: auto 32px;
  }

  .info-frame::before,
  .info-frame::after {
    background-size: auto 34px;
  }

  .info-grid {
    display: block;
  }

  .info-panel {
    border-right: 0;
    border-bottom: 1px solid #343735;
    box-shadow: none;
  }

  .info-panel:last-child {
    border-bottom: 0;
  }

  .video-box {
    min-height: 176px;
  }

  .compact-item {
    height: 40px;
  }

  .compact-item:nth-child(4) {
    display: block;
  }

  .compact-more {
    min-height: 31px;
  }

  .body-top {
    background-size: auto 15px;
  }

  .page-body {
    padding-bottom: 14px;
    background-size: auto 34px;
  }

  .main-layout {
    padding: 0 9px;
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  .news-column {
    width: 100%;
    order: 1;
  }

  .sidebar {
    width: 100%;
    order: 2;
  }

  .news-card {
    margin-bottom: 10px;
  }

  .news-header {
    min-height: 68px;
    padding: 12px 14px 26px;
    background-size: auto 68px;
  }

  .news-header h1,
  .news-header h2 {
    font-size: 21px;
    line-height: 24px;
    white-space: normal;
  }

  .news-meta {
    right: 13px;
    bottom: 8px;
    left: 14px;
    justify-content: flex-end;
    gap: 10px;
    font-size: 10px;
  }

  .news-body {
    padding: 8px 13px 10px;
    display: block;
    background-size: auto 10px;
  }

  .news-image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    margin-bottom: 12px;
  }

  .news-body p {
    line-height: 1.42;
  }

  .news-footer {
    background-size: auto 10px;
  }

  .side-title {
    width: 100%;
    margin-left: 0;
    background-size: 100% 49px;
  }

  .side-content,
  .release-list {
    margin-right: 4px;
    margin-left: 4px;
  }

  .release-card {
    height: min(240px, 61vw);
  }

  .site-footer {
    padding: 28px 20px 16px;
    background-size: auto 110px;
    line-height: 1.5;
  }
}

@media (max-width: 390px) {
  .site-header {
    height: 94px;
    background-size: auto 590px;
  }

  .nav-list > li > .nav-label {
    font-size: 15px;
  }

  .info-frame {
    padding-right: 10px;
    padding-left: 10px;
  }

  .video-box {
    min-height: 158px;
  }

  .main-layout {
    padding-right: 6px;
    padding-left: 6px;
  }

  .news-header h1,
  .news-header h2 {
    font-size: 19px;
  }

  .news-body {
    padding-right: 11px;
    padding-left: 11px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* --------------------------------------------------------------------------
   Project skin: FORPOST / oxidised orange
   -------------------------------------------------------------------------- */

.material-v2.project-orange {
  --shell-edge-width: 6px;
  /* Масштаб текстуры зависит только от ширины, не от раскрытых задач и длины ленты. */
  --surface-background: linear-gradient(#0003, #0003), #101010 url("../../../assets/background.webp") center top / 100% auto repeat-y;
  --surface-panel: repeating-linear-gradient(0deg, #cbb69305 0 1px, transparent 1px 4px), #141310;
  --surface-border: #453f35;
  --surface-input: #100f0d;
  --heading: #df8248;
  --heading-glow: rgba(225, 91, 28, .62);
  --cyan: #efb082;
  --orange: #f06424;
  --metal-highlight: rgba(190, 150, 124, .3);
  --patina: rgba(174, 67, 24, .38);
  --patina-bright: rgba(226, 104, 48, .4);
  --warm-light: rgba(238, 137, 71, .34);
  --rust-dark: #1b0c06;
  --rust-mid: #713019;
  --rust: #bd4c1d;
  --rust-bright: #e87835;
  color: #a29b96;
  background: #080909;
}

/* Внешняя текстура нужна только там, где видны поля вокруг каркаса. */
@media (min-width: 1103px) {
  .material-v2.project-orange {
    background:
      linear-gradient(#0006, #0006),
      #080909 url("../../../assets/background_2.webp") center top repeat;
  }
}

.material-v2.project-orange .site-shell {
  container-type: inline-size;
  width: min(100%, calc(var(--page-width) + 2 * var(--shell-edge-width)));
  padding-inline: var(--shell-edge-width);
  background:
    url("../../../assets/shell-edge.png") left top / var(--shell-edge-width) auto repeat-y,
    url("../../../assets/shell-edge.png") right top / var(--shell-edge-width) auto repeat-y,
    #0d0907;
  box-shadow: 0 0 24px #000;
}

.material-v2.project-orange .site-shell::before,
.material-v2.project-orange .site-shell::after {
  content: none;
}

@media (max-width: 920px) {
  .material-v2.project-orange {
    --shell-edge-width: 0px;
  }

  .material-v2.project-orange .site-shell {
    background: #0d0907;
    box-shadow: none;
  }
}

.material-v2.project-orange .site-header {
  isolation: isolate;
  background-color: #150a05;
  background-image:
    linear-gradient(90deg, rgba(12, 6, 3, .12) 0, rgba(15, 7, 3, .08) 36%, rgba(10, 5, 3, .74) 64%, rgba(5, 3, 2, .94) 100%),
    linear-gradient(rgba(213, 97, 38, .13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(213, 97, 38, .13) 1px, transparent 1px),
    linear-gradient(rgba(177, 57, 13, .34), rgba(49, 18, 7, .46)),
    url("../../../assets/news-stalker-2.jpg"),
    url("../../../assets/release-chronicles.jpg");
  background-position: center, right top, right top, center, 3% 42%, center;
  background-size: 100% 100%, 42px 42px, 42px 42px, 100% 100%, 56% auto, cover;
  background-repeat: no-repeat, repeat, repeat, no-repeat, no-repeat, no-repeat;
  background-blend-mode: normal, screen, screen, color, normal, normal;
  box-shadow:
    inset 0 1px rgba(226, 175, 141, .2),
    inset 0 -19px 24px rgba(0, 0, 0, .58),
    0 2px 7px #000;
}

.material-v2.project-orange .project-brand {
  width: 47%;
  position: absolute;
  top: 31px;
  right: 28px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--rust-bright);
  text-align: center;
  text-transform: uppercase;
}

.material-v2.project-orange .project-brand strong {
  position: relative;
  font: 700 52px/.9 "DejaVu Serif", Georgia, serif;
  letter-spacing: 3px;
  text-shadow:
    1px 2px 0 #351208,
    -1px -1px 0 rgba(244, 153, 94, .2),
    0 0 16px rgba(198, 67, 18, .38);
}

.material-v2.project-orange .project-brand strong::after {
  position: absolute;
  inset: 0;
  content: "ФОРПОСТ";
  color: transparent;
  background: repeating-linear-gradient(0deg, transparent 0 5px, rgba(20, 7, 3, .36) 5px 7px);
  background-clip: text;
  -webkit-background-clip: text;
  pointer-events: none;
}

.material-v2.project-orange .project-brand span {
  margin-top: 8px;
  color: #a94a24;
  font: 18px/1 "WarHelios", "Arial Narrow", sans-serif;
  letter-spacing: 4px;
  text-shadow: 0 1px #000, 0 0 8px rgba(177, 62, 21, .24);
}

.material-v2.project-orange .project-tagline {
  position: absolute;
  right: 30px;
  bottom: 17px;
  z-index: 3;
  width: 46%;
  margin: 0;
  color: #b69784;
  font: 10px/1 "WarHelios", "Arial Narrow", sans-serif;
  letter-spacing: 1.6px;
  text-align: center;
  text-shadow: 0 1px 2px #000;
  text-transform: uppercase;
}

/* Поворачиваем ту же полосу; её длина равна ширине контейнера. */
.material-v2.project-orange .site-header::after,
.material-v2.project-orange .site-footer::before,
.material-v2.project-orange .captcha-header::after,
.material-v2.project-orange .bot-composer::before,
.material-v2.project-orange .chats-toolbar::after {
  content: "";
  position: absolute;
  top: 6px;
  right: auto;
  bottom: auto;
  left: 0;
  width: 6px;
  height: 100cqw;
  background: #0d0d0d url("../../../assets/shell-edge.png") left top / 6px auto repeat-y;
  border: 0;
  box-shadow: none;
  transform: rotate(-90deg);
  transform-origin: top left;
  pointer-events: none;
}

.material-v2.project-orange .main-nav {
  background-color: #110906;
  background-image:
    linear-gradient(rgba(161, 61, 21, .26), rgba(42, 18, 9, .2)),
    url("../../../assets/menu.jpg");
  background-position: center, center top;
  background-size: 100% 65px, 1090px 65px;
  background-repeat: no-repeat;
  background-blend-mode: color, normal;
  border-top-color: #432214;
  border-bottom-color: #060201;
  box-shadow:
    inset 0 1px rgba(195, 128, 86, .18),
    inset 0 -10px 16px rgba(0, 0, 0, .52),
    0 4px 9px #000;
}

.material-v2.project-orange .nav-list > li > .nav-label:hover,
.material-v2.project-orange .nav-list > li > .nav-label:focus-visible {
  color: #fff3eb;
  box-shadow:
    inset 0 1px rgba(238, 159, 105, .24),
    inset 0 -1px rgba(0, 0, 0, .78),
    inset 0 0 19px rgba(191, 70, 24, .46);
  text-shadow: 0 0 9px rgba(241, 122, 61, .6), 1px -1px #000;
}

.material-v2.project-orange .dropdown {
  background:
    linear-gradient(105deg, rgba(149, 60, 25, .16), transparent 48%),
    #160d09;
  box-shadow: 0 15px 24px #000, inset 0 1px rgba(192, 134, 98, .24);
}

.material-v2.project-orange .dropdown a {
  border-color: #362119 #362119 #0f0805;
  background:
    repeating-linear-gradient(0deg, rgba(255, 228, 210, .018) 0 1px, transparent 1px 4px),
    #1a100c;
}

.material-v2.project-orange .dropdown a:hover,
.material-v2.project-orange .dropdown a:focus-visible {
  border-color: #764027;
  background:
    linear-gradient(90deg, rgba(183, 70, 25, .42), rgba(56, 25, 12, .8)),
    #25130c;
}

.material-v2.project-orange .info-grid,
.material-v2.project-orange .side-section,
.material-v2.project-orange .news-card {
  box-shadow:
    0 1px rgba(180, 126, 91, .22),
    0 4px 9px rgba(0, 0, 0, .84),
    inset 1px 1px rgba(198, 141, 105, .08),
    inset -1px -1px rgba(0, 0, 0, .84);
}

.material-v2.project-orange .info-grid::after,
.material-v2.project-orange .side-section::after,
.material-v2.project-orange .news-card::after {
  background:
    radial-gradient(circle at 6px 6px, #a26440 0 1px, #211008 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at calc(100% - 6px) 6px, #a26440 0 1px, #211008 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at 6px calc(100% - 6px), #6f412a 0 1px, #100805 1.5px 3px, transparent 3.5px),
    radial-gradient(circle at calc(100% - 6px) calc(100% - 6px), #6f412a 0 1px, #100805 1.5px 3px, transparent 3.5px);
}

.material-v2.project-orange .info-heading,
.material-v2.project-orange .side-title,
.material-v2.project-orange .news-header {
  box-shadow:
    inset 0 1px rgba(211, 160, 126, .3),
    inset 0 -1px rgba(0, 0, 0, .94),
    0 2px 4px rgba(0, 0, 0, .75);
}

.material-v2.project-orange .info-heading {
  color: #d8c7bc;
  background:
    linear-gradient(100deg, rgba(164, 67, 29, .26), transparent 47%),
    repeating-linear-gradient(0deg, rgba(255, 232, 216, .025) 0 1px, transparent 1px 4px),
    linear-gradient(#30221b, #18110d 64%, #090604);
}

.material-v2.project-orange .side-title {
  color: var(--heading);
  background-image:
    linear-gradient(100deg, rgba(188, 72, 27, .34), transparent 58%, rgba(18, 7, 3, .28)),
    url("../../../assets/ap-bl_sh.png");
  background-blend-mode: color, normal;
}

.material-v2.project-orange .news-header {
  background-image:
    linear-gradient(100deg, rgba(188, 72, 27, .3), transparent 57%, rgba(17, 7, 3, .3)),
    url("../../../assets/ap-news_t.jpg");
  background-blend-mode: color, normal;
}

.material-v2.project-orange .news-header h1 a,
.material-v2.project-orange .news-header h2 a {
  color: var(--heading);
}

.material-v2.project-orange .news-header h1 a:hover,
.material-v2.project-orange .news-header h2 a:hover {
  color: #ffd6bb;
}

.material-v2.project-orange .news-meta {
  color: #725646;
}

.material-v2.project-orange .side-content,
.material-v2.project-orange .release-list,
.material-v2.project-orange .news-body {
  border-color: #38241a #090403 #060302 #442b1e;
}

.material-v2.project-orange .news-body {
  background-image:
    linear-gradient(90deg, rgba(155, 60, 24, .09), transparent 23%, transparent 76%, rgba(112, 43, 17, .08)),
    linear-gradient(rgba(172, 73, 31, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(172, 73, 31, .035) 1px, transparent 1px),
    repeating-linear-gradient(0deg, rgba(220, 175, 145, .016) 0 1px, transparent 1px 4px),
    url("../../../assets/ap-news_c.png");
  background-position: center, left top, left top, center, center;
  background-size: 100% 100%, 34px 34px, 34px 34px, 100% 4px, 100% 10px;
  background-repeat: no-repeat, repeat, repeat, repeat, repeat-y;
}

.material-v2.project-orange .side-content,
.material-v2.project-orange .release-list {
  background-image:
    radial-gradient(ellipse at 18% 0, rgba(153, 60, 25, .12), transparent 55%),
    linear-gradient(rgba(157, 64, 28, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(157, 64, 28, .025) 1px, transparent 1px),
    repeating-linear-gradient(0deg, rgba(211, 167, 137, .016) 0 1px, transparent 1px 5px);
  background-position: center, left top, left top, center;
  background-size: 100% 100%, 34px 34px, 34px 34px, 100% 5px;
  background-color: rgba(12, 7, 5, .92);
}

.material-v2.project-orange .info-panel {
  box-shadow: 1px 0 rgba(173, 116, 80, .24), inset -8px 0 15px rgba(0, 0, 0, .28);
}

.material-v2.project-orange .video-box {
  background:
    radial-gradient(ellipse at 50% 35%, rgba(156, 61, 25, .16), transparent 43%),
    linear-gradient(rgba(157, 64, 28, .028) 1px, transparent 1px) 0 0 / 36px 36px,
    linear-gradient(90deg, rgba(157, 64, 28, .028) 1px, transparent 1px) 0 0 / 36px 36px,
    repeating-linear-gradient(0deg, rgba(220, 177, 148, .016) 0 1px, transparent 1px 4px),
    #090503;
  border-color: #0d0704;
  box-shadow: inset 0 0 0 1px #493025, inset 0 0 58px #000, 0 1px rgba(178, 121, 84, .18);
}

.material-v2.project-orange .video-play {
  border-color: #9a4e28;
  background: rgba(34, 11, 3, .78);
  box-shadow: 0 0 16px rgba(199, 72, 22, .3);
}

.material-v2.project-orange .video-play::after {
  border-left-color: #e98c55;
}

.material-v2.project-orange .compact-item {
  color: #a49c96;
  border-color: #403029 #1a0e09 #0d0705 #4a352c;
  background:
    linear-gradient(100deg, rgba(144, 57, 25, .12), transparent 59%),
    repeating-linear-gradient(0deg, rgba(255, 226, 206, .018) 0 1px, transparent 1px 4px),
    #1a1210;
  box-shadow: inset 0 1px rgba(215, 169, 139, .05);
}

.material-v2.project-orange .compact-item:hover,
.material-v2.project-orange .compact-item:focus-visible {
  color: #f0dfd3;
  border-color: #8f4b2b #422012 #261008 #a05732;
  background:
    linear-gradient(100deg, rgba(185, 68, 23, .42), rgba(51, 23, 12, .76) 68%),
    repeating-linear-gradient(0deg, rgba(255, 230, 211, .022) 0 1px, transparent 1px 4px),
    #25140d;
  box-shadow: inset 0 1px rgba(235, 172, 130, .2), inset 0 0 14px rgba(145, 50, 18, .25);
}

.material-v2.project-orange .compact-item small {
  color: #6c5041;
}

.material-v2.project-orange .compact-more {
  background:
    linear-gradient(90deg, rgba(139, 53, 22, .16), transparent 64%),
    #0d0805;
}

.material-v2.project-orange .compact-more:hover,
.material-v2.project-orange .compact-more:focus-visible {
  color: #ffe3d2;
  background:
    linear-gradient(90deg, rgba(180, 66, 23, .36), transparent 72%),
    #1a0e09;
}

.material-v2.project-orange .body-top {
  filter: sepia(.35) saturate(1.45) hue-rotate(337deg);
}

.material-v2.project-orange .main-layout::before {
  background:
    radial-gradient(circle at 50% 12px, #a96742 0 1px, #170b06 1.5px 3px, transparent 3.5px) center top / 7px 94px repeat-y,
    linear-gradient(90deg, #080302, #5a2b19 37%, #190b06 52%, #3c1d11 72%, #050201);
  border-top-color: #75432b;
  border-bottom-color: #030101;
  box-shadow: 1px 0 rgba(177, 101, 62, .16), -1px 0 #000;
}

.material-v2.project-orange .login-form input[type="text"],
.material-v2.project-orange .login-form input[type="password"] {
  border-color: #38251c #170b07 #0b0503 #453025;
  background:
    repeating-linear-gradient(0deg, rgba(255, 226, 207, .016) 0 1px, transparent 1px 4px),
    #130c09;
}

.material-v2.project-orange .login-form input:focus {
  border-color: #9d5431;
  box-shadow: inset 0 2px 5px #050201, 0 0 8px rgba(190, 70, 24, .25);
}

.material-v2.project-orange .login-button {
  border-color: #64422f #251108 #100603 #785038;
  background:
    repeating-linear-gradient(0deg, rgba(255, 230, 212, .025) 0 1px, transparent 1px 4px),
    linear-gradient(#56301f, #201008);
}

.material-v2.project-orange .login-button:hover,
.material-v2.project-orange .login-button:focus-visible {
  border-color: #b66135 #572712 #2d1006 #c67549;
  background: linear-gradient(#88401f, #35170b);
  box-shadow: inset 0 1px rgba(251, 187, 143, .2), 0 0 8px rgba(186, 63, 18, .25);
}

.material-v2.project-orange .profile-links a {
  border-top-color: #34231a;
  background:
    linear-gradient(90deg, rgba(137, 52, 22, .11), transparent 55%),
    rgba(22, 14, 10, .84);
}

.material-v2.project-orange .profile-links a:hover,
.material-v2.project-orange .profile-links a:focus-visible {
  color: #f3dfd2;
  background:
    linear-gradient(90deg, rgba(181, 67, 23, .39), transparent 78%),
    #24130c;
}

.material-v2.project-orange .checkmark,
.material-v2.project-orange .remember input:checked + .checkmark {
  background: var(--rust-bright);
}

.material-v2.project-orange .release-card strong,
.material-v2.project-orange .release-category,
.material-v2.project-orange .release-rating {
  color: #e29662;
  background:
    repeating-linear-gradient(0deg, rgba(255, 229, 211, .022) 0 1px, transparent 1px 4px),
    rgba(15, 7, 4, .92);
}

.material-v2.project-orange .release-card::after {
  background:
    linear-gradient(135deg, rgba(192, 92, 40, .16), transparent 28%),
    linear-gradient(rgba(176, 66, 23, .08), rgba(55, 19, 7, .12)),
    radial-gradient(ellipse at center, transparent 43%, rgba(0, 0, 0, .65));
}

.material-v2.project-orange .news-card:hover {
  filter: drop-shadow(0 4px 8px rgba(67, 20, 4, .54));
}

.material-v2.project-orange .news-card:hover .news-header {
  box-shadow:
    inset 0 1px rgba(229, 174, 139, .34),
    inset 0 -1px rgba(0, 0, 0, .94),
    inset 0 0 19px rgba(164, 56, 19, .16),
    0 2px 4px rgba(0, 0, 0, .75);
}

.material-v2.project-orange .news-card:hover .news-header h1,
.material-v2.project-orange .news-card:hover .news-header h2 {
  text-shadow: 0 0 13px rgba(235, 119, 57, .72);
}

.material-v2.project-orange .news-image {
  border-color: #5c3928;
  box-shadow:
    0 0 0 1px #090301,
    0 0 0 4px #21120b,
    0 0 0 5px #5e3a28,
    2px 3px 8px #000;
}

.material-v2.project-orange .news-image:hover,
.material-v2.project-orange .news-image:focus-visible {
  box-shadow:
    0 0 0 1px #160703,
    0 0 0 4px #352013,
    0 0 0 5px #a75b34,
    0 0 13px rgba(191, 67, 21, .3);
}

.material-v2.project-orange .news-body p a {
  color: #e6a071;
  text-shadow: 0 0 7px rgba(221, 97, 39, .16);
}

.material-v2.project-orange .news-body p a:hover,
.material-v2.project-orange .news-body p a:focus-visible {
  color: #ffd4b7;
  text-shadow: 0 0 10px rgba(239, 116, 55, .5);
}

.material-v2.project-orange .site-footer {
  color: #684838;
  background-color: #0b0503;
  filter: sepia(.2) saturate(1.15);
}

.material-v2.project-orange .footer-line {
  width: 100%;
  margin: 4px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px 0;
  text-align: center;
}

.material-v2.project-orange .footer-line > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.material-v2.project-orange .footer-line > span + span::before {
  margin: 0 8px;
  color: #3d291f;
  content: "|";
}

@media (max-width: 920px) {
  .material-v2.project-orange .site-header {
    background-position: center, right top, right top, center, -5% 42%, center;
    background-size: 100% 100%, 38px 38px, 38px 38px, 100% 100%, 62% auto, cover;
  }

  .material-v2.project-orange .project-brand {
    right: 18px;
  }

  .material-v2.project-orange .project-brand strong {
    font-size: 43px;
  }

  .material-v2.project-orange .project-brand span {
    font-size: 15px;
    letter-spacing: 3px;
  }
}

@media (max-width: 680px) {
  .material-v2.project-orange .site-header {
    height: 112px;
    background-position: center, right top, right top, center, -28px 45%, center;
    background-size: 100% 100%, 31px 31px, 31px 31px, 100% 100%, 73% auto, cover;
  }

  .material-v2.project-orange .project-brand {
    width: 55%;
    top: 23px;
    right: 9px;
  }

  .material-v2.project-orange .project-brand strong {
    font-size: 31px;
    letter-spacing: 2px;
  }

  .material-v2.project-orange .project-brand span {
    margin-top: 5px;
    font-size: 11px;
    letter-spacing: 2px;
  }

  .material-v2.project-orange .project-tagline {
    right: 9px;
    bottom: 15px;
    width: 55%;
    font-size: 7px;
    letter-spacing: .8px;
  }

  .material-v2.project-orange .nav-toggle {
    color: #f1d9ca;
    border-color: #663c28 #211009 #0f0603 #78482f;
    background:
      linear-gradient(100deg, rgba(171, 64, 23, .3), transparent 62%),
      repeating-linear-gradient(0deg, rgba(255, 232, 216, .022) 0 1px, transparent 1px 4px),
      rgba(17, 9, 5, .96);
    box-shadow: inset 0 1px rgba(225, 169, 132, .14), inset 0 0 12px #000, 0 2px 5px #000;
  }

  .material-v2.project-orange .nav-toggle-lines,
  .material-v2.project-orange .nav-toggle-lines::before,
  .material-v2.project-orange .nav-toggle-lines::after {
    background: #d98a59;
  }

  .material-v2.project-orange .main-nav.is-open .nav-toggle {
    border-color: #9b5632 #3c1a0d #1f0a04 #ad673f;
    box-shadow: inset 0 0 18px rgba(166, 56, 18, .3), 0 2px 5px #000;
  }

  .material-v2.project-orange .nav-list {
    border-top-color: rgba(164, 104, 68, .2);
    background:
      linear-gradient(rgba(145, 54, 20, .09), rgba(20, 9, 5, .05)),
      repeating-linear-gradient(0deg, rgba(255, 230, 213, .018) 0 1px, transparent 1px 4px),
      rgba(12, 7, 4, .98);
  }

  .material-v2.project-orange .nav-list > li {
    border-color: #3d271d #150a06 #0d0503 #4a3023;
  }

  .material-v2.project-orange .news-header {
    background-size: 100% 100%, auto 68px;
  }

  .material-v2.project-orange .news-body {
    background-size: 100% 100%, 31px 31px, 31px 31px, 100% 4px, auto 10px;
  }

  .material-v2.project-orange .footer-legal-line > span:first-child {
    flex-basis: 100%;
  }

  .material-v2.project-orange .footer-legal-line > span:nth-child(2)::before {
    display: none;
  }
}

@media (max-width: 390px) {
  .material-v2.project-orange .site-header {
    height: 104px;
    background-position: center, right top, right top, center, -35px 46%, center;
    background-size: 100% 100%, 29px 29px, 29px 29px, 100% 100%, 78% auto, cover;
  }

  .material-v2.project-orange .project-brand {
    top: 22px;
  }

  .material-v2.project-orange .project-brand strong {
    font-size: 27px;
    letter-spacing: 1.5px;
  }

  .material-v2.project-orange .project-brand span {
    font-size: 9px;
    letter-spacing: 1.3px;
  }

  .material-v2.project-orange .project-tagline {
    bottom: 14px;
    font-size: 6px;
    letter-spacing: .6px;
  }
}

/* Exact project banner. It only scales down, so the source WebP is not
   enlarged and its lower edge with the composition remains visible. */
.material-v2.project-orange .site-header {
  width: 100%;
  height: auto;
  min-height: 0;
  padding-bottom: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  background:
    linear-gradient(rgba(179, 68, 24, .055) 1px, transparent 1px) 0 0 / 42px 42px,
    linear-gradient(90deg, rgba(179, 68, 24, .055) 1px, transparent 1px) 0 0 / 42px 42px,
    radial-gradient(ellipse at center, #211008, #050302 74%);
}

.material-v2.project-orange .project-header-image {
  width: min(100%, 911px);
  height: auto;
  display: block;
  flex: 0 0 auto;
}

.material-v2.project-orange .site-header::after {
  top: calc(100% - 1px);
  right: auto;
  bottom: auto;
  left: 0;
}

.material-v2.project-orange .nav-label[aria-disabled="true"] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
  color: #a7988c;
  cursor: default;
  pointer-events: none;
  gap: 3px;
}
.nav-label small { font: 10px/1.2 Arial, sans-serif; text-transform: none; color: #a58b77; }
.material-v2.project-orange .nav-label[aria-current="page"] {
  color: #f0cba7;
  box-shadow: inset 0 -2px #ac673e;
  background-color: rgba(135, 72, 36, .13);
}
.main-nav a:focus-visible, .nav-toggle:focus-visible { outline: 2px solid #e7ab7d; outline-offset: -4px; }
@media (max-width: 680px) {
  .main-nav .nav-toggle { height: 44px; }
  .main-nav .nav-list > li { height: 46px; }
}

@media (min-width: 681px) {
  .material-v2.project-orange .site-header {
    width: 100%;
    height: calc(clamp(212px, 31.1vw, 339px) + 12px);
    margin-left: 0;
    left: auto;
    z-index: auto;
  }

  .material-v2.project-orange .project-header-image {
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
  }

  .material-v2.project-orange .nav-list > .home-item,
  .material-v2.project-orange .nav-list > .home-item > .nav-label {
    border-radius: 20px 0 0 20px;
  }

  .material-v2.project-orange .nav-list > .home-item {
    flex: 1 1 auto;
  }

  .material-v2.project-orange .nav-list > .home-item,
  .material-v2.project-orange .nav-list > li:last-child {
    overflow: hidden;
  }

  .material-v2.project-orange .nav-list > li:last-child,
  .material-v2.project-orange .nav-list > li:last-child > .nav-label {
    border-radius: 0 20px 20px 0;
  }
}

.material-v2.project-orange .home-item > .nav-label {
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  justify-content: center;
  gap: 8px;
}

.material-v2.project-orange .empty-page {
  min-height: 0;
  flex: 1 0 auto;
  border-top: 1px solid #2c170e;
  border-bottom: 1px solid #080302;
  background:
    radial-gradient(ellipse at 50% 0, rgba(110, 48, 23, .09), transparent 62%),
    repeating-linear-gradient(0deg, rgba(255, 225, 205, .012) 0 1px, transparent 1px 4px),
    #090909;
  box-shadow: inset 0 14px 28px rgba(0, 0, 0, .72);
}

.material-v2.project-orange .site-footer {
  flex: 0 0 auto;
  margin-top: auto;
}

.material-v2.project-orange .site-footer::before {
  top: 6px;
  right: auto;
  left: 0;
}
