.custom-navbar {

	.more-menu {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		position: fixed;
		background: var(--theme-bg-overlay);

		.content {
			margin: 190rpx 0 0 12rpx;
			z-index: 1;
			position: fixed;
			background: var(--theme-bg-menu);
			box-shadow: 0 0 12px var(--theme-shadow-medium);
			border-radius: 2px;
		}
	}
}

.journal-list {
	width: 100vw;
	
	.content {

		.date {
			font-weight: bold;
		}

		.text,
		.items {
			position: relative;
			font-size: 14px;
		}

		.text {
			width: calc(100% - 32px - 2rem);
			padding: 8px 16px;
			margin: .5rem 1rem 1rem 1rem;
			position: relative;
			background: var(--theme-bg-journal);
			box-shadow: 0 2px 10px var(--theme-shadow-medium);
			border-radius: 2px;

			// 纸张纹理效果
			&::before {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				background:
					linear-gradient(90deg,
						var(--theme-texture-light) 0%,
						var(--theme-texture-bright) 50%,
						var(--theme-texture-light) 100%),
					linear-gradient(var(--theme-texture-line) 1px, transparent 1px),
					linear-gradient(90deg, var(--theme-texture-line) 1px, transparent 1px);
				pointer-events: none;
				background-size: 100% 100%, 10px 10px, 10px 10px;
			}

			.location {
				color: var(--theme-text-secondary);
				text-align: right;
			}
		}

		.items {
			column-gap: .25rem;
			column-count: 3;
			padding-bottom: 2rem;

			.item {
				overflow: hidden;
				background: var(--theme-bg-card);
				break-inside: avoid;
				margin-bottom: .25rem;

				&.thumbnail {
					width: 100%;
					display: block;
				}

				&.video {
					height: auto;
					position: relative;

					&::after {
						content: "";
						top: 50%;
						left: 53%;
						width: 0;
						height: 0;
						position: absolute;
						transform: translate(-50%, -50%);
						border-top: 16px solid transparent;
						border-left: 24px solid var(--theme-video-play);
						border-bottom: 16px solid transparent;
						pointer-events: none;
					}
				}
			}
		}
	}

	.start {
		color: var(--theme-text-secondary);
		padding: 1rem 0;
		font-size: 12px;
		text-align: center;
	}
}