/* ── 소식 뷰: 공지 / 뉴스 / 이벤트 / 문서 ── */
.news-view {
  --nv-bg: #2a2c32;
  --nv-fg: #f2f3f5;
  --nv-muted: rgba(235, 237, 240, 0.72);
  --nv-line: rgba(255, 255, 255, 0.14);
  --nv-accent: #c8cacf;
  --nv-surface: rgba(255, 255, 255, 0.06);

  position: absolute;
  top: var(--top-height);
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 110;
  display: none;
  flex-direction: column;
  color: var(--nv-fg);
  background:
    radial-gradient(ellipse 80% 55% at 100% 0%, rgba(255, 255, 255, 0.06), transparent 58%),
    radial-gradient(ellipse 55% 40% at 0% 100%, rgba(255, 255, 255, 0.035), transparent 55%),
    var(--nv-bg);
  overflow: hidden;
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

.news-view--open {
  display: flex;
}

.news-view[data-type='notice'] {
  --nv-accent: #d0d2d6;
  --nv-bg: #2c2e34;
}

.news-view[data-type='news'] {
  --nv-accent: #c6c8cd;
  --nv-bg: #282a30;
}

.news-view[data-type='events'] {
  --nv-accent: #d4d6da;
  --nv-bg: #303238;
}

.news-view[data-type='docs'] {
  --nv-accent: #c9cbcf;
  --nv-bg: #2a2c32;
}

.news-view__close {
  position: absolute;
  top: calc(14 * var(--ui-scale) * 1px);
  right: calc(18 * var(--ui-scale) * 1px);
  z-index: 5;
  padding: calc(8 * var(--ui-scale) * 1px) calc(14 * var(--ui-scale) * 1px);
  border-radius: calc(6 * var(--ui-scale) * 1px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  font-family: inherit;
  font-size: calc(13 * var(--ui-scale) * 1px);
  cursor: pointer;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.news-view__close-label {
  position: relative;
  z-index: 1;
}

.nv-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding: calc(36 * var(--ui-scale) * 1px) calc(40 * var(--ui-scale) * 1px)
    calc(56 * var(--ui-scale) * 1px);
}

.nv-hero {
  max-width: 920px;
  margin: 0 auto calc(32 * var(--ui-scale) * 1px);
  padding-right: calc(72 * var(--ui-scale) * 1px);
}

.nv-eyebrow {
  margin: 0 0 calc(10 * var(--ui-scale) * 1px);
  font-size: calc(12 * var(--ui-scale) * 1px);
  font-weight: 650;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nv-accent);
}

.nv-title {
  margin: 0 0 calc(10 * var(--ui-scale) * 1px);
  font-size: clamp(28px, calc(40 * var(--ui-scale) * 1px), 48px);
  font-weight: 700;
  letter-spacing: -0.03em;
}

.nv-desc {
  margin: 0;
  font-size: calc(15 * var(--ui-scale) * 1px);
  color: var(--nv-muted);
  line-height: 1.55;
}

.nv-body {
  max-width: 920px;
  margin: 0 auto;
}

.nv-pill {
  display: inline-flex;
  align-items: center;
  padding: calc(3 * var(--ui-scale) * 1px) calc(8 * var(--ui-scale) * 1px);
  border-radius: calc(4 * var(--ui-scale) * 1px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  font-size: calc(11.5 * var(--ui-scale) * 1px);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(245, 248, 255, 0.78);
}

.nv-pill--pin {
  border-color: color-mix(in srgb, var(--nv-accent) 45%, transparent);
  background: color-mix(in srgb, var(--nv-accent) 18%, transparent);
  color: var(--nv-accent);
}

.nv-pill--accent {
  border-color: color-mix(in srgb, var(--nv-accent) 40%, transparent);
  color: var(--nv-accent);
}

/* ── 공통 행 카드 (이벤트 규격) ── */
.nv-board,
.nv-stories,
.nv-events,
.nv-docs__grid {
  display: flex;
  flex-direction: column;
  gap: calc(12 * var(--ui-scale) * 1px);
  position: relative;
}

.nv-row {
  display: grid;
  grid-template-columns: calc(88 * var(--ui-scale) * 1px) 1fr;
  gap: calc(16 * var(--ui-scale) * 1px);
  align-items: stretch;
  padding: calc(16 * var(--ui-scale) * 1px);
  border-radius: calc(16 * var(--ui-scale) * 1px);
  border: 1px solid var(--nv-line);
  background: rgba(255, 255, 255, 0.03);
  cursor: pointer;
}

.nv-row__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(2 * var(--ui-scale) * 1px);
  padding: calc(12 * var(--ui-scale) * 1px) 0;
  border-radius: calc(12 * var(--ui-scale) * 1px);
  background: color-mix(in srgb, var(--nv-accent) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--nv-accent) 28%, transparent);
  min-height: calc(88 * var(--ui-scale) * 1px);
  box-sizing: border-box;
}

