/* GO기릿 v2 — 글래스 다크 (검정+빨강). 모바일 우선.
   성능 규칙: backdrop-filter 는 헤더·탭바·모달·메뉴그리드처럼 "면적 크고 개수 적은" 곳에만.
   목록 카드는 반투명+보더로 유리 질감만 낸다 (blur 없음 — 저가 기기 스크롤 보호). */

@font-face{font-family:Pretendard;font-weight:400;font-style:normal;font-display:swap;
  src:url(../fonts/Pretendard-Regular.woff2) format('woff2')}
@font-face{font-family:Pretendard;font-weight:500;font-style:normal;font-display:swap;
  src:url(../fonts/Pretendard-Medium.woff2) format('woff2')}
@font-face{font-family:Pretendard;font-weight:600;font-style:normal;font-display:swap;
  src:url(../fonts/Pretendard-SemiBold.woff2) format('woff2')}
@font-face{font-family:Pretendard;font-weight:800;font-style:normal;font-display:swap;
  src:url(../fonts/Pretendard-ExtraBold.woff2) format('woff2')}

:root{
  --bg:#07080C;
  --glass:rgba(255,255,255,.045);
  --glass-hi:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.10);
  --line-soft:rgba(255,255,255,.06);
  --inset:inset 0 1px 0 rgba(255,255,255,.07);
  --text:#F3F3F5; --text-2:#B9B9C2; --muted:#84848E;
  --red:#C8102E; --red-hi:#E4173A; --red-glow:rgba(200,16,46,.20);
  --r:18px; --r-sm:12px; --blur:14px;
  --tabh:66px; --maxw:1080px; --pad:16px;
  --ease:cubic-bezier(.2,.7,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased;
  padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 8px);
}
/* 고정 배경 그라디언트 — attachment:fixed 대신 고정 레이어 (iOS 스크롤 보호) */
#bgfx{position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(110% 64% at 50% -12%, #1A1220 0%, rgba(26,18,32,0) 58%),
    radial-gradient(70% 46% at 108% 26%, rgba(200,16,46,.13) 0%, rgba(200,16,46,0) 62%),
    radial-gradient(64% 42% at -10% 74%, rgba(94,10,28,.14) 0%, rgba(94,10,28,0) 60%),
    #07080C}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0}
input,textarea,select{font:inherit}
:focus-visible{outline:2px solid var(--red-hi); outline-offset:2px; border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--pad)}
.view{min-height:62vh; outline:none}
.sect{padding:26px 0 4px}
.shead{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 0 14px}
.shead h2{margin:0; font-size:23px; font-weight:800; letter-spacing:-.02em}
.shead .more{font-size:15px; font-weight:500; color:var(--muted); min-height:24px}
.eyebrow{font-size:13px; font-weight:600; letter-spacing:.18em; color:var(--red-hi); margin:0 0 8px}
.lead{color:var(--text-2); font-size:17px; margin:0 0 14px}

/* ── 글래스 프리미티브 ── */
.glass{background:var(--glass); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--inset)}
.glass-blur{background:rgba(16,16,22,.55); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--inset);
  backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur))}
.glow{box-shadow:var(--inset), 0 0 56px -16px var(--red-glow)}

/* ── 인트로 (첫 접속 시 포스터가 떴다가 메인으로) ── */
#intro{position:fixed; inset:0; z-index:200; background:#0A0E1C;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  opacity:0; animation:introIn .5s var(--ease) forwards;
  transition:opacity .6s var(--ease)}
#intro.out{opacity:0; pointer-events:none}
#intro img{width:100%; height:100%; object-fit:cover; object-position:center top}
#intro #introSkip{position:absolute; right:16px; bottom:calc(20px + env(safe-area-inset-bottom));
  min-height:42px; padding:0 18px; border-radius:999px; font-size:15.5px; font-weight:600;
  color:#fff; background:rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.35);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
@keyframes introIn{to{opacity:1}}

/* ── 헤더 ── */
.topbar{position:sticky; top:0; z-index:50;
  background:rgba(9,10,15,.66); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line-soft); padding-top:env(safe-area-inset-top)}
.topbar-in{max-width:var(--maxw); margin:0 auto; height:56px; padding:0 var(--pad);
  display:flex; align-items:center; gap:10px}
