@charset "UTF-8";
/* ============================================================
   파일쿠키 — 추석 시즌 상단 레이어 (2026 추석 한정)
   기존 /renewal/css/topbar.css 뒤에 추가 로드.
   전부 .fkr-chuseok 스코프 — 기존 규칙을 덮어쓰지 않음.
   시즌 종료 시 이 파일 링크 1줄과 클래스만 제거하면 원상복구.

   씬 구조 (여름·가을 버전과 동일한 규칙)
     PC 띠   : 하늘 46px + 마당 12px (viewBox 0 0 1520 58 · 레이어 3장)
     모바일 : 하늘 + 마당 (viewBox 0 -5 390 54 · 상단바 높이 무변경)
               ※ viewBox 높이는 실제 밴드 높이(54.13px)에 맞춘 값이다. 49 로 두면 slice 가
                 1.105배 확대를 걸어 좌우 41px 이 잘린다 (2026-09-16 실측). 밴드 높이가
                 바뀌면 여기도 같이 바꿀 것 — 내용 좌표는 건드리지 않고 위쪽 하늘만 늘렸다.
     좌우 씬 : 좌우 끝 300px 고정 SVG + 전폭 CSS 배경 (2026-09-16 재구성 · 가을판과 동일)
   ============================================================ */

/* ── PC 상단 띠 ─────────────────────────────────────────── */
#fkrTopUnify.fkr-chuseok .fkr-utilbar{
  position: relative;
  background: linear-gradient(180deg,#fbe3d4 0%,#f7c9a0 100%);
  overflow: hidden;
}
#fkrTopUnify.fkr-chuseok .fkr-utilbar-in{ position: relative; z-index: 2; }

/* 씬 레이어 — 폭 고정 SVG 를 절대배치로 겹쳐 쌓음 (1장에 몰면 렌더가 느려짐) */
#fkrTopUnify.fkr-chuseok .fkr-sc{
  position:absolute; inset:0; z-index:0; pointer-events:none; line-height:0;
  width:100%; height:100%; display:block;
}

/* 검색 알약 — 배경이 살구색이 되어 기존 #f5f7fb 가 묻힘 → 흰색 + 가을톤 테두리 */
#fkrTopUnify.fkr-chuseok .fkr-search{
  background:#ffffff; border-color:#f2d3b4;
  box-shadow:0 1px 3px rgba(120,60,30,.07);
}
#fkrTopUnify.fkr-chuseok .fkr-search input.ph{ color:#5c4327; }
#fkrTopUnify.fkr-chuseok .fkr-search input.ph::placeholder{ color:#9a5a3a; opacity:1; font-weight:600; }
#fkrTopUnify.fkr-chuseok .fkr-util-txt,
#fkrTopUnify.fkr-chuseok .fkr-util-my{ color:#6b3f2a; }