.nv-row__month {
  font-size: calc(11.5 * var(--ui-scale) * 1px);
  font-weight: 650;
  letter-spacing: 0.08em;
  color: var(--nv-accent);
}

.nv-row__day {
  font-size: calc(28 * var(--ui-scale) * 1px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
}

.nv-row__weekday {
  font-size: calc(12 * var(--ui-scale) * 1px);
  color: rgba(245, 248, 255, 0.55);
}

.nv-row__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.nv-row__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(8 * var(--ui-scale) * 1px);
  margin-bottom: calc(10 * var(--ui-scale) * 1px);
  font-size: calc(12.5 * var(--ui-scale) * 1px);
  color: rgba(230, 236, 248, 0.5);
}

.nv-row__title {
  margin: 0 0 calc(6 * var(--ui-scale) * 1px);
  font-size: calc(18 * var(--ui-scale) * 1px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.nv-row__summary {
  margin: 0;
  font-size: calc(13.5 * var(--ui-scale) * 1px);
  line-height: 1.5;
  color: var(--nv-muted);
}

.nv-notice--pinned .nv-row__rail {
  border-color: color-mix(in srgb, var(--nv-accent) 40%, transparent);
  background: color-mix(in srgb, var(--nv-accent) 18%, transparent);
}

.nv-event--ended {
  opacity: 0.55;
}

.nv-status {
  padding: calc(2 * var(--ui-scale) * 1px) calc(8 * var(--ui-scale) * 1px);
  border-radius: calc(4 * var(--ui-scale) * 1px);
  font-size: calc(11.5 * var(--ui-scale) * 1px);
  font-weight: 700;
}

.nv-status--upcoming {
  background: rgba(110, 176, 255, 0.18);
  color: #9cc7ff;
}

.nv-status--ongoing {
  background: color-mix(in srgb, var(--nv-accent) 22%, transparent);
  color: var(--nv-accent);
}

.nv-status--ended {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(245, 248, 255, 0.55);
}

/* ── 문서: 필터 + 타입 레일 ── */
.nv-filters {
  display: flex;
  flex-wrap: wrap;
  gap: calc(8 * var(--ui-scale) * 1px);
  margin-bottom: calc(18 * var(--ui-scale) * 1px);
  position: relative;
}

.nv-filter {
  padding: calc(7 * var(--ui-scale) * 1px) calc(12 * var(--ui-scale) * 1px);
  border-radius: calc(6 * var(--ui-scale) * 1px);
  border: 1px solid var(--nv-line);
  background: transparent;
  color: rgba(245, 248, 255, 0.65);
  font-family: inherit;
  font-size: calc(13 * var(--ui-scale) * 1px);
  font-weight: 600;
  cursor: pointer;
}

.nv-filter__label {
  position: relative;
  z-index: 1;
}

.nv-filter.is-active {
  border-color: color-mix(in srgb, var(--nv-accent) 45%, transparent);
  background: color-mix(in srgb, var(--nv-accent) 16%, transparent);
  color: #fff;
}

.nv-doc {
  grid-template-columns: calc(88 * var(--ui-scale) * 1px) 1fr auto;
  align-items: center;
}

.nv-doc__type {
  width: 100%;
  min-height: calc(88 * var(--ui-scale) * 1px);
  font-size: calc(13 * var(--ui-scale) * 1px);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #0d1118;
  background: #d7e4ff;
  border-color: transparent;
}

.nv-doc__type--pdf {
  background: #ffb4a8;
}

.nv-doc__type--doc {
  background: #b8d4ff;
}

.nv-doc__type--md {
  background: #c6f0d2;
}

.nv-doc__type--zip {
  background: #e4d4ff;
}

.nv-doc__action {
  position: relative;
  z-index: 1;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: calc(8 * var(--ui-scale) * 1px) calc(14 * var(--ui-scale) * 1px);
  border-radius: calc(6 * var(--ui-scale) * 1px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.55);
  font-family: inherit;
  font-size: calc(13 * var(--ui-scale) * 1px);
  font-weight: 600;
  cursor: default;
  text-decoration: none;
}

a.nv-doc__action {
  cursor: pointer;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.1);
}

a.nv-doc__action:hover {
  background: rgba(255, 255, 255, 0.16);
}

.nv-empty {
  margin: 0;
  padding: calc(28 * var(--ui-scale) * 1px);
  text-align: center;
  color: var(--nv-muted);
}

/* ── 글로우 (전구형: 빠른 점등 / 느린 소등) ── */
.nv-board > *,
.nv-stories > *,
.nv-events > *,
.nv-filters > *,
.nv-docs__grid > * {
  position: relative;
  z-index: 1;
}

.news-view__close,
.nv-filter,
.nv-row {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    color var(--glow-off-dur) ease-out,
    background var(--glow-off-dur) ease-out,
    border-color var(--glow-off-dur) ease-out,
    box-shadow var(--glow-off-dur) ease-out,
    text-shadow var(--glow-off-dur) ease-out;
}

.news-view__close::before,
.nv-filter::before,
.nv-row::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  border-radius: inherit;
  background:
    radial-gradient(
      ellipse 140% 160% at 50% 42%,
      rgba(255, 255, 255, 0.72) 0%,
      rgba(255, 255, 255, 0.38) 42%,
      transparent 74%
    ),
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.42) 0%,
      rgba(255, 255, 255, 0.22) 48%,
      rgba(180, 180, 180, 0.28) 100%
    );
  pointer-events: none;
  transition: opacity var(--glow-off-dur) ease-out;
}