.brand{display:flex; align-items:center; min-height:44px}
.brand-txt{font-size:23px; font-weight:800; letter-spacing:-.03em; color:var(--text)}
.brand-txt i{font-style:normal; color:var(--red-hi)}
.topnav{display:none; gap:2px; margin-left:8px}
.topnav a{padding:8px 12px; font-size:16px; font-weight:500; color:var(--text-2); border-radius:10px}
.topnav a[aria-current="page"]{color:var(--text); background:var(--glass-hi)}
.topicons{display:flex; gap:2px; margin-left:auto}
.ticon{position:relative; width:44px; height:44px; display:flex; align-items:center;
  justify-content:center; color:var(--muted); border-radius:12px}
.ticon svg{width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round}
.ticon[aria-current="page"]{color:var(--red-hi)}
.ticon:active{background:var(--glass-hi)}
.ticon .badge{position:absolute; top:5px; right:4px; min-width:16px; height:16px; border-radius:8px;
  background:var(--red); color:#fff; font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center; padding:0 4px; font-variant-numeric:tabular-nums}

/* ── 히어로 (홈) ── */
.hero{position:relative; padding:34px 0 6px; text-align:center}
.hero h1{margin:2px 0 0; font-size:clamp(46px,13vw,74px); font-weight:800; letter-spacing:-.045em; line-height:1.02}
.hero h1 i{font-style:normal; color:var(--red-hi)}
.hero .sub{font-size:17px; font-weight:600; color:var(--text-2); margin:6px 0 0}
/* ⚠️ 한글은 `word-break:keep-all` 이 없으면 어절 한가운데서 잘린다("무대를 펼 / 칩니다").
   폰트를 키운 뒤 실제로 그렇게 깨졌다(2026-08-13). max-width 도 같이 넓혔다.
   `white-space:pre-line` 은 hero_copy 의 줄바꿈(\n)을 살리기 위한 것이니 지우지 마라. */
.hero .copy{font-size:16px; color:var(--muted); line-height:1.75; margin:12px auto 0; max-width:440px;
  white-space:pre-line; word-break:keep-all; text-wrap:pretty}
.hero .dday{display:inline-flex; align-items:center; gap:10px; margin-top:18px;
  padding:10px 18px; border-radius:999px;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset), 0 0 44px -14px var(--red-glow);
  font-size:16px; font-weight:600}
.hero .dday b{color:var(--red-hi); font-variant-numeric:tabular-nums; font-weight:800}
.hero .dday .lv{display:inline-flex; align-items:center; gap:6px; color:var(--red-hi)}

/* ── 엑셀방송 채널 배너 (홈) ──
   평소엔 공지바와 같은 톤으로 조용히 있다가, 방송이 켜지면 빨간 라이브 배너가 된다. */
.bcast{display:flex; align-items:center; gap:13px; margin:22px 0 0;
  padding:14px 16px; border-radius:var(--r);
  background:rgba(255,255,255,.06); border:1px solid var(--line);
  box-shadow:var(--inset); min-height:68px}
.bcast .bc-ic{position:relative; flex:0 0 auto; width:44px; height:44px}
.bcast .bc-ic img{width:44px; height:44px; border-radius:50%; object-fit:cover;
  background:rgba(255,255,255,.05)}
