@charset "UTF-8";
/*!
 * TG 频道 —— 前台列表样式
 *
 * 设计约束（为什么这么写）：
 *   · 不假设主题配色：全部用 currentColor + 中性半透明灰，浅色/深色主题都不会「看不见」；
 *   · 不引外部字体 / 图标 / 图片，读者端零额外请求；
 *   · 只有 .tgchannel-* 作用域内的规则，不动主题任何其它元素。
 */

.tgchannel-feed {
	--tg-border: rgba(128, 128, 128, .26);
	--tg-border-strong: rgba(128, 128, 128, .42);
	--tg-soft: rgba(128, 128, 128, .1);
	--tg-radius: 10px;

	margin: 1.6em 0;
	line-height: 1.75;
	overflow-wrap: break-word;
	word-wrap: break-word;
}

/* ---------------------------------------------------------------- 来源行 */
.tgchannel-source {
	margin: 0 0 1em;
	font-size: .85em;
	opacity: .72;
}

.tgchannel-source-label {
	margin-right: .35em;
}

.tgchannel-source a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dotted var(--tg-border-strong);
}

.tgchannel-source a:hover {
	border-bottom-style: solid;
}

/* ---------------------------------------------------------------- 列表 */
.tgchannel-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 1.1em;
}

/* 条目的盒模型 + 去标记。
   选择器为什么写这么长：主题会给「正文区」的 li 加标记。Puma 用的是
   `.pGraph li::before { content:"•" }` —— ① 它画的是 ::before，不是列表 marker，只清
   `::marker` 完全没用；② 特异性 (0,1,1) 高过单个类名，还会顺带把 `margin-left:30px`
   的缩进压上来（那个缩进本来就是给圆点留的位置）。
   这里用 (0,2,1) 把 标记 / 缩进 / 内边距 一次性收回来。 */
.tgchannel-feed .tgchannel-list > li {
	list-style: none;
	margin: 0;
	padding: 1em 1.15em;
}

.tgchannel-feed .tgchannel-list > li::before,
.tgchannel-feed .tgchannel-list > li::marker {
	content: none;
}

/* ------------------------------------------------ 主题正文样式的复位 */
/* 短代码一般渲染在主题的「文章正文」容器里（Puma 是 .pGraph），主题那套正文排版会成片命中
   卡片内部，且多为 (0,1,1)——正好压过插件里的单类名规则 (0,1,0)。上面 li 的圆点是一例；
   下面把同类里最刺眼的几处一并收回来：这几个链接设计上不要下划线（.tgchannel-content a 是
   正文里的链接，本来就该有下划线，不在此列）。
   以后若出现「明明写了却没生效」，先查这段。 */
.tgchannel-feed .tgchannel-time,
.tgchannel-feed .tgchannel-preview,
.tgchannel-feed .tgchannel-video-link {
	text-decoration: none;
}

.tgchannel-item {
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius);
}

/* 头行：时间 / 浏览量 / 已编辑 */
.tgchannel-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .7em;
	margin-bottom: .55em;
	font-size: .85em;
	opacity: .72;
}

.tgchannel-meta time {
	font-variant-numeric: tabular-nums;
}

.tgchannel-time {
	color: inherit;
	text-decoration: none;
}

a.tgchannel-time:hover time {
	text-decoration: underline;
}

.tgchannel-edited {
	padding: 0 .4em;
	border: 1px solid var(--tg-border);
	border-radius: 999px;
	font-size: .95em;
}

/* 回复 / 转发提示 */
.tgchannel-reply,
.tgchannel-forward {
	margin: 0 0 .5em;
	padding-left: .7em;
	border-left: 3px solid var(--tg-border-strong);
	font-size: .88em;
	opacity: .75;
}

/* ---------------------------------------------------------------- 正文 */
.tgchannel-content > :first-child {
	margin-top: 0;
}

.tgchannel-content > :last-child {
	margin-bottom: 0;
}

.tgchannel-content a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.tgchannel-content code {
	padding: .1em .35em;
	border-radius: 4px;
	background: var(--tg-soft);
	font-size: .92em;
}

.tgchannel-content pre {
	margin: .6em 0;
	padding: .8em 1em;
	border-radius: 8px;
	background: var(--tg-soft);
	overflow-x: auto;
}

