/* MIDNIGHT PROJECTION · 라공 판 디자인 (나루 style 위에 덮어씀) */
/* 위쪽 메뉴 */
.mn{position:relative;z-index:30;margin:0 -16px 8px;color:var(--text)}
.mn-in{display:flex;align-items:center;gap:24px;padding:18px 16px 0}
.mn-br{flex:none;font:500 12px/1 'Cinzel',serif;letter-spacing:.26em;color:var(--text);text-decoration:none;white-space:nowrap}
.mn-ls{display:flex;gap:2px;margin:0 auto;padding:0;list-style:none}
.mn-it{position:relative}
.mn-it>a{display:block;padding:10px 11px;font:400 11px/1 'Questrial',sans-serif;letter-spacing:.24em;color:var(--dim);text-decoration:none}
.mn-it>a::after{content:"";display:block;height:1px;margin-top:8px;background:var(--acc);transform:scaleX(0);transition:transform .25s}
.mn-it:hover>a,.mn-it>a.on{color:var(--text)}.mn-it>a.on::after,.mn-it:hover>a::after{transform:scaleX(1)}
.mn-dd{position:absolute;left:50%;top:100%;min-width:150px;padding:8px 0;transform:translate(-50%,6px);opacity:0;visibility:hidden;transition:opacity .2s,transform .2s,visibility 0s .2s;border:1px solid color-mix(in srgb,var(--text) 14%,transparent);border-radius:6px;background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.mn-it:hover .mn-dd,.mn-it:focus-within .mn-dd{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .2s,transform .2s}
.mn-dd a{display:flex;align-items:baseline;gap:10px;padding:8px 18px;font:400 13px/1.2 'Gothic A1',sans-serif;color:var(--dim);text-decoration:none;white-space:nowrap}
.mn-dd a span{font:500 10px 'Barlow Condensed',sans-serif;letter-spacing:.1em;color:var(--acc)}
.mn-dd a:hover,.mn-dd a.on{color:var(--text);background:color-mix(in srgb,var(--text) 7%,transparent)}
.mn-ut{display:flex;align-items:center;gap:6px;flex:none}
.mn-ut button{padding:6px 11px;border:1px solid color-mix(in srgb,var(--text) 22%,transparent);border-radius:30px;background:none;font:400 11px 'Gothic A1',sans-serif;color:var(--dim);cursor:pointer}
.mn-ut button:hover{color:var(--text);border-color:var(--text)}
.mn-ct{font-size:9.5px;letter-spacing:.16em;color:var(--dim);margin-right:6px}.mn-ct b{color:var(--text);font-weight:400}
.mn-me{display:flex;flex-direction:column;align-items:flex-end;margin-left:6px;line-height:1.2;text-decoration:none;font-size:12px;color:var(--text)}.mn-me small{font:500 9px 'Barlow Condensed',sans-serif;letter-spacing:.18em;color:var(--acc)}
.mn-sub{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 22px;margin:12px 0 0;padding:0 16px}
.mn-sub a{padding-bottom:4px;border-bottom:1px solid transparent;font:400 12.5px 'Gothic A1',sans-serif;color:var(--dim);text-decoration:none}
.mn-sub a:hover{color:var(--text)}.mn-sub a.on{color:var(--text);border-color:var(--acc)}
@media (max-width:860px){.mn-in{flex-wrap:wrap;gap:8px}.mn-ls{order:3;width:100%;overflow-x:auto;justify-content:flex-start}.mn-ct{display:none}}
/* 제목 + 궤도 */
.xhead{position:relative;padding:54px 0 6px}
.xhead .xl{font:500 10px 'Questrial',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--acc)}
.xhead h1{position:relative;display:inline-block;isolation:isolate;margin:12px 0 0;font:400 clamp(52px,9vw,84px)/.95 'Instrument Serif',serif;font-style:italic;color:var(--text)}
.xhead h1.kr{font:700 clamp(36px,7vw,52px)/1.1 'Gowun Batang',serif;font-style:normal}
.xhead p{margin:14px 0 0;max-width:56ch;font-size:13px;line-height:1.6;color:var(--dim)}
.xorb2{position:absolute;left:-16%;right:-22%;top:-38%;bottom:-38%;color:var(--acc);pointer-events:none;z-index:-1}
.xorb2 svg{width:100%;height:100%;overflow:visible}
.xorb2 .tw{animation:xtw2 4s ease-in-out infinite}@keyframes xtw2{0%,100%{opacity:.15}50%{opacity:.9}}
.hallhd{display:flex;flex-direction:column;align-items:center;gap:14px;padding:56px 0 10px;text-align:center}
.hallhd .ns{display:flex;align-items:center;gap:12px;font:500 10.5px 'Questrial',sans-serif;letter-spacing:.42em;color:var(--acc)}
.hallhd .ns::before,.hallhd .ns::after{content:"";width:34px;border-top:1px dotted currentColor;opacity:.7}
.hallhd h1{position:relative;display:inline-block;isolation:isolate;margin:0;padding-left:.18em;font:500 clamp(36px,6vw,66px)/1 'Cinzel',serif;letter-spacing:.18em;text-transform:uppercase;color:var(--text)}
.hpill{display:inline-flex;align-items:center;gap:12px;padding:6px 8px;border:1px solid color-mix(in srgb,var(--text) 40%,transparent);border-radius:40px}
.hpill .k{font:500 9.5px 'Questrial',sans-serif;letter-spacing:.32em;color:var(--dim)}.hpill b{font:600 20px/1 'Cinzel',serif;color:var(--text)}
.hpill small{font:400 12.5px 'Gowun Batang',serif;color:var(--text)}.hpill .n{font:500 11px 'Barlow Condensed',sans-serif;letter-spacing:.12em;color:var(--dim)}
.hpill .ar{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:15px;color:var(--dim);text-decoration:none}.hpill .ar:hover{color:var(--text);background:color-mix(in srgb,var(--text) 12%,transparent)}
.hallhd .ph3{font:500 10px 'Questrial',sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}
@media (prefers-reduced-motion:reduce){.xorb2 .tw{animation:none}.xorb2 animateMotion{display:none}}
/* 네모 상자 걷어내기 */
.sec{padding:0 0 10px!important;background:none!important;border:0!important;border-bottom:1px solid var(--line2)!important;border-radius:0!important;align-items:baseline}
.sec>span:first-child{font:400 28px/1 'Instrument Serif',serif;font-style:italic;letter-spacing:0;text-transform:none;color:var(--text)}
.tabs{background:none!important;border:0!important;border-bottom:1px solid var(--line2)!important;border-radius:0!important;padding:0!important}
/* 홈 라디오 선곡 버튼 */
.ota{cursor:default}
.hkeys{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 2px}
.hk{display:inline-flex;align-items:baseline;gap:6px;padding:4px 9px;border-radius:3px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);background:rgba(0,0,0,.18);font:500 11px 'Gothic A1',sans-serif;color:inherit;box-shadow:0 2px 0 rgba(0,0,0,.35);cursor:pointer;transition:transform .1s,box-shadow .1s}
.hk b{font:500 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.12em;opacity:.7}
.hk:hover{background:rgba(255,255,255,.08)}.hk.on{transform:translateY(2px);box-shadow:none;background:rgba(255,255,255,.14);border-color:currentColor}
/* 프로필: 크레딧 아래 영사실 · 쇼타임 */
.pfx{margin-top:84px}
@media (max-width:860px){.pfx{margin-top:64px}}
/* 방명록: 글마다 필름 한 장면 */
.tstub2{display:block;margin:18px 0 0 auto;padding:6px 14px;border:1px solid var(--line2);border-radius:30px;background:none;font:500 11px 'Questrial',sans-serif;letter-spacing:.14em;color:var(--dim);cursor:pointer}
.fc{display:grid;grid-template-columns:14px minmax(0,1fr) 14px;margin-top:18px;border-radius:4px;overflow:hidden;background:var(--film);box-shadow:0 16px 30px -20px rgba(0,0,0,.8)}
.fc-in{padding:14px 20px;color:#E6DCC8;min-width:0}
.fc-hd{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-bottom:10px;border-bottom:1px dashed rgba(230,220,200,.22);font:500 11px 'Nanum Gothic Coding',monospace;letter-spacing:.12em;color:#B5A890}
.fc-hd span{white-space:nowrap}.fc-hd span:first-child{display:flex;align-items:center;gap:6px;color:#ff6b6b}.fc-hd span:nth-child(2){color:#E6DCC8}
.fc-hd .bat{justify-self:end;width:20px;height:10px;border:1.5px solid #B5A890;border-radius:2px;position:relative}.fc-hd .bat i{position:absolute;left:1px;top:1px;bottom:1px;width:60%;background:#B5A890}
.fc-who{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.fc-who .av{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(230,220,200,.12);font:600 12px 'Hahmlet',serif;color:#F2EADA}
.fc-who b{font:600 15px 'Hahmlet',serif;color:#F2EADA}
.fc-who .mine{padding:1px 8px;border-radius:20px;background:var(--acc);font:600 10px 'Barlow Condensed',sans-serif;letter-spacing:.16em;color:var(--acc-ink)}
.fc-who .gm-re{margin-left:auto}
.fc .t{margin:10px 0 0;font:400 14.5px/1.85 'Gothic A1',sans-serif;color:#F2EADA;white-space:pre-line;word-break:keep-all;background:none;padding:0}
.fc-ft{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:10px;border-top:1px dashed rgba(230,220,200,.22);font:500 10.5px 'Barlow Condensed',sans-serif;letter-spacing:.18em;color:#9A8E78}
.fc .cm{margin:10px 0 0;padding:0 0 0 14px;list-style:none;border-left:1px solid rgba(230,220,200,.2)}
.fc .cm li{padding:6px 0}.fc .cm b{font:600 13px 'Hahmlet',serif;color:#E6DCC8;margin-right:8px}.fc .cm b.me{color:var(--acc)}.fc .cm time{font:400 10.5px 'Barlow Condensed',sans-serif;color:#9A8E78}
.fc .cm p{margin:3px 0 0;font-size:13.5px;line-height:1.7;color:#F2EADA;background:none;padding:0}
.fc.mine{box-shadow:0 0 0 1px var(--acc),0 16px 30px -20px rgba(0,0,0,.8)}
.fc .gm.compose,.fc .gthr{margin-top:10px}
/* 답장 · 이어서 답글 칸: 카드 폭 그대로, 버튼 한 줄 */
.fc .gthr{width:100%;max-width:560px}
.fc .gc-act{flex-wrap:wrap}
.fc .gc-act button{white-space:nowrap}
.gbw .gbw-r label span,.gbw .msg span{display:block;font:500 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.26em;color:#B5A890}
.gbw input,.gbw textarea{width:100%;box-sizing:border-box;padding:7px 0;border:0;border-bottom:1px dashed rgba(230,220,200,.35);background:transparent;color:#F2EADA;font:400 14px 'Gothic A1',sans-serif}
.gbw .msg{display:block;margin-top:12px}
.gbw .who{display:flex;align-items:baseline;gap:10px;padding:4px 0}.gbw .who span{font:500 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.26em;color:#B5A890}.gbw .who b{font:600 15px 'Hahmlet',serif;color:#F2EADA}.gbw .who em{font:normal 500 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.2em;color:#B5A890;padding:1px 6px;border:1px solid rgba(230,220,200,.3);border-radius:20px}
.gbw .gact{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:10px}
.gbw .chk{font:500 11px 'Gothic A1',sans-serif;color:#B5A890}
.gbw .save{margin-left:auto;padding:8px 16px;border:1px solid #E6DCC8;border-radius:30px;background:none;font:500 10.5px 'Barlow Condensed',sans-serif;letter-spacing:.22em;color:#F2EADA;cursor:pointer}
.gbw .save:hover{background:#E6DCC8;color:#14110d}
/* 비밀글: 편집실 장면 */
.lkd{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;align-items:stretch;margin-top:12px}
.lkd-cd{position:relative;aspect-ratio:1;border-radius:2px;background:radial-gradient(circle,#2a251d 0 30%,#1d1912 31% 100%);overflow:hidden}
.lkd-cd .sw{position:absolute;inset:-20%;background:conic-gradient(from 0deg,rgba(230,220,200,.14) 0deg,rgba(230,220,200,.14) 90deg,transparent 90deg);animation:mpsweep 1s linear infinite}
@keyframes mpsweep{to{rotate:360deg}}
.lkd-cd .ch{position:absolute;left:0;right:0;top:50%;border-top:1px solid rgba(230,220,200,.35)}.lkd-cd .cv{position:absolute;top:0;bottom:0;left:50%;border-left:1px solid rgba(230,220,200,.35)}
.lkd-cd .ring{position:absolute;inset:12%;border:1.5px solid rgba(230,220,200,.45);border-radius:50%}
.lkd-cd b{position:absolute;inset:0;display:grid;place-items:center;font:700 40px 'Barlow Condensed',sans-serif;color:#E6DCC8}
.lkd-rb{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:14px 18px;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 22%,#14110d),#14110d 70%);border:1px solid color-mix(in srgb,var(--acc) 45%,transparent);color:#E6DCC8;overflow:hidden}
.lkd-rb small{font:500 10px 'Cinzel',serif;letter-spacing:.2em;opacity:.85}.lkd-rb b{font:700 19px 'Hahmlet',serif;color:var(--acc)}.lkd-rb p{margin:0;font-size:12.5px;line-height:1.6;opacity:.9}
.lkd-st{position:absolute;right:12px;top:10px;padding:2px 8px;border:1.5px solid color-mix(in srgb,var(--acc) 70%,transparent);font:700 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.2em;color:var(--acc);transform:rotate(6deg)}
@media (prefers-reduced-motion:reduce){.lkd-cd .sw{animation:none}}
@media (max-width:560px){.lkd{grid-template-columns:72px minmax(0,1fr)}}
.mn .hud{display:none!important}

/* 폰 · 태블릿: 마우스 올리기 메뉴를 끄기 (첫 탭이 무시되던 문제) + 위쪽 메뉴 여섯 개가 한눈에 */
@media (hover:none){.mn-it:hover .mn-dd,.mn-it:focus-within .mn-dd{opacity:0;visibility:hidden}.mn-it:hover>a::after{transform:scaleX(0)}.mn-it>a.on::after{transform:scaleX(1)}}
@media (max-width:560px){.mn-ls{flex-wrap:wrap;justify-content:center;overflow:visible;gap:0 2px}.mn-it>a{padding:8px 7px;font-size:10.5px;letter-spacing:.14em}.mn-it>a::after{margin-top:5px}}

/* 라공 상단바 · A안 매표소 티켓: 양옆이 파인 작은 입장권 (기본 티켓과 같은 종이) */
.mn-ra{display:inline-flex;align-items:center;gap:6px;margin:0 2px 0 6px}
.mn-ic{position:relative;display:inline-flex;align-items:center;gap:6px;height:27px;padding:0 10px 0 9px;color:#1D1B17;text-decoration:none;font:600 10px 'Barlow Condensed',sans-serif;letter-spacing:.16em;
  background:radial-gradient(60% 80% at 80% 100%,rgba(120,90,40,.16),transparent 70%),repeating-linear-gradient(0deg,rgba(0,0,0,.025) 0 1px,transparent 1px 3px),#E7E0CE;
  -webkit-mask:radial-gradient(circle 4px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 4px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;
          mask:radial-gradient(circle 4px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 4px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;transition:transform .2s}
[data-theme="day"] .mn-ic{background:radial-gradient(60% 80% at 80% 100%,rgba(120,90,40,.2),transparent 70%),repeating-linear-gradient(0deg,rgba(0,0,0,.03) 0 1px,transparent 1px 3px),#E9DCC0}
.mn-ic:not(.on){background:color-mix(in srgb,#E7E0CE 16%,transparent);color:var(--dim)}
[data-theme="day"] .mn-ic:not(.on){background:color-mix(in srgb,#C9A46A 16%,transparent);color:var(--dim)}
.mn-ic:hover{transform:translateY(-1px);color:var(--text)}.mn-ic.on:hover{color:#1D1B17}
.mn-ic svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;flex:none}
.mn-ic svg circle{fill:currentColor;stroke:none}
.mn-ic b{padding-left:6px;border-left:1px dashed rgba(29,27,23,.45);font:400 12px 'Special Elite','Courier New',monospace;letter-spacing:0;color:#1E3F3B}
[data-theme="day"] .mn-ic b{color:#8A4B36}
@media (max-width:1599px){.mn-ic span{display:none}.mn-ic{padding:0 9px}}
@media (max-width:560px){.mn-ra{gap:4px;margin:0}.mn-ic{height:25px;padding:0 7px;gap:4px}.mn-ic b{padding-left:4px;font-size:11px}}
/* 정보수정 · 로그아웃 · 관리자: 닉네임을 누르면 펼침 (라공 모바일 메뉴처럼) */
.mn-ut{position:relative}
.mn-me{cursor:pointer}
.mn-ac{display:none;position:absolute;right:0;top:calc(100% + 10px);z-index:60;flex-direction:column;min-width:170px;padding:16px 0 8px;color:#1D1B17;
  background:radial-gradient(70% 50% at 85% 90%,rgba(120,90,40,.14),transparent 70%),repeating-linear-gradient(0deg,rgba(0,0,0,.02) 0 1px,transparent 1px 3px),#E7E0CE;box-shadow:0 18px 36px -18px rgba(0,0,0,.75);
  -webkit-mask:radial-gradient(circle 5px at 50% 0,#0000 98%,#000) top/12px 100% repeat-x;mask:radial-gradient(circle 5px at 50% 0,#0000 98%,#000) top/12px 100% repeat-x}
[data-theme="day"] .mn-ac{background:radial-gradient(70% 50% at 85% 90%,rgba(120,90,40,.18),transparent 70%),repeating-linear-gradient(0deg,rgba(0,0,0,.025) 0 1px,transparent 1px 3px),#E9DCC0}
.mn-ut.ac-on .mn-ac{display:flex}
.mn-ac .ac-h{padding:0 18px 9px;border-bottom:1px dashed rgba(29,27,23,.35);font:600 9.5px 'Barlow Condensed',sans-serif;letter-spacing:.26em;white-space:nowrap}
.mn-ac a{padding:9px 18px;font:400 13px 'Special Elite','Gothic A1',monospace;color:#1D1B17;text-decoration:none;white-space:nowrap}
.mn-ac a+a{border-top:1px dotted rgba(29,27,23,.25)}
.mn-ac a:hover{background:rgba(29,27,23,.06)}
/* 손님: 회원가입은 그냥 글자로 */
.mn-ra:not(:has(.mn-ic)) .mn-ac{position:static;display:inline-flex;padding:0;border:0;background:none;box-shadow:none;min-width:0;-webkit-mask:none;mask:none;color:var(--dim)}
.mn-ra:not(:has(.mn-ic)) .mn-ac a{color:var(--dim);font-family:'Gothic A1',sans-serif}
.mn-ra:not(:has(.mn-ic)) .mn-ac a{padding:4px 6px;font-size:11.5px}
@media (max-width:1500px){.mn-ct{display:none}}
.nbl2{display:flex;gap:16px;margin-top:10px}.nbl2 a{font:500 10.5px 'Barlow Condensed',sans-serif;letter-spacing:.18em;color:var(--acc);text-decoration:none}.nbl2 a:hover{color:var(--text)}
/* 태블릿 가로 (861~1180): 메뉴를 둘째 줄로 내려서 오른쪽 아이콘이 안 밀리게 */
@media (min-width:861px) and (max-width:1180px){.mn-in{flex-wrap:wrap;row-gap:4px}.mn-br{flex:1}.mn-ls{order:3;width:100%;justify-content:center}}
@media (max-width:400px){.mn-ut [data-act="sfx"]{display:none}} /* 아주 좁은 폰: 효과음 버튼만 숨김 */
@media (max-width:359px){.mn-ut button{padding:5px 8px}.mn-ra{gap:3px}.mn-ic{padding:0 6px}}