/* 상태 점 — 꺼져 있으면 회색, 켜지면 빨강 + 맥박 */
.bcast .bc-ic .dot{position:absolute; right:-1px; bottom:-1px; width:13px; height:13px;
  border-radius:50%; background:var(--muted); border:2px solid #0B0C11}
.bcast .bc-txt{display:flex; flex-direction:column; gap:3px; min-width:0}
.bcast .bc-txt b{display:flex; align-items:center; gap:7px;
  font-size:17px; font-weight:800; letter-spacing:-.02em; color:var(--text)}
.bcast .bc-txt .st{font-size:14.5px; color:var(--muted); word-break:keep-all}
.bcast .bc-go{margin-left:auto; flex:0 0 auto; font-size:14.5px; font-weight:600; color:var(--muted)}
/* 좁은 화면에서는 핸들(@gogogirit)이 상태 문구를 밀어 「아닙/니다」로 깨뜨린다.
   꺼져 있을 때는 핸들을 숨긴다 — 화살표만으로도 채널로 나간다는 건 전달된다.
   켜져 있을 때의 「보러 가기」는 행동 유도라 남긴다. */
@media (max-width:480px){
  .bcast .bc-go{display:none}
  .bcast.on .bc-go{display:block}
}
.bcast svg{flex:0 0 auto; width:16px; height:16px; stroke:var(--muted); fill:none; stroke-width:1.6}

.bcast.on{border-color:var(--red); background:rgba(200,16,46,.13);
  box-shadow:var(--inset), 0 0 52px -14px var(--red-glow)}
.bcast.on .bc-ic .dot{background:var(--red-hi); animation:bcPulse 1.6s ease-out infinite}
.bcast.on .bc-txt .st{color:var(--text-2)}
.bcast.on .bc-go{color:var(--red-hi); font-weight:700}
.bcast.on svg{stroke:var(--red-hi)}
@keyframes bcPulse{0%{box-shadow:0 0 0 0 rgba(228,23,58,.55)}70%{box-shadow:0 0 0 8px rgba(228,23,58,0)}100%{box-shadow:0 0 0 0 rgba(228,23,58,0)}}
@media (prefers-reduced-motion:reduce){ .bcast.on .bc-ic .dot{animation:none} }

/* ── 한 줄 공지 ── */
.noticebar{display:flex; align-items:center; gap:10px; margin:20px 0 0;
  padding:11px 14px; border-radius:var(--r-sm);
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset);
  min-height:44px}
.noticebar .k{flex:0 0 auto; font-size:13px; font-weight:700; letter-spacing:.1em; color:var(--red-hi)}
.noticebar .t{font-size:15.5px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.noticebar svg{flex:0 0 auto; width:15px; height:15px; margin-left:auto; stroke:var(--muted); fill:none; stroke-width:1.6}

/* ── 자주 찾는 메뉴 6 ── */
.menu6{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:18px}
.menu6 a{position:relative; display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:18px 6px 14px; border-radius:var(--r);
  background:rgba(18,18,26,.5); border:1px solid var(--line); box-shadow:var(--inset);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:background .18s var(--ease); min-height:88px}
.menu6 a:active{background:var(--glass-hi)}
.menu6 svg{width:24px; height:24px; fill:none; stroke:var(--red-hi); stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round}
.menu6 span{font-size:14.5px; font-weight:600; color:var(--text-2); letter-spacing:-.01em}
.menu6 .badge{position:absolute; top:10px; right:12px; min-width:17px; height:17px; border-radius:9px;
  background:var(--red); color:#fff; font-size:12.5px; font-weight:700; display:flex; align-items:center;
  justify-content:center; padding:0 5px; font-variant-numeric:tabular-nums}

/* ── 크루 카드 ── */
.crew-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px}
.card{position:relative; display:block; border-radius:var(--r); overflow:hidden;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset);
  padding:12px; transition:background .18s var(--ease), border-color .18s var(--ease)}
.card:active{background:var(--glass-hi); border-color:rgba(228,23,58,.4)}
.card .no{font-size:13px; font-weight:600; letter-spacing:.14em; color:var(--muted); font-variant-numeric:tabular-nums}
.card .av{position:relative; width:100%; aspect-ratio:1/1; margin:8px 0 10px; border-radius:50%;
  overflow:hidden; background:rgba(255,255,255,.03)}