/* 다크 (한밤의 달맞이) */
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-utilbar{
  background: linear-gradient(180deg,#1c1d3a 0%,#3a2f4a 100%);
}
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-search{
  background:#2c2638; border-color:#4a4260; box-shadow:none;
}
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-search input.ph{ color:#ece4f0; }
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-search input.ph::placeholder{ color:#f0d9a0; }
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-util-txt,
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-util-my{ color:#ece4f0; }

/* 라이트/다크 씬 교체 */
#fkrTopUnify.fkr-chuseok .fkr-sc-dk{ display:none; }
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-sc-lt{ display:none; }
html[data-dark=true] #fkrTopUnify.fkr-chuseok .fkr-sc-dk{ display:block; }


/* ── PC 좌우 배경 씬 (본문 1132px 바깥 여백) ─────────────────
   [구조 2026-09-16] 전체폭 SVG 1장 → 좌우 끝 고정 SVG + 전폭 CSS 배경.
   본문은 1132px 고정이라 화면이 넓어지면 씬만 커져 소품과 본문 사이가 벌어졌다
   (1920px 에서 149px, 2560px 에서 387px). 소품을 좌우 끝에 300px 로 못박고
   하늘·능선·지면·풀을 전폭 CSS 로 깔아 벌어질 곳 자체를 없앤다. = 가을판과 동일 구조.

   z-index 는 반드시 음수 — 0 이면 positioned 라서 일반 흐름의 본문(카드 배경·텍스트)
   위에 그려져 섹션을 통째로 가린다 (2026-08-12 여름판에서 실시간 인기 카드가
   실제로 사라짐. pointer-events:none 이라 elementFromPoint 검사로는 안 잡히니
   눈으로 확인할 것). -1 이면 본문 박스들 뒤 + 페이지 배경 앞 = 정확히 배경 자리. */
.fkr-hanok{
  position:absolute; left:0; right:0; height:620px; z-index:-1;
  overflow:hidden; pointer-events:none;
  /* 능선은 부모 배경 레이어로 둔다 — 배경은 자식·의사요소보다 항상 먼저 그려지므로
     마당(::before)이 능선 아랫단을 덮어 준다. 좌우 씬의 그리기 순서와 같다. */
  /* [가운데 하늘 보정 2026-09-16] 좌우 씬은 폭 300px 고정이라 화면이 넓어지면 여백만 벌어진다.
     실측: 1920 = 여백 80px(씬이 카드에 거의 붙음) / 2560 = 여백 401px — 이 구간의 하늘이
     민무늬 그라데이션뿐이라 "휑하다" 는 인상이 된다. 땅(y260~)은 ::before·::after 가 이미
     전폭이라 괜찮고, 빈 곳은 하늘(y0~216) 한 곳이다.
       채우는 도형은 새로 그리지 않고 **시안 구름을 그대로 떴다** — hanok_pc.jsp 의
       <g fill="#ffffff" opacity=".92"> 3-타원 뭉치(rx44 ry14 / rx30 ry18 / rx24 ry12)와
       작은 뭉치(rx34 ry11 / rx22 ry14) 비율이 같다. 불투명도만 멀리 있는 구름처럼 낮췄다.
       주기 380 / 530 은 서로 나누어떨어지지 않아 반복 티가 안 난다 (두 층이 겹치는
       간격이 매우 길다). 2560 화면의 여백 401px 안에 뭉치 4개가 들어가는 밀도다 —
       주기를 700 이상으로 잡으면 여백당 1개꼴이라 여전히 비어 보인다 (실측).
       세로는 cy<=186 으로 묶어 y216 의 능선과 겹치지 않는다 — 겹치면 구름이 산 앞으로 뜬다.
     가을판(topbar_autumn.css 의 "가운데 빈 배경 보정") 과 같은 성격의 보정이다. */
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='230' viewBox='0 0 380 230'%3E%3Cg fill='%23ffffff' opacity='.5'%3E%3Cellipse cx='70' cy='148' rx='34' ry='11'/%3E%3Cellipse cx='94' cy='142' rx='24' ry='15'/%3E%3Cellipse cx='52' cy='146' rx='19' ry='10'/%3E%3C/g%3E%3Cg fill='%23ffffff' opacity='.34'%3E%3Cellipse cx='250' cy='74' rx='26' ry='9'/%3E%3Cellipse cx='268' cy='70' rx='17' ry='11'/%3E%3C/g%3E%3C/svg%3E") repeat-x 0 0 / 380px 230px,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='530' height='230' viewBox='0 0 530 230'%3E%3Cg fill='%23ffffff' opacity='.4'%3E%3Cellipse cx='180' cy='56' rx='38' ry='12'/%3E%3Cellipse cx='207' cy='50' rx='26' ry='16'/%3E%3Cellipse cx='159' cy='54' rx='20' ry='10'/%3E%3C/g%3E%3Cg fill='%23ffffff' opacity='.28'%3E%3Cellipse cx='420' cy='182' rx='26' ry='9'/%3E%3Cellipse cx='438' cy='178' rx='17' ry='11'/%3E%3C/g%3E%3C/svg%3E") repeat-x 0 0 / 530px 230px,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='80' viewBox='0 0 480 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40C90 16 170 10 250 26 330 42 410 34 480 40V80H0Z' fill='%23dcb39a'/%3E%3Cpath d='M0 60C70 47 150 41 250 53 350 65 420 57 480 60V80H0Z' fill='%23c68f6a'/%3E%3C/svg%3E") repeat-x 0 216px / 480px 80px,
    linear-gradient(180deg,#f9dccb 0%,#fbe9d8 55%,#f0f0f0 100%);
}
/* [가운데 빈 배경 보정] 좌우 씬은 폭 300px 고정이라 1920px 화면에서 가운데 1,313px 이
   맨 배경이 된다. 게다가 하늘이 마당으로 y=296 에서 한 번에 꺾여 그 구간에 색만 끊긴
   가로줄이 보인다 — 좌우 씬 안에는 그 경계를 덮는 능선(y216~296)이 있는데 가운데엔 없기
   때문이다. 라이트·다크 모두 같은 증상.
     ① 전폭 능선을 깔아 좌우 씬의 능선과 이어 준다 (480px 주기 타일, 부모 배경 레이어)
     ② ::before(마당)를 36px 올려 투명에서 페이드시켜 경계선 자체를 없앤다
     ③ ::after 로 억새·낙엽을 전폭에 깐다 — 좌우 씬 안에만 있던 소재라 가운데 마당이
        민무늬였다. 이게 "황무지" 인상을 막는 핵심이다
   그리는 순서 = 하늘·능선(부모 배경) → 마당(z0) → 풀·낙엽(z1) → 좌우 씬(span, z2).
   순서가 어긋나면 능선이 마당 위로 떠서 언덕이 마당에 얹힌 것처럼 보인다. */
.fkr-hanok::before{                       /* 전폭 마당 (좌우 SVG 내부와 동일 값) */
  content:""; position:absolute; left:0; right:0; top:260px; bottom:0; z-index:0;
  background: linear-gradient(180deg,rgba(217,160,106,0) 0,#d9a06a 36px,#e6bd93 42%,#f0f0f0 100%);
}
.fkr-hanok::after{                        /* 전폭 풀 — 억새(150×170) + 낙엽(90×110) */
  content:""; position:absolute; left:0; right:0; top:296px; height:300px; z-index:1;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='170' viewBox='0 0 150 170'%3E%3Cg stroke='%23e8c79a' stroke-width='2.4' fill='none' stroke-linecap='round' opacity='.5'%3E%3Cpath d='M26 58q-4-26-14-42M34 58q0-30 3-46M42 58q5-26 16-38'/%3E%3Cpath d='M104 140q-3-22-12-36M112 140q0-26 2-40M120 140q4-22 14-32'/%3E%3C/g%3E%3Cg fill='%23f2dcb0' opacity='.45'%3E%3Cellipse cx='12' cy='14' rx='3' ry='8' transform='rotate(-22 12 14)'/%3E%3Cellipse cx='37' cy='9' rx='3' ry='9'/%3E%3Cellipse cx='58' cy='18' rx='2.8' ry='7.5' transform='rotate(24 58 18)'/%3E%3Cellipse cx='114' cy='98' rx='2.8' ry='7' transform='rotate(-20 114 98)'/%3E%3C/g%3E%3C/svg%3E") repeat 0 0 / 150px 170px,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='110' viewBox='0 0 90 110'%3E%3Cg fill='%23e0512f' opacity='.42'%3E%3Cpath d='M18 26l3-8 3 8 8-2-6 6 6 6-8-2-3 8-3-8-8 2 6-6-6-6z'/%3E%3Cpath d='M64 74l2.4-6.4 2.4 6.4 6.4-1.6-4.8 4.8 4.8 4.8-6.4-1.6-2.4 6.4-2.4-6.4-6.4 1.6 4.8-4.8-4.8-4.8z'/%3E%3C/g%3E%3Cg fill='%23f0703a' opacity='.34'%3E%3Cpath d='M44 48l2.4-6.4 2.4 6.4 6.4-1.6-4.8 4.8 4.8 4.8-6.4-1.6-2.4 6.4-2.4-6.4-6.4 1.6 4.8-4.8-4.8-4.8z'/%3E%3C/g%3E%3C/svg%3E") repeat 0 0 / 90px 110px;

  /* 패턴 위·아랫단을 모두 페이드 (가로 절단선 방지).
     [윗단 추가 2026-09-16] 원안은 아랫단만 페이드해서 top:296px 에서 억새·낙엽이
     한 줄로 갑자기 시작됐다 — 좌우 여백 전체에 가로 절단선으로 보였다(PO 지적).
     타일 맨 위(억새 ellipse cy9)가 296 바로 아래라 하드 스타트가 그대로 드러난다.
     14% 는 라이트 기준 42px(296~338) 구간에서 서서히 나타나게 하는 값이다. */
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 62%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 62%,transparent 100%);
}
/* 씬이 -1(배경 자리)로 내려가면 전폭 본문 래퍼(.fkr-body, #f0f0f0 불투명)가 씬을
   가린다. 씬이 있는 페이지에서만 래퍼를 투명하게 하고 그 몫의 바탕색을 body 로
   옮긴다 — 래퍼가 비쳐도 body 가 같은 색이라 씬 바깥 영역은 이전과 동일하다.
   :has 미지원 브라우저 = 여백 씬만 안 보이고 나머지는 평소와 같음 (안전한 퇴행) */
body:has(.fkr-hanok){ background:#f0f0f0; }
html[data-dark=true] body:has(.fkr-hanok){ background:#1a1b1c; }
body:has(.fkr-hanok) > .fkr-body{ background:transparent; }

/* 좌우 씬 — 폭 300px 고정 SVG 를 양끝에 못박는다. 한쪽이 여러 장인 것은
   한 SVG 요소 수 90개 제한 때문이다 (넘으면 렌더가 급격히 느려진다).
   문서 순서대로 아래→위로 쌓이므로 순서를 유지할 것 — 합치지 말 것.
   ⚠ <svg> 에 인라인 style(특히 display:block)을 넣지 말 것 — 아래 display:none 을
     이겨서 라이트·다크 두 씬이 동시에 표시된다. 배치는 전부 이 CSS 가 담당한다. */
.fkr-hanok > span{ position:absolute; top:0; line-height:0; z-index:2; }
.fkr-hanok > span.l{ left:0; }
.fkr-hanok > span.r{ right:0; }
.fkr-hanok .dk{ display:none; }

/* [요소 절단 보정 2026-09-16] <svg> 는 기본이 overflow:hidden 이라 viewBox(0~300) 를
   넘는 도형이 경계에서 직선으로 잘린다. 1520 씬을 300px 로 재단하면서 경계를 넘긴
   요소가 남아 있어 실제로 잘렸다 (PO 지적) — 실측:
     · 우측 씬 단풍잎 circle #c93d22 : 화면 1597~1665, 씬은 1603 부터 → 왼쪽 6px 절단
     · 좌측 씬 앞능선 path #c68f6a  : 화면 -10~340, 씬은 0~310 → 오른쪽 30px 절단
   overflow:visible 로 viewBox 밖도 그리게 한다. 씬 자체를 넘는 부분은 부모
   .fkr-hanok 의 overflow:hidden 이 화면 경계에서 그대로 잘라 주므로 범위는 안 커진다.
   적용 후 화면 안에서 잘리는 요소 0건 확인. */
.fkr-hanok > span > svg{ overflow:visible; }

/* 다크 — 능선 + 보름달 달빛 워시 + 밤하늘.
   [달빛 끊김 보정] 워시는 원래 우측 씬 SVG 안의 ellipse(rx560 ry420) 였는데 그 SVG 는
   폭이 300px 이라 워시가 씬 경계에서 네모나게 잘렸다 — 화면에 세로 단차로 보였다.
   워시를 여기(전폭 부모 배경)로 옮겨 끊김 없이 잇는다. 옮겼으므로 SVG 쪽 ellipse 는
   제거했다(chuseok/hanok_pc.jsp) — 남겨 두면 겹쳐서 씬 안쪽만 밝아져 반대 방향 단차가 난다.
   좌표 = 달 중심(1520 기준 cx1400 → 오른쪽에서 120px, cy180). */
html[data-dark=true] .fkr-hanok{
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='80' viewBox='0 0 480 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40C90 16 170 10 250 26 330 42 410 34 480 40V80H0Z' fill='%234a3a3e'/%3E%3Cpath d='M0 60C70 47 150 41 250 53 350 65 420 57 480 60V80H0Z' fill='%23332830'/%3E%3C/svg%3E") repeat-x 0 216px / 480px 80px,
    radial-gradient(560px 420px at calc(100% - 120px) 180px, rgba(255,241,196,.08) 0%, rgba(255,241,196,0) 100%),
    linear-gradient(180deg,#1c1d3a 0%,#2a2438 55%,#1a1b1c 100%);
}
html[data-dark=true] .fkr-hanok::before{
  background: linear-gradient(180deg,rgba(74,58,50,0) 0,#4a3a32 36px,#1a1b1c 100%);
}
html[data-dark=true] .fkr-hanok::after{   /* 풀 — 다크는 억새만 (좌우 씬과 동일: 낙엽 약하게) */
  height:260px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='170' viewBox='0 0 150 170'%3E%3Cg stroke='%239a8060' stroke-width='2.4' fill='none' stroke-linecap='round' opacity='.45'%3E%3Cpath d='M26 58q-4-26-14-42M34 58q0-30 3-46M42 58q5-26 16-38'/%3E%3Cpath d='M104 140q-3-22-12-36M112 140q0-26 2-40M120 140q4-22 14-32'/%3E%3C/g%3E%3Cg fill='%23b8a07a' opacity='.4'%3E%3Cellipse cx='12' cy='14' rx='3' ry='8' transform='rotate(-22 12 14)'/%3E%3Cellipse cx='37' cy='9' rx='3' ry='9'/%3E%3Cellipse cx='58' cy='18' rx='2.8' ry='7.5' transform='rotate(24 58 18)'/%3E%3C/g%3E%3C/svg%3E") repeat 0 0 / 150px 170px;

  /* 패턴 위·아랫단을 모두 페이드 (가로 절단선 방지).
     [윗단 추가 2026-09-16] 원안은 아랫단만 페이드해서 top:296px 에서 억새·낙엽이
     한 줄로 갑자기 시작됐다 — 좌우 여백 전체에 가로 절단선으로 보였다(PO 지적).
     타일 맨 위(억새 ellipse cy9)가 296 바로 아래라 하드 스타트가 그대로 드러난다.
     14% 는 라이트 기준 42px(296~338) 구간에서 서서히 나타나게 하는 값이다. */
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 62%,transparent 100%);
          mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 62%,transparent 100%);
}
html[data-dark=true] .fkr-hanok .lt{ display:none; }
html[data-dark=true] .fkr-hanok .dk{ display:block; }

/* [게이트 완화 2026-09-16, PO 지시] 1372 → 1150.
   가을·여름판은 1372 였다 (본문 1132 + 좌우 최소 120px = 오브젝트가 안 잘리는 폭).
   그런데 데스크톱 최다 화면폭이 1280 이라(GA4 2026-09-08~15 활성 15,272명, 2위 1920 은
   4,278명) 최다 그룹이 큰 씬을 통째로 못 보고 있었다. 상단 띠(band_pc.jsp)는 폭 게이트가
   없어 1280 에서도 정상 출력되므로, 못 보던 것은 이 좌우 씬 하나뿐이었다.
     1280 에서 켜면 여백이 좌우 71px 뿐이라 실측으로 요소 215개 중 142개가 본문 카드 뒤로
   완전히 가려지고 45개(좌25·우20)가 세로로 잘린다 — 한옥 지붕 56px 중 39px 만 남는 식이다.
   이 손실을 PO 에게 수치로 제시했고 "그래도 켠다" 로 결정됐다. 잘림은 사양이지 버그가 아니다.
     하한 1150 의 근거 = 본문 .fkr-wrap 이 min-width 없는 고정 1132px 이라 뷰포트가
   그보다 좁으면 페이지에 가로 스크롤이 생기는데, .fkr-hanok 은 left:0/right:0 = 뷰포트 폭에
   묶여 있어 가로 스크롤을 따라가지 못한다 (오른쪽으로 스크롤하면 씬만 제자리에 남아 어긋난다).
   스크롤바 폭을 감안한 실제 한계가 약 1147 이라 1150 으로 끊는다 — 더 내리지 말 것. */
@media (max-width:1150px){ .fkr-hanok{ display:none; } }

/* ── 모바일 상단 띠 ─────────────────────────────────────── */
/* 상단바 높이 무변경. 소품은 컨트롤 뒤에 그대로 깔리며 일부 가려진다.
   ⚠ viewBox 높이(49)가 실제 밴드 높이와 같아야 한다 — 다르면 slice 가
      균일 확대를 걸어 좌우가 잘린다 (실제로 겪은 버그) */
/* [핸드오프 밖 보강 ①] 호스트 2곳 — #fkrTopUniM (실서비스 mobile/header.jsp 주입분) ·
   .fkrm-top (리뉴얼 m 페이지). 같은 밴드 조각(chuseok/band_m.jsp)을 쓰므로 셀렉터도 쌍으로 유지.
   핸드오프는 #fkrTopUniM 만 적었는데, .fkrm-top 을 빼면 그쪽은 씬만 들어가고 배치 CSS 가 없어
   레이아웃이 깨진다. 가을판(topbar_autumn.css 158~)과 동일한 처리 — 지우지 말 것 */
#fkrTopUniM.fkr-chuseok, .fkrm-top.fkr-chuseok{ position:relative; background:transparent; overflow:hidden; }
#fkrTopUniM.fkr-chuseok > .fkrm-scene, .fkrm-top.fkr-chuseok > .fkrm-scene{
  position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; pointer-events:none;
}
#fkrTopUniM.fkr-chuseok > *:not(.fkrm-scene), .fkrm-top.fkr-chuseok > *:not(.fkrm-scene){ position:relative; z-index:1; }
#fkrTopUniM.fkr-chuseok .fkrm-uni-search, .fkrm-top.fkr-chuseok .fkrm-search{ background:#ffffff; border-color:#f2d3b4; }
#fkrTopUniM.fkr-chuseok .fkrm-uni-search input::placeholder,
.fkrm-top.fkr-chuseok .fkrm-search input::placeholder{
  color:#9a5a3a; opacity:1; font-weight:600; font-size:10.5px; letter-spacing:-.04em;
}
#fkrTopUniM.fkr-chuseok .fkrm-uni-menu, .fkrm-top.fkr-chuseok .fkrm-menu{ color:#5c3418; }  /* 지붕 위에 겹쳐도 4.5:1 확보 */

/* [핸드오프 밖 보강 ②] 좁은 폭 방어 — 핸드오프 기본값(10.5px)은 390px 이상에서만 문구가 끝까지 들어간다.
   가을판 실측(Pretendard, 2026-08-31): input 폭 360px→108px / 375px→123px 인데 문구는 124px 이라
   "…파일쿠키와 함…" 으로 잘렸다. 추석 문구도 같은 길이라 그대로 적용한다.
   320px(input 68px)은 이 방법으로 안 된다 — 문구 자체를 줄여야 하는 카피 결정이라 손대지 않았다 */
@media (max-width:389px){
  #fkrTopUniM.fkr-chuseok .fkrm-uni-search input::placeholder,
  .fkrm-top.fkr-chuseok .fkrm-search input::placeholder{ font-size:9px; letter-spacing:-.06em; }
}

html[data-dark=true] #fkrTopUniM.fkr-chuseok, html[data-dark=true] .fkrm-top.fkr-chuseok{ background:transparent; }
html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-uni-search, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-search{ background:#2c2638; border-color:#4a4260; }
html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-uni-search input::placeholder, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-search input::placeholder{ color:#f0d9a0; }
html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-uni-menu, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-menu{ color:#c9b8d6; }

#fkrTopUniM.fkr-chuseok .fkrm-scene-dk, .fkrm-top.fkr-chuseok .fkrm-scene-dk{ display:none; }
html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-scene-lt, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-scene-lt{ display:none; }
html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-scene-dk, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-scene-dk{ display:block; }

/* [핸드오프 밖 보강 ③] 넓은 화면 방어 — 씬 SVG 는 폰 폭(320~480px) 기준이라 PC 폭으로 열면
   slice 크롭이 아래쪽(마당 띠)만 남겨 민무늬 바가 된다 (2026-08-12 여름판에서 실확인).
   520px 이상에서는 씬을 내리고 하늘 그라디언트 + 마당 띠로 대신한다.
   마당 6px = 모바일 씬의 마당 스트립(y43~49)과 같은 두께 · 색은 추석 팔레트 */
@media (min-width:520px){
  #fkrTopUniM.fkr-chuseok .fkrm-scene, .fkrm-top.fkr-chuseok .fkrm-scene,
  html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-scene-lt, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-scene-lt,
  html[data-dark=true] #fkrTopUniM.fkr-chuseok .fkrm-scene-dk, html[data-dark=true] .fkrm-top.fkr-chuseok .fkrm-scene-dk{ display:none; }
  #fkrTopUniM.fkr-chuseok, .fkrm-top.fkr-chuseok{ background:linear-gradient(180deg,#fbe3d4 0%,#f7c9a0 100%); }
  #fkrTopUniM.fkr-chuseok::after, .fkrm-top.fkr-chuseok::after{
    content:""; position:absolute; left:0; right:0; bottom:0; height:6px; pointer-events:none;
    background:linear-gradient(180deg,#e8bc8d 0 1px,#c9915a 1px 4px,#a66f3e 4px 6px);
  }
  html[data-dark=true] #fkrTopUniM.fkr-chuseok, html[data-dark=true] .fkrm-top.fkr-chuseok{ background:linear-gradient(180deg,#1c1d3a 0%,#3a2f4a 100%); }
  html[data-dark=true] #fkrTopUniM.fkr-chuseok::after, html[data-dark=true] .fkrm-top.fkr-chuseok::after{
    background:linear-gradient(180deg,#8a6a55 0 1px,#5a3f2e 1px 4px,#3f2c20 4px 6px);
  }
}