.tgchannel-content pre code {
	padding: 0;
	background: none;
}

.tgchannel-content blockquote {
	margin: .6em 0;
	padding: .2em 0 .2em .9em;
	border-left: 3px solid var(--tg-border-strong);
	opacity: .9;
}

/* 剧透：默认遮住，鼠标移上去或聚焦时显形 */
.tgchannel-spoiler {
	padding: 0 .2em;
	border-radius: 3px;
	background: rgba(128, 128, 128, .5);
	color: transparent;
	cursor: pointer;
}

.tgchannel-spoiler:hover,
.tgchannel-spoiler:focus {
	background: var(--tg-soft);
	color: inherit;
}

/* ---------------------------------------------------------------- 媒体 */
.tgchannel-media {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 6px;
	margin: .8em 0 0;
}

.tgchannel-media-item {
	position: relative;
	margin: 0;
	overflow: hidden;
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius);
	background: var(--tg-soft);
	line-height: 0;
}

.tgchannel-media-item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 单张图不必撑满整宽：给个上限，避免小图被拉得很大 */
.tgchannel-photos-1 {
	grid-template-columns: minmax(0, 1fr);
}

.tgchannel-photos-1 .tgchannel-media-item {
	max-width: 420px;
}

.tgchannel-video-link {
	display: block;
	margin-top: .8em;
	color: inherit;
	text-decoration: none;
}

.tgchannel-video-link .tgchannel-media-item {
	max-width: 420px;
}

.tgchannel-badge {
	position: absolute;
	left: 8px;
	bottom: 8px;
	z-index: 2;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(0, 0, 0, .62);
	color: #fff;
	font-size: 12px;
	line-height: 1.6;
}

/* ---------------------------------------------------------------- 文件 */
.tgchannel-file {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .5em;
	margin: .7em 0 0;
	padding: .5em .7em;
	border: 1px solid var(--tg-border);
	border-radius: 8px;
	background: var(--tg-soft);
	font-size: .9em;
}

.tgchannel-file-label {
	padding: 0 .45em;
	border-radius: 4px;
	background: var(--tg-border);
	font-size: .85em;
}

.tgchannel-file-extra {
	opacity: .7;
}

/* ---------------------------------------------------------------- 链接预览 */
.tgchannel-preview {
	display: flex;
	gap: .8em;
	align-items: flex-start;
	margin: .8em 0 0;
	padding: .75em;
	border: 1px solid var(--tg-border);
	border-radius: var(--tg-radius);
	color: inherit;
	text-decoration: none;
}

.tgchannel-preview:hover {
	border-color: var(--tg-border-strong);
}

.tgchannel-preview-image {
	flex: 0 0 auto;
	width: 96px;
	height: 96px;
	object-fit: cover;
	border-radius: 8px;
}

.tgchannel-preview-body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.tgchannel-preview-site {
	font-size: .8em;
	opacity: .7;
}

.tgchannel-preview-title {
	font-weight: 600;
}

.tgchannel-preview-desc {
	display: -webkit-box;
	overflow: hidden;
	font-size: .9em;
	opacity: .8;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* ---------------------------------------------------------------- 其它 */
.tgchannel-permalink {
	margin: .7em 0 0;
	font-size: .85em;
	opacity: .72;
}

.tgchannel-permalink a {
	color: inherit;
}

.tgchannel-empty {
	margin: 0;
	padding: 1.2em;
	border: 1px dashed var(--tg-border);
	border-radius: var(--tg-radius);
	text-align: center;
	opacity: .7;
}

/* 以下是「仅管理员可见」的运维提示，读者看不到 */
.tgchannel-empty-hint,
.tgchannel-notice {
	margin: .6em 0 0;
	padding: .5em .8em;
	border: 1px dashed var(--tg-border-strong);
	border-radius: 8px;
	font-size: .85em;
	opacity: .75;
}

/* ---------------------------------------------------------------- 窄屏 */
@media (max-width: 480px) {
	/* 选择器必须与上面那条保持一致（含 .tgchannel-feed 前缀），否则特异性不够、压不过主题 */
	.tgchannel-feed .tgchannel-list > li {
		padding: .85em .9em;
	}

	.tgchannel-preview-image {
		width: 72px;
		height: 72px;
	}

	.tgchannel-media {
		grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	}
}