/* 웹 공지(산신령 소식): 팝업·읽기 창과 더보기 목록. notices.js가 창을 만든다. */
dialog.notice-dialog {
	display: flex;
	flex-direction: column;
	position: fixed;
	inset: 0;
	box-sizing: border-box;
	width: min(520px, calc(100vw - 32px));
	height: fit-content;
	max-height: min(760px, calc(100dvh - 32px));
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: 24px;
	background: var(--bg-surface, #fcfbf8);
	color: var(--text-primary, #1b1f1d);
	box-shadow: 0 24px 100px #0006;
	overflow: hidden;
	font-family: var(--font-app, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif);
	text-align: left;
	animation: notice-dialog-enter .22s ease-out;
}
dialog.notice-dialog[hidden], dialog.notice-dialog:not([open]) { display: none !important; }
.notice-dialog *, .notice-dialog *::before, .notice-dialog *::after { box-sizing: border-box; }
dialog.notice-dialog::backdrop { background: #0b1516a6; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.notice-dialog-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.notice-dialog-cover { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; background: #b9cfe3; }
.notice-dialog-close { position: absolute; top: 12px; right: 12px; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #ffffff90; border-radius: 50%; background: #fffffff0; color: #22372e; cursor: pointer; }
.notice-dialog-close .ph-bold { display: block; font-size: 20px; line-height: 1; }
.notice-dialog-content { padding: 24px 28px 8px; }
.notice-dialog-content h2:focus { outline: none; }
.notice-dialog-content h2 { margin: 0; color: var(--text-primary, #1b1f1d); font-size: 23px; font-weight: 750; line-height: 1.4; letter-spacing: -.6px; word-break: keep-all; overflow-wrap: anywhere; }
.notice-dialog-date { display: block; margin-top: 8px; color: var(--text-tertiary, #6c726e); font-size: 13px; }
.notice-dialog-body { margin-top: 22px; padding-bottom: 20px; color: var(--text-secondary, #3d4440); font-size: 15px; line-height: 1.75; word-break: keep-all; overflow-wrap: anywhere; }
.notice-dialog-body p { margin: 0; white-space: pre-line; }
.notice-dialog-body p + p, .notice-dialog-body h3, .notice-dialog-body ul, .notice-dialog-body hr { margin-top: 14px; }
.notice-dialog-body h3 { margin-bottom: 0; color: var(--text-primary, #1b1f1d); font-size: 17px; font-weight: 700; line-height: 1.5; }
.notice-dialog-body h3 + p, .notice-dialog-body h3 + ul { margin-top: 6px; }
.notice-dialog-body ul { margin-bottom: 0; padding-left: 20px; }
.notice-dialog-body li + li { margin-top: 4px; }
.notice-dialog-body hr { height: 0; margin-bottom: 0; border: 0; border-top: 1px solid var(--border-default, #d8d6cf); }
.notice-dialog-body .notice-image { margin: 18px 0 0; }
.notice-dialog-body .notice-image + * { margin-top: 18px; }
.notice-dialog-body .notice-image img { display: block; width: 100%; height: auto; margin: 0 auto; border-radius: 14px; background: var(--bg-raised, #efede7); box-shadow: inset 0 0 0 1px #0000000f; }
.notice-dialog-actions { display: flex; flex: none; gap: 8px; padding: 12px 20px calc(16px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--border-subtle, var(--border-default, #e4e2dc)); }
.notice-dialog-actions button { min-height: 48px; border: 0; border-radius: 12px; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.notice-dialog-dismiss { flex: 0 0 auto; padding: 0 16px; background: transparent; color: var(--text-secondary, #3d4440); }
.notice-dialog-dismiss[hidden] { display: none; }
.notice-dialog-confirm { flex: 1 1 auto; padding: 0 20px; background: var(--text-primary, #1b1f1d); color: var(--bg-canvas, #f4f3ef); }
.notice-dialog-dismiss:hover { color: var(--text-primary, #1b1f1d); text-decoration: underline; text-underline-offset: 4px; }
.notice-dialog :is(button):focus-visible { outline: 3px solid #b28a43; outline-offset: 3px; }
@keyframes notice-dialog-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 480px) {
	dialog.notice-dialog { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); border-radius: 20px; }
	.notice-dialog-content { padding: 20px 22px 4px; }
	.notice-dialog-content h2 { font-size: 21px; }
	.notice-dialog-body { font-size: 14px; }
	.notice-dialog-actions { padding-left: 14px; padding-right: 14px; }
	.notice-dialog-close { top: 10px; right: 10px; }
}
/* 세로가 낮은 가로 화면은 커버가 화면을 다 채우지 않게 더 납작하게 자른다(앱과 같은 기준). */
@media (max-height: 560px) { .notice-dialog-cover { aspect-ratio: 3.4 / 1; } }
@media (prefers-reduced-motion: reduce) { dialog.notice-dialog { animation: none; } }

/* 더보기 > 설정 및 기타 > 산신령 소식(맨 위). 비면 다음 항목 위 구분선도 없앤다. */
#more-view .more-notices.is-empty { display: none; }
#more-view .more-notices.is-empty + .more-user-section { border-top: 0; }
.notices-list { display: grid; }
.notice-row { display: grid; gap: 4px; width: 100%; padding: 12px 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.notice-row + .notice-row { border-top: 1px solid var(--border-subtle, var(--border-default)); }
.notice-row small { color: var(--text-tertiary); font-size: 12px; }
.notice-row strong { color: var(--text-primary); font-size: 16px; font-weight: 700; line-height: 1.45; letter-spacing: -0.02em; word-break: keep-all; overflow-wrap: anywhere; }
.notice-row:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.notices-more { display: block; min-height: 40px; margin-top: 4px; padding: 0; border: 0; background: none; color: var(--text-secondary); font: inherit; font-size: 14px; cursor: pointer; }
.notices-more[hidden] { display: none; }
.notices-more:hover { color: var(--text-primary); text-decoration: underline; text-underline-offset: 4px; }