.card .av img{width:100%; height:100%; object-fit:cover}
.card .ini{width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-size:36px; font-weight:800; color:rgba(255,255,255,.14)}
.card .nm{font-size:18.5px; font-weight:700; letter-spacing:-.01em; display:flex; align-items:center; gap:7px}
.card .tg{font-size:14px; color:var(--text-2); margin-top:3px; min-height:34px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.card .tg.one{-webkit-line-clamp:1; min-height:0}
.card .word{display:flex; gap:6px; margin-top:7px; padding-top:7px; border-top:1px solid var(--line-soft)}
.card .word svg{width:12px; height:12px; flex:0 0 12px; margin-top:5px; fill:var(--red); stroke:none}
.card .word span{font-size:14.5px; color:var(--text); line-height:1.5; font-weight:500;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.card .meta{display:flex; align-items:center; gap:8px; margin-top:10px; padding-top:9px;
  border-top:1px solid var(--line-soft); font-size:13px; color:var(--muted)}
.card .meta b{color:var(--text-2); font-weight:600; font-variant-numeric:tabular-nums}
.card .axis{margin-left:auto; color:var(--red-hi); font-weight:600}
.card.soon{background:rgba(255,255,255,.02); border-style:dashed}
.card.soon .cs{font-size:13px; font-weight:700; letter-spacing:.2em; color:var(--red); margin-top:8px}
.card.soon .nm{color:var(--muted); font-weight:500; font-size:17px}
.card.soon .ph{width:100%; height:100%; display:flex; align-items:center; justify-content:center}
.card.soon .ph i{display:block; width:34px; height:1px; background:var(--line)}

/* LIVE 뱃지 */
.live{display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:999px;
  background:var(--red); color:#fff; font-size:12.5px; font-weight:800; letter-spacing:.08em}
.live i{width:6px; height:6px; border-radius:50%; background:#fff; animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.card .live{position:absolute; top:18px; left:18px; z-index:2}

/* 즐겨찾기 */
.fav{position:absolute; top:8px; right:8px; z-index:2; width:44px; height:44px;
  display:flex; align-items:center; justify-content:center; border-radius:12px}
.fav svg{width:20px; height:20px; fill:none; stroke:rgba(255,255,255,.4); stroke-width:1.6}
.fav[aria-pressed="true"] svg{fill:var(--red); stroke:var(--red)}
.fav:active{background:var(--glass-hi)}

/* 홈 크루 요약 — 가로 스크롤 */
.crew-scroll{display:flex; gap:10px; overflow-x:auto; padding:2px 2px 10px; margin:0 -2px;
  scroll-snap-type:x proximity; scrollbar-width:none}
.crew-scroll::-webkit-scrollbar{display:none}
.crew-scroll .card{flex:0 0 148px; scroll-snap-align:start; padding:10px}
.crew-scroll .card .tg{display:none}
.crew-scroll .card .nm{font-size:16.5px}
.crew-scroll .card .meta{margin-top:8px}

/* ── 상세 ── */
.detail-hd{display:flex; gap:14px; align-items:flex-start; padding:22px 0 14px}
.detail-hd .av{position:relative; width:96px; height:96px; flex:0 0 96px; border-radius:50%;
  overflow:hidden; background:var(--glass)}
.detail-hd .av img{width:100%; height:100%; object-fit:cover}
.detail-hd h1{margin:0; font-size:27px; font-weight:800; letter-spacing:-.03em;
  display:flex; align-items:center; gap:9px; flex-wrap:wrap}
.detail-hd .hd{font-size:15px; color:var(--muted); margin-top:2px}
.detail-hd .tg{font-size:16px; color:var(--text-2); margin-top:8px}
/* ── 크루 페이지 그룹 구분 (CEO / 크루원 / 스태프) ──
   성격이 다른 세 그룹이라 여백 + 구분선으로 확실히 끊는다. */
.cgroup{padding:4px 0}
.csep{border:0; height:1px; background:var(--line); margin:34px 0}
@media (max-width:720px){ .csep{margin:26px 0} }

/* ── CEO 카드 (크루 페이지 최상단) ──
   상세페이지가 없는 카드다. 사진 + 이력 + 채널 버튼이 전부이고, 카드 전체는 링크가 아니다.
   PC 에서는 「사진 | 본문(신축) | 버튼(우측)」 3단으로 벌려서 내용이 왼쪽에만 몰리지 않게 한다. */
.ceo-card{display:flex; gap:18px; align-items:center; margin:0;
  padding:20px; border-radius:var(--r);
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset)}
.ceo-card .av{position:relative; width:112px; height:112px; flex:0 0 112px; border-radius:50%;
  overflow:hidden; background:rgba(255,255,255,.04)}
.ceo-card .av img{width:100%; height:100%; object-fit:cover}
.ceo-body{min-width:0; flex:1}
.ceo-body h3{margin:0; font-size:24px; font-weight:800; letter-spacing:-.03em;
  display:flex; align-items:center; gap:9px; flex-wrap:wrap}
.ceo-body .tg{font-size:18px; color:var(--text-2); margin:6px 0 0}
.ceo-career{list-style:none; margin:10px 0 0; padding:0}
.ceo-career li{position:relative; padding-left:11px; font-size:17px; color:var(--muted); line-height:1.7}
.ceo-career li::before{content:""; position:absolute; left:0; top:12px;
  width:3px; height:3px; border-radius:50%; background:var(--red-hi)}
.ceo-act{flex:0 0 auto; margin-left:auto; padding-left:8px}
.ceo-act .btn{display:inline-flex; width:auto; white-space:nowrap}
@media (min-width:721px){
  .ceo-card{gap:26px; padding:26px 30px}
  .ceo-card .av{width:132px; height:132px; flex:0 0 132px}
}
@media (max-width:720px){
  .ceo-card{flex-direction:column; align-items:center; text-align:center; gap:14px}
  .ceo-body{width:100%}
  .ceo-body h3{justify-content:center}
  .ceo-career{text-align:left; display:inline-block; margin-top:12px}
  .ceo-act{margin-left:0; padding-left:0; width:100%}
  .ceo-act .btn{width:100%; justify-content:center}
}

.kv{width:100%; border-collapse:collapse; margin:8px 0 0}
.kv th,.kv td{text-align:left; padding:11px 2px; border-top:1px solid var(--line-soft); font-size:16px; vertical-align:top}
.kv th{width:32%; color:var(--muted); font-weight:500; font-size:15px}
.chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.chip{font-size:14px; font-weight:500; color:var(--text-2);
  border:1px solid var(--line); border-radius:999px; padding:4px 11px; background:var(--glass)}
.chip.on{color:#fff; background:var(--red); border-color:var(--red)}
.credit{font-size:13px; color:var(--muted); margin-top:10px; line-height:1.55}
.credit a{color:var(--text-2); text-decoration:underline; text-underline-offset:2px}
.wordbox{display:flex; gap:10px; border-radius:var(--r-sm); padding:14px 16px; margin:4px 0 14px;
  background:var(--glass); border:1px solid var(--line); border-left:3px solid var(--red); box-shadow:var(--inset)}
.wordbox svg{width:16px; height:16px; flex:0 0 16px; margin-top:4px; fill:var(--red); stroke:none}
.wordbox .lb{font-size:13px; font-weight:600; letter-spacing:.12em; color:var(--red-hi)}
.wordbox .tx{font-size:17.5px; line-height:1.6; margin-top:4px; white-space:pre-line}
.wordbox .at{font-size:13px; color:var(--muted); margin-top:6px}

/* ── 버튼 ── */
.btns{display:flex; gap:8px; margin-top:18px; flex-wrap:wrap}
.btn{min-height:48px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center;
  gap:8px; border-radius:14px; font-size:17px; font-weight:600; flex:1 1 auto;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset); color:var(--text);
  transition:background .18s var(--ease)}
.btn:active{background:var(--glass-hi)}
.btn.pri{background:linear-gradient(180deg,#E4173A,#B30E29); border-color:rgba(255,255,255,.16);
  color:#fff; box-shadow:var(--inset), 0 8px 28px -10px rgba(228,23,58,.5)}
.btn.pri:active{filter:brightness(1.08)}
.btn svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round}
.btn[disabled]{opacity:.45; cursor:default}
.btn.wide{width:100%; margin:12px 0 6px}

/* ── 시그 ── */
.searchbar{position:sticky; top:calc(56px + env(safe-area-inset-top)); z-index:30;
  display:flex; align-items:center; gap:9px; margin:0 0 14px; padding:0 14px; min-height:50px;
  border-radius:14px; background:rgba(16,16,22,.72); border:1px solid var(--line);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:var(--inset)}
.searchbar svg{width:18px; height:18px; flex:0 0 18px; stroke:var(--muted); fill:none; stroke-width:1.7}
.searchbar input{flex:1; background:none; border:0; color:var(--text); font-size:18px; min-height:48px}
.searchbar input::placeholder{color:var(--muted)}
.searchbar .clear{width:36px; height:36px; display:none; align-items:center; justify-content:center;
  color:var(--muted); border-radius:10px}
.searchbar.has .clear{display:flex}

.tabs{display:flex; gap:6px; margin:0 0 14px; overflow-x:auto; scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{min-height:42px; padding:0 16px; font-size:16px; font-weight:600; color:var(--text-2);
  white-space:nowrap; border-radius:999px; background:var(--glass); border:1px solid var(--line)}
.tabs button[aria-selected="true"]{color:#fff; background:var(--red); border-color:var(--red)}

.siglist{border-radius:var(--r); overflow:hidden; background:var(--glass);
  border:1px solid var(--line); box-shadow:var(--inset)}
.sig{display:grid; grid-template-columns:54px 1fr auto; gap:10px; align-items:center;
  padding:13px 14px; border-top:1px solid var(--line-soft)}
.sig:first-child{border-top:0}
.tier{font-size:13px; font-weight:800; letter-spacing:.04em; text-align:center; align-self:start;
  border:1px solid var(--line); border-radius:9px; padding:4px 0; color:var(--text-2); margin-top:2px}
.tier.code{font-size:14.5px; letter-spacing:0; font-variant-numeric:tabular-nums}
.tier.t-A{color:var(--red-hi); border-color:rgba(228,23,58,.5)}
.tier.t-S{color:#fff; border-color:rgba(228,23,58,.6); background:rgba(200,16,46,.22)}
.tier.t-SS{color:#fff; border-color:var(--red); background:var(--red)}
.sig .nm{font-size:17.5px; font-weight:600; letter-spacing:-.01em}
.sig .by{font-size:14px; color:var(--red-hi); font-weight:600; margin-top:1px}
.sig .ds{font-size:14.5px; color:var(--text-2); margin-top:3px}
.sig .mu{font-size:13px; color:var(--muted); margin-top:3px}
.sig .right{display:flex; flex-direction:column; align-items:flex-end; gap:7px}
.sig .pr{font-size:17.5px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap}
.sig .ex{font-size:12px; font-weight:600; letter-spacing:.1em; color:var(--red);
  border:1px solid rgba(228,23,58,.5); border-radius:6px; padding:1px 6px}
.sig .acts{display:flex; gap:6px; align-items:center}
.sig .add{min-width:44px; min-height:32px; padding:0 12px; border-radius:9px; font-size:14px; font-weight:700;
  background:var(--glass-hi); border:1px solid var(--line); color:var(--text-2)}
.sig .sfav{width:34px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:9px; background:var(--glass-hi); border:1px solid var(--line)}
.sig .sfav svg{width:16px; height:16px; fill:none; stroke:rgba(255,255,255,.4); stroke-width:1.6}
.sig .sfav[aria-pressed="true"] svg{fill:var(--red); stroke:var(--red)}
.sighint{font-size:14px; color:var(--muted); margin:-4px 0 12px}

/* 시트 (크루원 선택 등) */
.sheet-dim{position:fixed; inset:0; z-index:80; background:rgba(0,0,0,.55); display:none}
.sheet-dim.on{display:block}
.sheet{position:fixed; left:0; right:0; bottom:0; z-index:81; display:none;
  max-height:76vh; overflow:auto; border-radius:22px 22px 0 0; padding:18px 16px calc(20px + env(safe-area-inset-bottom));
  background:rgba(18,16,20,.92); border-top:1px solid var(--line);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px)}
.sheet.on{display:block}
.sheet .grab{width:44px; height:4px; border-radius:2px; background:var(--line); margin:0 auto 14px}
.sheet h3{margin:0 0 4px; font-size:20px; font-weight:800}
.sheet .sub{font-size:15px; color:var(--muted); margin:0 0 14px}
.pickgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.pickgrid button{display:flex; flex-direction:column; align-items:center; gap:7px; padding:12px 6px;
  border-radius:var(--r-sm); background:var(--glass); border:1px solid var(--line)}
.pickgrid button:active{background:var(--glass-hi); border-color:rgba(228,23,58,.5)}
.pickgrid img,.pickgrid .ini{width:52px; height:52px; border-radius:50%; object-fit:cover}
.pickgrid .ini{display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.05);
  font-size:22px; font-weight:800; color:rgba(255,255,255,.18)}
.pickgrid span{font-size:14.5px; font-weight:600; color:var(--text-2)}

/* ── 일정 ── */
.wk{border-radius:var(--r); margin-bottom:10px; overflow:hidden;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset)}
.wk-hd{display:flex; align-items:center; gap:10px; padding:10px 14px;
  background:rgba(255,255,255,.03); border-bottom:1px solid var(--line-soft)}
.wk-hd .n{font-size:13px; color:var(--muted); letter-spacing:.08em; font-variant-numeric:tabular-nums}
.wk-hd .lb{margin-left:auto; font-size:13px; font-weight:600; letter-spacing:.06em;
  border:1px solid var(--line); border-radius:999px; padding:2px 10px; color:var(--text-2)}
.wk-hd .lb.b{color:#fff; background:var(--red); border-color:var(--red)}
.slot{display:flex; align-items:center; gap:12px; padding:12px 14px; border-top:1px solid var(--line-soft)}
.slot:first-of-type{border-top:0}
.slot.next{background:rgba(200,16,46,.10); border-left:3px solid var(--red)}
.slot .dt{font-size:17px; font-weight:600; font-variant-numeric:tabular-nums}
.slot .dw{font-size:15px; color:var(--text-2)}
.slot .tm{margin-left:auto; font-size:15px; color:var(--muted); font-variant-numeric:tabular-nums}
.slot .dd{margin-left:auto; font-size:14px; font-weight:800; color:var(--red-hi); letter-spacing:.04em}

/* ── 후원·공지 ── */
.sup{border-radius:var(--r); padding:16px; margin-top:10px;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset)}
.sup .lb{font-size:14px; font-weight:600; letter-spacing:.1em; color:var(--muted)}
.sup .val{font-size:21px; font-weight:800; margin-top:6px; font-variant-numeric:tabular-nums;
  letter-spacing:-.01em; word-break:break-all}
.sup .ds{font-size:15px; color:var(--text-2); margin-top:6px}
.howto{margin:12px 0 0; padding:0}
.howto li{list-style:none; font-size:16px; color:var(--text-2); padding:7px 0 7px 16px; position:relative}
.howto li::before{content:''; position:absolute; left:0; top:16px; width:6px; height:1px; background:var(--red)}
.nlist{border-radius:var(--r); overflow:hidden; background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset)}
.nitem{padding:14px 16px; border-top:1px solid var(--line-soft)}
.nitem:first-child{border-top:0}
.nitem .d{font-size:13px; color:var(--muted); font-variant-numeric:tabular-nums; display:flex; gap:8px; align-items:center}
.nitem .pin{font-size:12px; font-weight:700; color:#fff; background:var(--red); border-radius:5px; padding:1px 6px}
.nitem .t{font-size:17px; font-weight:600; margin-top:2px}
.nitem .b{font-size:15.5px; color:var(--text-2); margin-top:3px; white-space:pre-line}

/* 페이징 */
.pager{display:flex; align-items:center; justify-content:center; gap:6px; margin-top:14px}
.pager button{min-width:40px; min-height:40px; border-radius:11px; font-size:15.5px; font-weight:600;
  color:var(--text-2); background:var(--glass); border:1px solid var(--line);
  font-variant-numeric:tabular-nums}
.pager button[aria-current="page"]{color:#fff; background:var(--red); border-color:var(--red)}
.pager button[disabled]{opacity:.35}

/* ── 한마디 피드 ── */
.wordfeed{display:flex; flex-direction:column; gap:10px}
.wf{display:flex; gap:12px; padding:14px; align-items:flex-start; border-radius:var(--r);
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--inset);
  transition:background .18s var(--ease)}
.wf:active{background:var(--glass-hi)}
.wf img,.wf .ini{width:46px; height:46px; flex:0 0 46px; border-radius:50%; object-fit:cover}
.wf .ini{display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.04);
  font-size:21px; font-weight:800; color:rgba(255,255,255,.16)}
.wf .nm{font-size:16px; font-weight:700; display:flex; align-items:center; gap:8px}
.wf .tx{font-size:17px; line-height:1.6; margin-top:3px; white-space:pre-line}
.wf .tx svg{width:12px; height:12px; fill:var(--red); stroke:none; margin-right:5px; vertical-align:1px}
.wf .at{font-size:13px; color:var(--muted); margin-top:5px; font-variant-numeric:tabular-nums}

/* ── 제안 게시판 ── */
.ideaform .fld{margin-bottom:16px}
.ideaform label,.fld label{display:block; font-size:14px; font-weight:600; letter-spacing:.08em;
  color:var(--muted); margin-bottom:6px}
.ideaform input[type=text],.ideaform textarea,.fld input,.fld textarea,.fld select{
  width:100%; min-height:48px; padding:13px 14px; border-radius:13px;
  background:rgba(255,255,255,.04); border:1px solid var(--line); color:var(--text); font-size:18px}
.ideaform textarea,.fld textarea{min-height:120px; line-height:1.6; resize:vertical}
.ideaform input::placeholder,.ideaform textarea::placeholder{color:var(--muted)}
.ideaform .cnt{font-size:14px; color:var(--muted); text-align:right; margin-top:5px; font-variant-numeric:tabular-nums}
.ideaform .trap{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.msg{font-size:16px; margin-top:12px; min-height:20px; line-height:1.6}
.msg.ok{color:var(--text)}
.msg.no{color:var(--red-hi)}

/* ── 배너·빈 상태·푸터 ── */
.exbar{border-radius:var(--r-sm); border:1px solid var(--line); border-left:3px solid var(--red-hi);
  background:var(--glass); padding:11px 14px; font-size:15px; color:var(--text-2); margin-bottom:14px; box-shadow:var(--inset)}
.warnbar{border-radius:var(--r-sm); border:1px solid rgba(228,23,58,.45); background:rgba(200,16,46,.10);
  padding:12px 15px; font-size:15.5px; color:#F4D8DD; margin-bottom:14px}
.empty{border:1px dashed var(--line); border-radius:var(--r); padding:34px 16px;
  text-align:center; color:var(--muted); font-size:16px}
.empty b{display:block; color:var(--text-2); font-weight:600; font-size:17px; margin-bottom:6px}
.foot{margin-top:44px; border-top:1px solid var(--line-soft); padding:22px 0 30px;
  font-size:14px; color:var(--muted); line-height:1.75}
.foot p{margin:0 0 6px}
.foot a{color:var(--text-2); text-decoration:underline; text-underline-offset:2px}

/* ── 하단 탭바 ── */
.tabbar{position:fixed; left:0; right:0; bottom:0; z-index:50;
  background:rgba(11,11,16,.78); border-top:1px solid var(--line-soft);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  padding-bottom:env(safe-area-inset-bottom)}
.tabbar-in{display:grid; grid-template-columns:repeat(5,1fr); max-width:560px; margin:0 auto}
.tabbar a{height:var(--tabh); display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:4px; color:var(--muted); font-size:12.5px; font-weight:600; letter-spacing:-.01em;
  transition:color .16s var(--ease); position:relative}
.tabbar a svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round}
.tabbar a[aria-current="page"]{color:var(--red-hi)}
.tabbar a[aria-current="page"]::before{content:''; position:absolute; top:0; left:50%;
  transform:translateX(-50%); width:24px; height:2.5px; border-radius:2px; background:var(--red)}
.tabbar .badge{position:absolute; top:8px; right:calc(50% - 19px); min-width:16px; height:16px;
  border-radius:8px; background:var(--red); color:#fff; font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center; padding:0 4px; font-variant-numeric:tabular-nums}

/* ── 토스트 ── */
.toast{position:fixed; left:50%; transform:translateX(-50%);
  bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 16px); z-index:90;
  padding:11px 18px; border-radius:13px; font-size:16px; font-weight:500;
  background:rgba(24,20,24,.94); border:1px solid var(--line); box-shadow:0 10px 32px -8px rgba(0,0,0,.7);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease)}
.toast.on{opacity:1}

/* ── 데스크톱 ── */
@media (min-width:600px){
  :root{--pad:24px}
  .crew-grid{grid-template-columns:repeat(3,1fr); gap:12px}
  .menu6{grid-template-columns:repeat(6,1fr)}
}
@media (min-width:900px){
  body{padding-bottom:0}
  .tabbar{display:none}
  .topnav{display:flex}
  .crew-grid{grid-template-columns:repeat(4,1fr)}
  .card:hover{background:var(--glass-hi); border-color:rgba(228,23,58,.4)}
  .btn:hover{background:var(--glass-hi)}
  .menu6 a:hover{background:var(--glass-hi)}
  .wf:hover{background:var(--glass-hi)}
  .topnav a:hover{color:var(--text)}
  .searchbar{top:76px}
}
@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms !important; animation-duration:.01ms !important}
}
@media (prefers-reduced-transparency:reduce){
  .glass-blur,.topbar,.tabbar,.searchbar,.sheet,.calcbar,.menu6 a{backdrop-filter:none; -webkit-backdrop-filter:none;
    background:rgba(14,14,20,.97)}
}