/* ==========================================================================
   Тема «Тру-крайм» - /temy/true-crime/
   Темный «архив улик»: почти черный фон, кровавый красный, бумага досье.
   ========================================================================== */

@font-face { font-family: "Oswald"; src: url("../fonts/oswald-cyrillic-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Oswald"; src: url("../fonts/oswald-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2190-21FF, U+2212; }
@font-face { font-family: "Oswald"; src: url("../fonts/oswald-cyrillic-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Oswald"; src: url("../fonts/oswald-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2190-21FF, U+2212; }

/* шапка и подвал на этой странице всегда темные */
.hl-tc-page { background: #0A0909; }
.hl-tc-page .hl-header, .hl-tc-page .hl-searchbar, .hl-tc-page .hl-footer {
	--paper: #0C0B0B; --soft: #151212; --ink: #EFE6DA; --dust: rgba(96,9,13,.22); --brass: #D23A3A; --brass-light: #E85A55; --card: #171414; --muted: #A59A8C; --faint: #6F665C;
	color-scheme: dark;
}
.hl-tc-page .hl-themebtn { display: none; }

.tc {
	--bg: #08090B;
	--bg2: #110F0E;
	--bg3: #181514;
	--line: #34292544;
	--line2: #3D302B;
	--txt: #EFE6DA;
	--mut: #A59A8C;
	--dim: #6F665C;
	--red: #7A0C12;
	--red2: #8E1A1F;
	--blood: #60090D;
	--paper: #E6D7BB;
	--paper2: #D9C6A3;
	--ink: #2A1D14;
	--disp: "Oswald", "Arial Narrow", "Roboto Condensed", sans-serif;
	--left: 170px;
	position: relative;
	background: #07080A url("../img/tc-bg.jpg") center top / cover fixed no-repeat;
	color: var(--txt);
	font-family: var(--sans);
	overflow-x: clip;
}
.tc a { text-decoration: none; color: inherit; }
.tc img { display: block; }
.tc button { font-family: inherit; }
.tc svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.tc-in { position: relative; max-width: 1320px; margin: 0 auto; padding: 0 32px 0 calc(var(--left) + 16px); }
.tc-in--wide { max-width: 1680px; padding: 0 24px; }
.tc-kicker { margin: 0 0 10px; font: 500 12px/1.3 var(--disp); letter-spacing: .2em; text-transform: uppercase; color: var(--mut); }
.tc-h { margin: 0; font: 700 44px/1.05 var(--disp); text-transform: uppercase; letter-spacing: .01em; color: #F5EDE2; }
.tc-lead { margin: 10px 0 0; max-width: 760px; font-size: 16px; line-height: 1.5; color: var(--mut); }
.tc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 26px; }

.tc .tc-btn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border: 1px solid var(--red); border-radius: 3px; background: var(--blood); color: #fff; font: 500 14px var(--sans); font-style: normal; cursor: pointer; }
.tc .tc-btn:hover { background: var(--red); }
.tc .tc-btn--ghost { background: transparent; border-color: var(--line2); color: var(--txt); }
.tc .tc-btn--ghost:hover { background: rgba(96,9,13,.18); border-color: var(--red); }

/* ---------- Указатель слева ---------- */
.tc-nav { position: fixed; left: max(0px, calc(50% - 660px)); top: 50%; z-index: 30; width: var(--left); transform: translateY(-50%); padding-left: 24px; opacity: 0; pointer-events: none; transition: opacity .25s; color: var(--dim); }
.tc-nav.is-shown { opacity: 1; pointer-events: auto; }
.tc-nav__h { margin: 0 0 18px; font: 500 13px/1 var(--disp); letter-spacing: .2em; text-transform: uppercase; }
.tc-nav ol { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 1px solid #3D302B; }
.tc-nav li { position: relative; }
.tc-nav a { display: block; padding: 10px 0 10px 14px; font-size: 15px; color: var(--mut); }
.tc-nav a span { display: inline-block; width: 28px; font-family: var(--disp); }
.tc-nav li::before { content: ""; position: absolute; left: -19px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-radius: 50%; background: #4A3B35; }
.tc-nav li.is-on a { color: #fff; }
.tc-nav li.is-on::before { background: var(--red2); box-shadow: 0 0 0 3px rgba(120,16,22,.25), 0 0 12px var(--red2); }
.tc-nav a:hover { color: #fff; }

/* ---------- Баннер ---------- */
.tc-hero { position: relative; min-height: 380px; overflow: hidden; border-bottom: 1px solid #2A2120;
	background:
		linear-gradient(90deg, rgba(6,7,9,.92) 0%, rgba(6,7,9,.55) 34%, rgba(6,7,9,0) 55%, rgba(6,7,9,.35) 78%, rgba(6,7,9,.8) 100%),
		linear-gradient(0deg, rgba(8,8,10,1) 0%, rgba(8,8,10,0) 40%),
		url("../img/tc-hero.jpg") center 8% / cover no-repeat,
		radial-gradient(60% 120% at 74% 40%, rgba(120,14,18,.32), transparent 60%),
		radial-gradient(40% 80% at 10% 0%, rgba(255,255,255,.05), transparent 70%),
		linear-gradient(180deg, #121010 0%, #0A0909 100%); }
.tc-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .22; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }
.tc-hero__bg { position: absolute; inset: 0; pointer-events: none; }
.tc-hero__man { display: none; position: absolute; left: calc(50% - 330px); bottom: -30px; width: 190px; height: auto; fill: #050404 !important; stroke: none !important; opacity: .95; filter: drop-shadow(0 0 30px rgba(0,0,0,.9)); }
.tc-board { display: none; position: absolute; left: calc(50% - 250px); width: 420px; top: 8px; bottom: 8px; }
.tc-board__strings { position: absolute; inset: 0; width: 100%; height: 100%; }
.tc-board__strings polyline { stroke: #6E0B10; stroke-width: 1.6; fill: none; opacity: .85; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 3px rgba(120,16,22,.6)); }
.tc-polaroid { position: absolute; margin: 0; width: 92px; padding: 6px 6px 18px; background: #E9E1D1; box-shadow: 0 8px 18px rgba(0,0,0,.6); transform: rotate(var(--r, -4deg)); }
.tc-polaroid img, .tc-polaroid .tc-nophoto { width: 100%; height: 96px; object-fit: cover; object-position: center 20%; filter: grayscale(1) sepia(.35) contrast(1.15) brightness(.85); }
.tc-polaroid figcaption { position: absolute; left: 6px; right: 6px; bottom: 3px; font: 500 9px/1.1 var(--disp); color: #3B2A20; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc-polaroid::before { content: ""; position: absolute; top: -5px; left: 50%; width: 11px; height: 11px; margin-left: -5px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #a3242a, #60090d 70%); box-shadow: 0 2px 3px rgba(0,0,0,.6); z-index: 1; }
.tc-polaroid--0 { left: 4%; top: 6%; --r: -6deg; }
.tc-polaroid--1 { left: 30%; top: 26%; --r: 4deg; }
.tc-polaroid--2 { left: 56%; top: 2%; --r: -3deg; }
.tc-polaroid--3 { left: 80%; top: 30%; --r: 7deg; }
.tc-polaroid--4 { left: 47%; top: 60%; --r: -8deg; }
.tc-print { position: absolute; left: 14%; top: 58%; width: 70px; color: #CBB99A; opacity: .5; transform: rotate(-12deg); }
.tc-tape { position: absolute; left: 44%; right: -10%; height: 30px; display: flex; align-items: center; overflow: hidden; white-space: nowrap; background: repeating-linear-gradient(90deg, #C9A62A 0 100%); color: #111; font: 700 16px/1 var(--disp); letter-spacing: .06em; box-shadow: 0 6px 16px rgba(0,0,0,.55); }
.tc-tape span { display: block; padding-left: 10px; }
.tc-tape--1 { display: none; top: 12%; left: calc(50% + 120px); right: -8%; transform: rotate(8deg); }
.tc-tape--2 { top: auto; bottom: 26px; left: calc(50% - 300px); width: 560px; transform: rotate(-5deg); opacity: .92; }
.tc-hero__in { position: relative; z-index: 2; padding-top: 18px; padding-bottom: 30px; }
.tc-hero .hl-crumbs { margin: 0 0 6px; padding: 0; }
.tc-hero .hl-crumbs, .tc-hero .hl-crumbs a, .tc-hero .hl-crumbs [aria-current] { color: #8C8073; }
.tc-hero__grid { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.tc-hero__text { position: relative; z-index: 2; max-width: 520px; }
.tc-hero__h { margin: 0; font: 700 96px/.9 var(--serif); letter-spacing: -.01em; text-transform: uppercase; color: #F2ECE2; text-shadow: 0 4px 0 rgba(0,0,0,.6); }
.tc-hero__h span, .tc-hero__h em { font-style: normal; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.2 1.75'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.2 1.75'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.tc-hero__h em { color: var(--red2); }
.tc-hero__sub { margin: 8px 0 0; font: 400 28px/1.15 var(--sans); color: #fff; }
.tc-hero__lead { margin: 10px 0 0; font-size: 15px; line-height: 1.5; color: #C9BEB0; }
.tc-stats { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex: none; width: 600px; border: 1px solid rgba(120,16,22,.55); border-radius: 4px; background: rgba(10,8,8,.82); box-shadow: 0 0 30px rgba(96,9,13,.25), inset 0 0 20px rgba(96,9,13,.12); backdrop-filter: blur(3px); }
.tc-stats > div { padding: 14px 16px 12px; border-left: 1px solid rgba(120,16,22,.3); }
.tc-stats > div:first-child { border-left: 0; }
.tc-stats svg { width: 24px; height: 24px; color: var(--red2); fill: none; }
.tc-stats b { display: block; margin-top: 8px; font: 700 34px/1 var(--serif); color: #fff; white-space: nowrap; }
.tc-stats > div:last-child b { font-size: 30px; letter-spacing: -.02em; }
.tc-stats span { display: block; margin-top: 6px; font-size: 13px; line-height: 1.3; color: var(--mut); }

/* ---------- Атлас: полоса регионов и фильтры ---------- */
.tc-atlas { position: relative; padding: 16px 0 28px; background: rgba(7,8,10,.82); }
.tc-bar { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; }
.tc-regions { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 1 auto; }
.tc-rb, .tc-view button, .tc-filters select, .tc-reset, .tc-tabs button, .tc-chip, .tc-sort, .tc-sortsel select { height: 38px; padding: 0 15px; border: 1px solid var(--line2); border-radius: 3px; background: rgba(22,18,17,.9); color: #DDD2C4; font: 500 14px var(--sans); cursor: pointer; white-space: nowrap; }
.tc-rb:hover, .tc-view button:hover, .tc-reset:hover, .tc-tabs button:hover, .tc-chip:hover { border-color: #7A2A2A; color: #fff; }
.tc-rb.is-on, .tc-view button[aria-pressed="true"], .tc-tabs .is-on, .tc-chip.is-on { border-color: var(--red2); background: linear-gradient(180deg, #6E0B10, #40060A); color: #fff; box-shadow: 0 0 14px rgba(120,16,22,.35); }
.tc-rb:disabled { opacity: .35; cursor: default; }
.tc-search { position: relative; display: flex; align-items: center; flex: 0 1 340px; height: 38px; border: 1px solid var(--line2); border-radius: 3px; background: rgba(22,18,17,.9); }
.tc-search svg { width: 17px; height: 17px; margin: 0 8px 0 12px; color: var(--mut); flex: none; }
.tc-search input { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; color: var(--txt); font: 400 14px var(--sans); outline: 0; }
.tc-search input::placeholder { color: var(--dim); }
.tc-search:focus-within { border-color: var(--red2); }
.tc-search__list { position: absolute; left: -1px; right: -1px; top: 100%; z-index: 40; display: none; max-height: 340px; overflow: auto; background: #151212; border: 1px solid var(--line2); border-top: 0; }
.tc-search__list.is-open { display: block; }
.tc-search__list button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 12px; border: 0; background: none; color: var(--txt); font-size: 14px; text-align: left; cursor: pointer; }
.tc-search__list button:hover, .tc-search__list button.is-act { background: rgba(96,9,13,.25); }
.tc-search__list img, .tc-search__list .tc-nophoto { width: 28px; height: 34px; object-fit: cover; flex: none; filter: grayscale(1); }
.tc-search__list small { margin-left: auto; color: var(--mut); }
.tc-view { display: flex; gap: 8px; flex: none; }
.tc-view button { display: inline-flex; align-items: center; gap: 8px; min-width: 150px; justify-content: center; }
.tc-view svg { width: 17px; height: 17px; }
.tc-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 10px; }
.tc-filters select, .tc-sortsel select { padding-right: 34px; appearance: none; -webkit-appearance: none; background: rgba(22,18,17,.9) 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='%23A59A8C' stroke-width='2.6' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") right 12px center no-repeat; }
.tc-filters select.is-set { border-color: var(--red2); color: #fff; }
.tc-reset { display: inline-flex; align-items: center; gap: 8px; border-color: transparent; background: none; color: var(--mut); }
.tc-reset svg { width: 16px; height: 16px; }

/* ---------- Сцена: список слева, карта, досье ---------- */
.tc-stage { position: relative; display: grid; grid-template-columns: 240px minmax(0, 1fr) 390px; gap: 14px; margin-top: 12px; height: clamp(500px, 60vh, 600px); }
.tc-big { display: flex; flex-direction: column; min-height: 0; padding: 14px 12px; border: 1px solid rgba(120,16,22,.55); border-radius: 4px; background: rgba(14,11,11,.9); box-shadow: inset 0 0 22px rgba(96,9,13,.12); }
.tc-big__h { margin: 0 0 8px; font: 700 20px/1.1 var(--disp); color: #B48A55; }
.tc-big__h span { display: block; color: #fff; font-weight: 500; font-size: 16px; }
.tc-big ul { list-style: none; margin: 0; padding: 0; overflow: auto; flex: 1; scrollbar-width: thin; scrollbar-color: #4a2422 transparent; }
.tc-big button { display: grid; grid-template-columns: 54px 1fr 10px; gap: 10px; align-items: center; width: 100%; padding: 6px 2px; border: 0; border-bottom: 1px solid #2A2120; background: none; color: var(--txt); text-align: left; cursor: pointer; }
.tc-big button:hover, .tc-big button.is-on { background: rgba(96,9,13,.16); }
.tc-big__img img, .tc-big__img .tc-nophoto { width: 54px; height: 62px; object-fit: cover; object-position: center 20%; filter: grayscale(1) contrast(1.1); }
.tc-big b { display: block; font-size: 14px; line-height: 1.2; }
.tc-big em, .tc-big small { display: block; font-style: normal; font-size: 12px; color: var(--mut); }
.tc-big i { color: var(--red2); font-style: normal; }
.tc-big__all { margin-top: 10px; color: #B48A55; font-size: 14px; }
.tc-big__all:hover { color: #fff; }

.tc-map { position: relative; min-width: 0; border: 1px solid #2E2422; border-radius: 4px; background: #0B0A0A; overflow: hidden; touch-action: none; }
.tc-map canvas, .tc-map svg.tc-map__pts { position: absolute; inset: 0; width: 100%; height: 100%; }
.tc-map__pts { cursor: grab; stroke: none !important; fill: none; }
.tc-map__pts text { stroke-width: 0; }
.tc-map__pts:active { cursor: grabbing; }
.tc-map::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 80px 10px rgba(0,0,0,.85); }
.tc-map__zoom { position: absolute; left: 12px; top: 12px; z-index: 3; display: flex; flex-direction: column; gap: 6px; }
.tc-map__zoom button { width: 36px; height: 36px; border: 1px solid var(--line2); border-radius: 3px; background: rgba(16,13,13,.9); color: #fff; font: 400 20px/1 var(--sans); cursor: pointer; display: grid; place-items: center; }
.tc-map__zoom button:hover { border-color: var(--red2); }
.tc-map__zoom svg { width: 18px; height: 18px; }
.tc-legend { position: absolute; left: 12px; bottom: 12px; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; max-width: 220px; padding: 8px 12px; border: 1px solid var(--line2); border-radius: 3px; background: rgba(12,10,10,.88); font-size: 12px; color: #D6CABB; }
.tc-legend p { flex-basis: 100%; margin: 0 0 2px; }
.tc-legend span { display: inline-flex; align-items: center; gap: 5px; }
.tc-legend i { display: inline-block; border-radius: 50%; background: var(--red2); box-shadow: 0 0 6px var(--red2); }
.tc-legend .s1 { width: 6px; height: 6px; } .tc-legend .s2 { width: 9px; height: 9px; } .tc-legend .s3 { width: 13px; height: 13px; } .tc-legend .s4 { width: 16px; height: 16px; }
.tc-map__note { position: absolute; left: 50%; top: 12px; z-index: 3; transform: translateX(-50%); margin: 0; padding: 6px 12px; border: 1px solid rgba(120,16,22,.6); border-radius: 3px; background: rgba(12,10,10,.92); font-size: 13px; color: #fff; white-space: nowrap; }
.tc-map__note button { margin-left: 10px; border: 0; background: none; color: #B48A55; cursor: pointer; font-size: 13px; }
.tc-noscript { position: absolute; inset: 40% 10% auto; color: var(--mut); text-align: center; }

/* точки и подписи на карте (SVG) */
.tc-pt { cursor: pointer; }
.tc-pt circle.c { fill: #9E1A1F; stroke: #C0534C; stroke-width: .8; filter: drop-shadow(0 0 4px rgba(150,20,26,.9)); }
.tc-pt.is-dim { opacity: .28; }
.tc-pt.is-on circle.c { fill: #fff; stroke: var(--red2); stroke-width: 3; }
.tc-cl circle.c { fill: rgba(96,9,13,.85); stroke: #7E1015; stroke-width: 2; filter: drop-shadow(0 0 10px rgba(120,16,22,.9)); }
.tc-cl text { fill: #fff; font: 700 15px var(--sans); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.tc-cl:hover circle.c { fill: #6E0B10; }
.tc-ph rect.f { fill: #EDE5D6; filter: drop-shadow(0 3px 6px rgba(0,0,0,.8)); }
.tc-ph rect.b { fill: none; stroke: var(--red2); stroke-width: 2; }
.tc-ph image { filter: grayscale(1) contrast(1.1); }
.tc-ph path.tail { fill: #EDE5D6; }
.tc-ph:hover rect.b, .tc-ph.is-on rect.b { stroke: #fff; stroke-width: 3; }
.tc-route { fill: none; stroke: #9A2228; stroke-width: 2; stroke-dasharray: 6 5; filter: drop-shadow(0 0 4px rgba(120,16,22,.9)); pointer-events: none; animation: tc-dash 1.2s linear infinite; }
@keyframes tc-dash { to { stroke-dashoffset: -22; } }
.tc-stop circle { fill: #120C0C; stroke: #9A2228; stroke-width: 2; }
.tc-stop text { fill: #fff; font: 700 11px var(--sans); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.tc-stop .lbl { fill: #fff; font: 500 12px var(--sans); text-anchor: start; paint-order: stroke; stroke: #000; stroke-width: 3px; dominant-baseline: central; }
.tc-lbl { fill: #E9DFD0; font: 500 13px var(--sans); text-anchor: middle; paint-order: stroke; stroke: rgba(0,0,0,.85); stroke-width: 3px; pointer-events: none; }
.tc-lbl--ocean { fill: rgba(200,190,175,.5); font: italic 400 14px var(--serif); stroke: none; }
.tc-lbl--state { fill: rgba(233,223,208,.62); font: 500 10px var(--sans); letter-spacing: .04em; stroke-width: 2.5px; }
.tc-pulse { fill: none; stroke: #fff; stroke-width: 2; pointer-events: none; animation: tc-pulse 1.6s ease-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes tc-pulse { from { opacity: .9; transform: scale(1); } to { opacity: 0; transform: scale(2.6); } }
.tc-tip { position: absolute; z-index: 5; padding: 6px 10px; border: 1px solid var(--line2); border-radius: 3px; background: rgba(12,10,10,.95); color: #fff; font-size: 13px; pointer-events: none; white-space: nowrap; transform: translate(-50%, calc(-100% - 12px)); }
.tc-tip small { display: block; color: var(--mut); font-size: 12px; }

/* ---------- Досье ---------- */
.tc-dossier { position: relative; min-height: 0; outline: 0; }
.tc-dos { position: relative; height: 100%; display: flex; flex-direction: column; padding: 34px 18px 14px; color: var(--ink); border-radius: 3px;
	background:
		radial-gradient(120% 80% at 80% 10%, rgba(255,250,235,.5), transparent 60%),
		radial-gradient(60% 60% at 10% 90%, rgba(120,80,40,.25), transparent 70%),
		linear-gradient(180deg, #E9DCC1, #D8C49E);
	box-shadow: 0 10px 30px rgba(0,0,0,.6), 6px 6px 0 -1px #BFA77E, 6px 6px 0 0 #8C7552; }
.tc-dos::before { content: ""; position: absolute; inset: 0; opacity: .5; pointer-events: none; mix-blend-mode: multiply; border-radius: 3px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .42 0 0 0 0 .28 0 0 0 .35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.tc-dos > * { position: relative; }
.tc-dos__x { position: absolute; right: -10px; top: -10px; z-index: 2; width: 34px; height: 34px; border: 2px solid #E9DCC1; border-radius: 50%; background: #1A1414; color: #fff; font-size: 16px; cursor: pointer; }
.tc-dos__tabs { position: absolute; left: 14px; right: 14px; top: -1px; display: flex; gap: 2px; transform: translateY(-60%); }
.tc-dos__tabs button { flex: 1; height: 28px; padding: 0 6px; border: 1px solid #A88E66; border-bottom: 0; border-radius: 6px 6px 0 0; background: #CDB78F; color: #4A3726; font: 500 12px var(--sans); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc-dos__tabs button.is-on { background: #E9DCC1; color: #1E140D; font-weight: 700; }
.tc-dos__top { display: grid; grid-template-columns: 150px 1fr; gap: 14px; }
.tc-dos__photo { position: relative; padding: 6px 6px 8px; background: #F4EEE2; box-shadow: 0 4px 10px rgba(60,40,20,.4); transform: rotate(-1.5deg); }
.tc-dos__photo img, .tc-dos__photo .tc-nophoto { width: 100%; height: 170px; object-fit: cover; object-position: center 18%; filter: grayscale(1) contrast(1.08); }
.tc-dos__photo::before { content: ""; position: absolute; top: -7px; left: 40%; width: 34px; height: 16px; background: rgba(214,200,170,.8); transform: rotate(-4deg); box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.tc-dos__no { margin: 0; font: 700 13px/1 var(--serif); letter-spacing: .08em; text-transform: uppercase; color: #3A2A1D; text-align: right; }
.tc-dos__print { display: block; width: 74px; margin: 10px 0 0 auto; color: #5A4632; opacity: .7; }
.tc-stamp { display: inline-block; margin: 12px 0 0; padding: 4px 10px; border: 3px double #7A0C12; color: #7A0C12; font: 700 18px/1.05 var(--disp); text-transform: uppercase; letter-spacing: .03em; transform: rotate(-7deg); opacity: .88; mix-blend-mode: multiply; }
.tc-dos__name { margin: 12px 0 0; font: 700 28px/1.05 var(--serif); color: #1A120C; }
.tc-dos__orig { margin: 2px 0 0; font-size: 14px; color: #5E4A36; }
.tc-dos__body { flex: 1; min-height: 0; overflow: auto; margin-top: 10px; padding-right: 4px; scrollbar-width: thin; scrollbar-color: #A88E66 transparent; }
.tc-dos table { width: 100%; border-collapse: collapse; font-size: 13px; }
.tc-dos th { width: 38%; padding: 4px 8px 4px 0; border-bottom: 1px solid rgba(90,70,50,.25); color: #5E4A36; font-weight: 400; text-align: left; vertical-align: top; }
.tc-dos td { padding: 4px 0; border-bottom: 1px solid rgba(90,70,50,.25); color: #1A120C; font-weight: 600; vertical-align: top; }
.tc-dos__card { margin: 10px 0 0; font-size: 14px; line-height: 1.45; color: #2A1D14; }
.tc-dos__ch { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid #7A0C12; }
.tc-dos__ch li { position: relative; margin: 0 0 10px; font-size: 14px; line-height: 1.35; }
.tc-dos__ch li::before { content: ""; position: absolute; left: -20px; top: 5px; width: 10px; height: 10px; border-radius: 50%; background: #7A0C12; }
.tc-dos__ch b { display: block; font: 700 13px var(--disp); color: #60090D; }
.tc-dos__pl { list-style: none; margin: 0; padding: 0; counter-reset: pl; }
.tc-dos__pl button { display: grid; grid-template-columns: 26px 1fr auto; gap: 8px; align-items: center; width: 100%; padding: 6px 0; border: 0; border-bottom: 1px solid rgba(90,70,50,.25); background: none; color: #1A120C; font-size: 14px; text-align: left; cursor: pointer; }
.tc-dos__pl button:hover { background: rgba(96,9,13,.08); }
.tc-dos__pl i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #1A1414; color: #fff; font: 700 11px var(--sans); font-style: normal; }
.tc-dos__pl small { color: #6E5944; }
.tc-dos__rel a, .tc-dos__rel button { display: grid; grid-template-columns: 44px 1fr; gap: 10px; align-items: center; width: 100%; padding: 6px 0; border: 0; border-bottom: 1px solid rgba(90,70,50,.25); background: none; color: #1A120C; text-align: left; cursor: pointer; font-size: 14px; }
.tc-dos__rel img, .tc-dos__rel .tc-nophoto { width: 44px; height: 52px; object-fit: cover; filter: grayscale(1); }
.tc-dos__rel small { display: block; color: #6E5944; font-size: 12px; }
.tc-dos__empty { color: #6E5944; font-size: 14px; }
.tc-dos__foot { display: flex; gap: 8px; align-items: center; margin-top: 12px; }
.tc-dos__more { flex: 1; justify-content: center; height: 42px; background: linear-gradient(180deg, #60090D, #6A0B0F); border-color: #5A090C; }
.tc-dos__arr { width: 42px; height: 42px; flex: none; border: 1px solid #A88E66; border-radius: 3px; background: rgba(255,255,255,.35); color: #1A120C; font-size: 20px; cursor: pointer; }
.tc-dos__arr:hover { background: #1A1414; color: #fff; }
.tc-dos__pos { font-size: 12px; color: #6E5944; white-space: nowrap; }
.tc-dossier__empty { height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 24px; border: 1px dashed #4A3B35; border-radius: 4px; color: var(--mut); text-align: center; }
.tc-dossier__empty b { font: 700 22px var(--disp); color: #fff; text-transform: uppercase; }

/* ---------- Шкала времени ---------- */
.tc-time { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 14px; padding: 10px 14px; border: 1px solid #2E2422; border-radius: 4px; background: rgba(14,11,11,.9); }
.tc-play { width: 50px; height: 50px; border: 2px solid #D6CABB; border-radius: 50%; background: none; color: #fff; cursor: pointer; display: grid; place-items: center; }
.tc-play svg { width: 22px; height: 22px; fill: currentColor; stroke: none; }
.tc-play.is-on { border-color: var(--red2); color: var(--red2); }
.tc-time__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.tc-time__head b { font: 500 22px var(--disp); color: #fff; }
.tc-time__head span { font-size: 13px; color: var(--mut); }
.tc-time__track { position: relative; height: 46px; margin: 4px 9px 0; }
.tc-time__hist { position: absolute; inset: 0; width: 100%; height: 100%; }
.tc-time__track::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #4A3B35; }
.tc-time__sel { position: absolute; top: 0; bottom: 0; border-left: 2px solid var(--red2); border-right: 2px solid var(--red2); background: rgba(96,9,13,.14); pointer-events: none; }
.tc-time__h { position: absolute; bottom: -9px; width: 18px; height: 18px; margin-left: -9px; border: 2px solid var(--red2); border-radius: 50%; background: #fff; box-shadow: 0 0 8px var(--red2); cursor: ew-resize; touch-action: none; }
.tc-time__h:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.tc-time__axis { position: relative; height: 22px; margin: 10px 9px 0; font: 500 12px var(--disp); color: var(--mut); }
.tc-time__axis span { position: absolute; top: 0; transform: translateX(-50%); }
.tc-time__axis span.is-in { color: #B48A55; }

/* ---------- Список под картой ---------- */
.tc-list { margin-top: 14px; }
.tc-list__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; }
.tc-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.tc-tabs button { height: 34px; padding: 0 12px; font-size: 13px; }
.tc-sortsel { font-size: 13px; color: var(--mut); }
.tc-sortsel select { height: 34px; margin-left: 6px; font-size: 13px; }
.tc-carousel { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px; gap: 6px; align-items: center; margin-top: 10px; }
.tc-carousel__arr { height: 120px; border: 0; background: none; color: #D6CABB; font-size: 34px; cursor: pointer; }
.tc-carousel__arr:hover { color: var(--red2); }
.tc-cards { display: flex; gap: 12px; list-style: none; margin: 0; padding: 4px 2px 8px; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #4a2422 transparent; }
.tc-cards li { flex: 0 0 116px; scroll-snap-align: start; }
.tc-cards li[hidden] { display: none; }
.tc-cards button { display: block; width: 100%; padding: 0 0 6px; border: 1px solid transparent; background: none; color: var(--txt); text-align: left; cursor: pointer; }
.tc-cards__img img, .tc-cards__img .tc-nophoto { width: 100%; height: 132px; object-fit: cover; object-position: center 18%; border: 1px solid #3A2E2A; filter: grayscale(1) contrast(1.08); }
.tc-cards b { display: block; margin: 6px 4px 0; font-size: 13px; line-height: 1.2; }
.tc-cards em, .tc-cards small { display: block; margin: 2px 4px 0; font-style: normal; font-size: 12px; color: var(--mut); }
.tc-cards li.is-on button { border-color: var(--red2); box-shadow: 0 0 14px rgba(120,16,22,.4); }
.tc-cards li.is-on .tc-cards__img img { filter: grayscale(.2) contrast(1.05); }
.tc-cards button:hover b { color: #B9564F; }

/* заглушка без фото */
.tc-nophoto { position: relative; display: grid; place-items: center; background: linear-gradient(180deg, #2A2322, #171313); overflow: hidden; }
.tc-nophoto svg { width: 62%; height: auto; fill: #0C0A0A !important; stroke: none !important; margin-top: 18%; }
.tc-nophoto b { position: absolute; inset: 0; display: grid; place-items: center; font: 700 34px var(--serif); color: var(--red2); }

/* ---------- Секции ниже карты ---------- */
.tc-sec { position: relative; padding: 64px 0 70px; background: radial-gradient(70% 60% at 85% 0%, rgba(120,14,18,.16), transparent 70%), var(--bg); border-top: 1px solid #1E1817; }
.tc-sec--alt { background: radial-gradient(60% 60% at 0% 20%, rgba(120,14,18,.12), transparent 70%), #0E0C0C; }
.tc-sec--deep { background: rgba(5,6,8,.78); }

/* громкие дела */
.tc-shock { display: grid; grid-template-columns: 1.55fr 1fr; grid-template-rows: auto auto auto; gap: 12px; }
.tc-shock__main { position: relative; grid-row: span 2; display: block; min-height: 400px; overflow: hidden; border: 1px solid #2E2422; background: #120F0F; }
.tc-shock__main .tc-shock__img { position: absolute; inset: 0 0 0 38%; }
.tc-shock__main .tc-shock__img img, .tc-shock__main .tc-shock__img .tc-nophoto { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; filter: grayscale(1) sepia(.2) contrast(1.1); }
.tc-shock__main .tc-shock__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #120F0F 0%, rgba(18,15,15,.6) 30%, transparent 70%); }
.tc-shock__t { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; max-width: 52%; padding: 28px; }
.tc-shock__t em { font: 500 14px var(--disp); font-style: normal; color: #B48A55; }
.tc-shock__t b { font: 700 34px/1.05 var(--disp); text-transform: uppercase; color: #fff; }
.tc-shock__t > span { font-size: 15px; line-height: 1.5; color: #C9BEB0; }
.tc-shock__t .tc-btn { align-self: flex-start; margin-top: 8px; }
.tc-shock__side { position: relative; display: grid; grid-template-columns: 1fr 44%; min-height: 194px; overflow: hidden; border: 1px solid #2E2422; background: #120F0F; }
.tc-shock__side .tc-shock__t { max-width: none; padding: 20px; }
.tc-shock__side .tc-shock__t b { font-size: 24px; }
.tc-shock__side .tc-shock__img img, .tc-shock__side .tc-shock__img .tc-nophoto { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; filter: grayscale(1) contrast(1.1); }
.tc-shock__side > i { position: absolute; left: 20px; bottom: 16px; display: grid; place-items: center; width: 34px; height: 34px; background: var(--blood); color: #fff; font-style: normal; }
.tc-shock__row { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; list-style: none; margin: 0; padding: 0; }
.tc-shock__row a { position: relative; display: block; border: 1px solid #2E2422; background: #120F0F; }
.tc-shock__row img, .tc-shock__row .tc-nophoto { width: 100%; height: 130px; object-fit: cover; object-position: center 20%; filter: grayscale(1) contrast(1.1); }
.tc-shock__row b { display: block; padding: 8px 10px 0; font-size: 14px; color: #fff; }
.tc-shock__row em { display: block; padding: 2px 10px 10px; font-style: normal; font-size: 12px; color: var(--mut); }
.tc-shock__row i { position: absolute; right: 10px; bottom: 10px; color: var(--red2); font-style: normal; }
.tc-shock a:hover b { color: #B9564F; }

/* люди - сетка как у «Третьего рейха», в темном варианте */
.tc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 26px; }
.tc-chip { height: 36px; font-size: 14px; }
.tc-people { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 28px; list-style: none; margin: 0; padding: 0; }
.tc-people li { margin: 0; border-bottom: 1px solid #2A2120; }
.tc-people li[hidden] { display: none; }
.tc-people a { display: grid; grid-template-columns: 76px 1fr; gap: 14px; padding: 12px 0; }
.tc-people__img img, .tc-people__img .tc-nophoto { width: 76px; height: 90px; object-fit: cover; object-position: center 18%; filter: grayscale(1) contrast(1.1); }
.tc-people b { display: block; font: 700 17px/1.15 var(--disp); color: #F2EAE0; }
.tc-people em { display: block; margin: 4px 0 6px; font: 500 13px/1.2 var(--disp); font-style: normal; color: #A0433D; }
.tc-people__t > span { display: block; font-size: 13px; line-height: 1.35; color: var(--mut); }
.tc-people a:hover b { color: #B9564F; }

/* регионы */
.tc-regcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; }
.tc-regcards a { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 150px; padding: 14px; overflow: hidden; border: 1px solid #2E2422; background: #120F0F url("../img/tc-relief-2048.jpg") no-repeat; background-size: 900% auto; }
.tc-regcards a::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,7,7,.95), rgba(8,7,7,.15)); }
.tc-regcards b, .tc-regcards span, .tc-regcards i { position: relative; }
.tc-regcards b { font: 700 18px/1.1 var(--disp); text-transform: uppercase; color: #fff; }
.tc-regcards span { margin-top: 4px; font-size: 13px; color: #B48A55; }
.tc-regcards i { position: absolute; right: 14px; bottom: 14px; color: var(--red2); font-style: normal; }
.tc-regcards a:hover { border-color: var(--red2); box-shadow: 0 0 18px rgba(120,16,22,.3); }

/* материалы */
.tc-mat__bar { display: flex; gap: 10px; margin-top: 22px; }
.tc-search--wide { flex: 1 1 auto; height: 46px; }
.tc-sort { height: 46px; }
.tc-mat { list-style: none; margin: 0; padding: 0; border-top: 1px solid #2A2120; }
.tc-mat li[hidden] { display: none; }
.tc-mat a { display: grid; grid-template-columns: 120px 64px minmax(0, 1fr) 24px; gap: 18px; align-items: center; padding: 12px 6px; border-bottom: 1px solid #2A2120; }
.tc-mat a:hover { background: rgba(96,9,13,.08); }
.tc-mat__y b { display: block; font: 500 17px var(--disp); color: #F2EAE0; }
.tc-mat__y em { display: block; font-style: normal; font-size: 12px; color: var(--mut); }
.tc-mat__img img, .tc-mat__img .tc-nophoto { width: 64px; height: 74px; object-fit: cover; object-position: center 18%; filter: grayscale(1) contrast(1.1); }
.tc-mat__img--ev { display: grid; place-items: center; width: 64px; height: 74px; background: #191414; color: #B48A55; }
.tc-mat__img--ev svg { width: 28px; height: 28px; }
.tc-mat__t b { display: block; font: 700 18px/1.2 var(--disp); color: #F2EAE0; }
.tc-mat__t > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 4px; font-size: 14px; line-height: 1.4; color: var(--mut); }
.tc-mat > li > a > i { color: var(--red2); font-style: normal; }
.tc-tag { display: inline-block; margin-left: 8px; padding: 2px 7px; border: 1px solid rgba(120,16,22,.6); border-radius: 2px; font: 500 11px/1.3 var(--sans); color: #A65049; vertical-align: 3px; text-transform: none; }
.tc-mat__empty { color: var(--mut); }
.tc-more { margin-top: 18px; }
.tc-note { margin: 26px 0 0; font-size: 13px; color: var(--dim); }

/* ---------- Адаптивность ---------- */
@media (max-width: 1500px) {
	.tc-stage { grid-template-columns: 210px minmax(0, 1fr) 360px; }
	.tc-hero__man { left: 38%; }
}
@media (max-width: 1280px) {
	.tc-in { padding-left: 32px; }
	.tc-nav { display: none; }
	.tc-stage { grid-template-columns: minmax(0, 1fr) 360px; height: auto; }
	.tc-big { display: none; }
	.tc-map { height: clamp(460px, 62vh, 620px); }
	.tc-dossier { height: clamp(460px, 62vh, 620px); }
	.tc-stats { width: 440px; }
	.tc-stats b { font-size: 26px; }
	.tc-board { left: calc(50% - 200px); width: 340px; opacity: .5; }
	.tc-tape--1 { display: none; left: 55%; }
	.tc-people { grid-template-columns: repeat(3, 1fr); }
	.tc-shock__row { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 980px) {
	.tc-hero__grid { flex-direction: column; align-items: stretch; }
	.tc-stats { width: auto; }
	.tc-hero__h { font-size: 72px; }
	.tc-stage { grid-template-columns: 1fr; }
	.tc-dossier { height: auto; }
	.tc-dossier:empty { display: none; }
	.tc-dos { min-height: 0; }
	.tc-dos__body { overflow: visible; }
	.tc-people { grid-template-columns: repeat(2, 1fr); }
	.tc-shock { grid-template-columns: 1fr; }
	.tc-shock__main { grid-row: auto; }
	.tc-shock__t { max-width: 70%; }
	.tc-view button { min-width: 0; }
}
@media (max-width: 700px) {
	.tc-in, .tc-in--wide { padding: 0 14px; }
	.tc-hero { min-height: 0; }
	.tc-hero__man { left: auto; right: -30px; width: 130px; opacity: .6; }
	.tc-board { display: none; }
	.tc-tape--1 { display: none; left: 40%; top: auto; bottom: 0; height: 20px; font-size: 11px; transform: rotate(-4deg); opacity: .8; }
	.tc-tape--2 { display: none; }
	.tc-hero__h { font-size: 54px; }
	.tc-hero__sub { font-size: 21px; }
	.tc-stats { grid-template-columns: repeat(2, 1fr); }
	.tc-stats > div:nth-child(3) { border-left: 0; }
	.tc-stats > div:nth-child(n+3) { border-top: 1px solid rgba(120,16,22,.3); }
	.tc-stats b { font-size: 26px; }
	.tc-h { font-size: 30px; }
	.tc-regions { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.tc-search { flex: 1 1 100%; }
	.tc-view { flex: 1 1 100%; }
	.tc-view button { flex: 1; }
	.tc-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.tc-map { height: 64vh; min-height: 380px; }
	.tc-legend { display: none; }
	.tc-dos__top { grid-template-columns: 112px 1fr; }
	.tc-dos__photo img, .tc-dos__photo .tc-nophoto { height: 130px; }
	.tc-dos__name { font-size: 24px; }
	.tc-time { grid-template-columns: 44px minmax(0, 1fr); }
	.tc-play { width: 42px; height: 42px; }
	.tc-time > .tc-btn { grid-column: 1 / -1; justify-self: start; }
	.tc-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.tc-carousel { grid-template-columns: 1fr; }
	.tc-carousel__arr { display: none; }
	.tc-people { grid-template-columns: 1fr; }
	.tc-shock__t { max-width: 100%; padding: 18px; }
	.tc-shock__main { min-height: 360px; }
	.tc-shock__main .tc-shock__img { inset: 0; opacity: .45; }
	.tc-shock__side { grid-template-columns: 1fr 40%; }
	.tc-shock__row { grid-template-columns: repeat(2, 1fr); }
	.tc-mat a { grid-template-columns: 52px minmax(0, 1fr) 16px; gap: 12px; }
	.tc-mat__y { display: none; }
	.tc-mat__img img, .tc-mat__img .tc-nophoto, .tc-mat__img--ev { width: 52px; height: 62px; }
	.tc-mat__t b { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.tc-route, .tc-pulse { animation: none; }
}

/* города и регионы на карте */
.tc-city__dot { fill: #D8CBB6; stroke: #0A0909 !important; stroke-width: 1px; }
.tc-lbl--city { fill: #E3D7C4; font: 400 11.5px var(--sans); text-anchor: start; stroke-width: 2.6px; }
.tc-lbl--city.is-cap { font-weight: 600; fill: #F1E7D8; }
@media (max-width: 980px) { .tc { background-attachment: scroll; background-size: 1400px auto; background-repeat: repeat-y; } }
@media (max-width: 700px) {
	.tc-hero { background: linear-gradient(180deg, rgba(6,7,9,.78), rgba(6,7,9,.9)), url("../img/tc-hero.jpg") 40% 0 / auto 100% no-repeat; }
}