.news-view__close:hover::before,
.nv-filter:hover::before,
.nv-row:hover::before {
  opacity: 1;
  transition: opacity var(--glow-on-dur) ease-in;
}

.news-view__close:hover,
.nv-filter:hover,
.nv-row:hover {
  color: var(--glow-text-on);
  border-color: var(--glow-strong);
  box-shadow: var(--glow-skeuo-full);
  text-shadow: none;
  z-index: 5;
  transition:
    color var(--glow-on-dur) ease-in,
    background var(--glow-on-dur) ease-in,
    border-color var(--glow-on-dur) ease-in,
    box-shadow var(--glow-on-dur) ease-in,
    text-shadow var(--glow-on-dur) ease-in;
}

.nv-row > * {
  position: relative;
  z-index: 1;
}

.nv-row:hover .nv-row__summary,
.nv-row:hover .nv-row__meta {
  color: var(--glow-text-muted-on);
}

.nv-row:hover .nv-row__rail:not(.nv-doc__type) {
  background: rgba(255, 255, 255, 0.35);
  border-color: rgba(0, 0, 0, 0.12);
}

.nv-row:hover .nv-row__month,
.nv-row:hover .nv-row__weekday {
  color: var(--glow-text-muted-on);
}

.nv-row:hover .nv-doc__action {
  color: var(--glow-text-on);
  border-color: rgba(0, 0, 0, 0.2);
  background: rgba(255, 255, 255, 0.45);
}

@media (hover: none) {
  .news-view__close:hover,
  .nv-filter:hover,
  .nv-row:hover {
    color: inherit;
    border-color: inherit;
    box-shadow: none;
  }

  .news-view__close:hover::before,
  .nv-filter:hover::before,
  .nv-row:hover::before {
    opacity: 0;
  }

  .news-view__close:active,
  .nv-filter:active,
  .nv-row:active {
    color: var(--glow-text-on);
    border-color: var(--glow-strong);
    box-shadow: var(--glow-skeuo-full);
    transition:
      color var(--glow-on-dur) ease-in,
      border-color var(--glow-on-dur) ease-in,
      box-shadow var(--glow-on-dur) ease-in;
  }

  .news-view__close:active::before,
  .nv-filter:active::before,
  .nv-row:active::before {
    opacity: 1;
    transition: opacity var(--glow-on-dur) ease-in;
  }

  .nv-row:active .nv-row__summary,
  .nv-row:active .nv-row__meta {
    color: var(--glow-text-muted-on);
  }
}

@media (max-width: 800px), (max-aspect-ratio: 3 / 4) {
  .nv-scroll {
    padding: calc(24 * var(--ui-scale) * 1px) calc(16 * var(--ui-scale) * 1px)
      calc(40 * var(--ui-scale) * 1px);
  }

  .nv-hero {
    padding-right: calc(56 * var(--ui-scale) * 1px);
  }

  .nv-row {
    grid-template-columns: calc(72 * var(--ui-scale) * 1px) 1fr;
  }

  .nv-doc {
    grid-template-columns: calc(72 * var(--ui-scale) * 1px) 1fr;
  }

  .nv-doc__action {
    grid-column: 2;
    justify-self: start;
  }

  .nv-doc__type {
    min-height: calc(72 * var(--ui-scale) * 1px);
  }
}
