/* 캔버스 위에 덧씌우는 화면 다듬기(3차, 2026-09-28). 캔버스 원본은 건드리지 않는다.
   값은 디자인시스템 토큰(tokens/motion.css·colors.css)에서만 가져온다. */
:root { --nc-dur: 240ms; --nc-ease: cubic-bezier(.22,.61,.36,1); }

/* ② (6차, 2026-09-28) 혜택 카드 4:3 덧씌움 제거 — 캔버스가 세로 9:16 영상 칸을 직접 가진다. */

/* ④ 모든 CTA(행동 버튼): 상태 변화 240ms ease-out, 화살표 3px 밀림 */
.nc-cta, [style-hover] {
  transition: background-color var(--nc-dur) var(--nc-ease), color var(--nc-dur) var(--nc-ease),
              border-color var(--nc-dur) var(--nc-ease), transform var(--nc-dur) var(--nc-ease) !important;
}
/* 흰 채움 CTA: 디자인시스템 기본 hover(cream #fffef9)는 흰색과 구분이 안 돼, 민트 zest-300(#c6e8d5)로 바꾼다 */
.nc-cta.nc-solid:hover { background: #c6e8d5 !important; color: #1a1410 !important; }
.nc-arrow { display: inline-block; transition: transform var(--nc-dur) var(--nc-ease); }
a:hover .nc-arrow, button:hover .nc-arrow { transform: translateX(3px); }
button[aria-label="→"]:hover, button[aria-label="↗"]:hover { transform: translateX(3px); }

/* ④ 영상 자리(4차): ▶ 사진 칸에 영상 클립을 깔고, 재생 중엔 ▶를 숨긴다. 움직임 줄이기 설정이면 ▶ 대신 멈춘 첫 프레임만. */
.nc-has-vid > video.nc-vid { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 22%; z-index:0; pointer-events:none; display:block; }
.nc-has-vid > span { z-index:1; }
.nc-has-vid .nc-play { display:none !important; }
/* 4차(10-03): 바로가기 카드의 ▶ 표시가 링크 클릭을 가로막지 않게(가운데를 눌러도 원 게시물로) */
.nc-has-src .nc-play, .nc-has-src .nc-play * { pointer-events:none; }

/* 9차: 영상이 바뀔 때(초대 가입 단계 등) 0.3초 크로스페이드 */
@keyframes nc-fade { from { opacity: 0; } to { opacity: 1; } }
.nc-has-vid > video.nc-vid { animation: nc-fade .3s ease-out; }
@media (prefers-reduced-motion: reduce) { .nc-has-vid > video.nc-vid { animation: none; } }

/* 11차(2026-09-28): 코럴 글래스 구 움직임을 나란랩스 홈페이지(naran-homepage/index.html)와 같은 값으로.
   정본: _회사규칙/브랜드/글래스구-모션.md — 대각 왕복 7초(가로 150·세로 110px, ±6° 기울기) + 상하 부유 3.4초 22px + 하이라이트 회전 5초.
   크기·자리는 나란크루 그대로(감싸는 칸 140px/56px), 색은 코럴 #f37a65.
   키프레임 이름은 nc-orn-*: 디자인시스템 motion.css의 nl-ornament-float(14px·5.4초)와 부딪히지 않게. */
.nc-orn-w{display:block;width:100%;height:100%;pointer-events:none;animation:nc-orn-drift 7s cubic-bezier(.45,0,.35,1) infinite alternate}
@keyframes nc-orn-drift{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(-70px,110px) rotate(6deg)}100%{transform:translate(-150px,40px) rotate(-4deg)}}
.nc-orn{position:relative;display:block;width:100%;height:100%;border-radius:50%;pointer-events:none;z-index:3;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.62) 0%,color-mix(in oklab,#f37a65 46%,transparent) 34%,color-mix(in oklab,#f37a65 16%,transparent) 72%,transparent 100%);-webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);box-shadow:inset 0 8px 14px rgba(255,255,255,.35),0 8px 24px -8px rgba(26,20,16,.38);animation:nc-orn-float 3.4s cubic-bezier(.4,0,.2,1) infinite}
@keyframes nc-orn-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}
.nc-orn::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 26%,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 40%);animation:nc-orn-spin 5s linear infinite}
@keyframes nc-orn-spin{to{transform:rotate(360deg)}}
@media (max-width:900px){.nc-orn-w{animation-name:nc-orn-drift-m}}
@keyframes nc-orn-drift-m{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(-26px,-22px) rotate(6deg)}100%{transform:translate(-60px,-6px) rotate(-4deg)}}
@media (prefers-reduced-motion:reduce){.nc-orn,.nc-orn-w,.nc-orn::before{animation-play-state:paused}}

/* ── 12차: FAQ 주제 목차(넓은 화면 왼쪽 따라옴 / 좁은 화면 위 가로 탭) ── */
.nc-faq-toc{flex:none;width:220px;position:sticky;top:104px;display:flex;flex-direction:column;gap:2px;padding-top:4px}
.nc-faq-toc button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 14px;border-radius:10px;font-size:16px;line-height:1.3;color:rgba(255,255,255,.62);transition:background .25s,color .25s}
.nc-faq-toc button > span[aria-hidden]{font-size:13px;color:rgba(255,255,255,.4);font-variant-numeric:tabular-nums}
.nc-faq-toc button:hover{color:#fff}
.nc-faq-toc button[aria-current="true"]{background:rgba(170,220,191,.12);color:#aadcbf}
.nc-faq-toc button[aria-current="true"] > span[aria-hidden]{color:rgba(170,220,191,.7)}
.nc-faq-toc button:focus-visible{outline:2px solid #aadcbf;outline-offset:2px}
.nc-faq-g{scroll-margin-top:110px}
.nc-faq-g + .nc-faq-g{margin-top:clamp(60px,6vw,80px)}
.nc-faq-gt{margin:0 0 10px;font-family:var(--font-reading,inherit);font-size:14px;font-weight:600;letter-spacing:.02em;color:#aadcbf}
.nc-faq-g:last-child{border-bottom:1px solid rgba(255,255,255,.14)}
@media (max-width:900px){
  .nc-faq-wrap{flex-direction:column;gap:20px !important}
  .nc-faq-toc{width:auto;align-self:stretch;flex-direction:row;overflow-x:auto;gap:8px;top:64px;z-index:5;margin:0 -3.5vw;padding:10px 3.5vw;background:rgba(26,20,16,.92);backdrop-filter:blur(8px);scrollbar-width:none}
  .nc-faq-toc::-webkit-scrollbar{display:none}
  .nc-faq-toc button{flex:none;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.16);font-size:15px;white-space:nowrap}
  .nc-faq-toc button > span[aria-hidden]{display:none}
  .nc-faq-toc button[aria-current="true"]{border-color:rgba(170,220,191,.5)}
  .nc-faq-g{scroll-margin-top:140px}
  .nc-faq-body p{font-size:16px !important}
}

/* ── 12차: 로그인 뒤 화면 — 화면마다 다른 한 가지 ── */
[data-screen-label="받은 제안"],[data-screen-label="마이페이지 — 프로필"],[data-screen-label="계정 설정"],[data-screen-label="마이페이지 — 보상"]{position:relative;isolation:isolate}
.nc-glowband{position:absolute;left:0;right:0;top:0;height:420px;z-index:-1;pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 30%,transparent);mask-image:linear-gradient(to bottom,#000 30%,transparent)}
.nc-glowband::before{content:"";position:absolute;left:-10%;top:-60%;width:70%;height:180%;border-radius:50%;background:radial-gradient(circle,rgba(170,220,191,.16),rgba(170,220,191,0) 65%);filter:blur(60px);animation:nc-glowslide 22s ease-in-out infinite alternate}
.nc-glow-coral::before{background:radial-gradient(circle,rgba(243,122,101,.2),rgba(243,122,101,0) 65%)}
@keyframes nc-glowslide{to{transform:translateX(70%)}}
/* 내 홈: 인사 + 지금 할 일 하나 크게 */
.nc-hi{margin:clamp(8px,2vw,24px) 0 0;font-size:clamp(16px,1.4vw,19px);color:#fff;font-weight:600}
.nc-next{font-size:clamp(34px,4.6vw,64px) !important;line-height:1.05 !important;letter-spacing:-0.03em;max-width:18ch}
/* 받은 초대: 제목 아래 흐르는 얼굴 띠 */
.nc-hband{overflow:hidden;margin:4px 0 8px;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.nc-hband-track{display:flex;gap:11px;width:max-content;animation:nc-hflow 48s linear infinite}
@keyframes nc-hflow{to{transform:translateX(-50%)}}
/* 진행 중: 단계 줄 위로 빛이 지나감 */
.nc-stages{list-style:none;margin:0 0 6px;padding:0 0 16px;display:flex;justify-content:space-between;gap:8px;position:relative;max-width:980px;font-size:14px;color:rgba(255,255,255,.66)}
.nc-stages::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.14)}
.nc-stages::after{content:"";position:absolute;left:0;bottom:-1px;width:22%;height:4px;border-radius:4px;background:linear-gradient(90deg,rgba(170,220,191,0),#aadcbf,rgba(170,220,191,0));animation:nc-stagerun 5.5s ease-in-out infinite}
.nc-stages li{position:relative}
@keyframes nc-stagerun{0%{transform:translateX(-30%);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(450%);opacity:0}}
/* 보상: 큰 숫자 */
.nc-stats{display:flex;flex-wrap:wrap;gap:16px clamp(40px,6vw,96px);margin:4px 0 8px}
.nc-stats div{display:flex;flex-direction:column;gap:10px}
.nc-stats b{font-family:var(--font-display);font-weight:400;font-size:clamp(56px,8vw,112px);line-height:.95;letter-spacing:-0.04em;background:linear-gradient(100deg,#fff 40%,#aadcbf 50%,#fff 60%);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:nc-sheen 6s ease-in-out infinite}
.nc-stats span{font-size:15px;color:rgba(255,255,255,.66);padding-top:10px;border-top:2px solid #aadcbf;align-self:flex-start;min-width:64px}
@keyframes nc-sheen{0%,60%{background-position:100% 0}100%{background-position:0 0}}
/* 빈 상태: 영상·그림 한 칸 + 다음 행동 */
.nc-empty{display:flex;flex-wrap:wrap;align-items:center;gap:24px 40px;margin-top:12px}
.nc-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:14px;background:#fff;color:#1a1410;font-weight:700;font-size:14px;text-decoration:none}
.nc-orb-soft{width:150px;height:150px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.35),rgba(170,220,191,.35) 35%,rgba(170,220,191,0) 70%);filter:blur(2px);animation:nc-float 5s ease-in-out infinite}
@keyframes nc-float{50%{transform:translateY(-12px)}}
/* 프로필: 제목 옆 둥근 영상 */
.nc-titlerow{display:flex;align-items:center;gap:clamp(16px,2vw,28px)}
.nc-avatar{box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.nc-avatar > span{display:none}
.nc-help-vid{padding:24px 0 0 12px}
@media (prefers-reduced-motion: reduce){.nc-glowband::before,.nc-hband-track,.nc-stages::after,.nc-stats b,.nc-orb-soft{animation:none !important}}
/* 받은 초대: 제목 아래 가로로 넓게 자른 영상 3칸(흐르는 띠 대신 — 3편 반복이 보여서 바꿈) */
.nc-wstrip{display:flex;gap:11px;margin:4px 0 8px}
@media (max-width:640px){.nc-wstrip > div:nth-child(3){display:none}}
.nc-hband{-webkit-mask-image:none;mask-image:none}
.nc-hband-track{width:auto;animation:none !important}
.nc-hband-track > div{flex:1 1 0 !important;min-width:0;width:auto !important;aspect-ratio:16/8 !important;background-position:center 30% !important}
.nc-hband-track > div:nth-child(n+4){display:none}
@media (max-width:640px){.nc-hband-track > div:nth-child(3){display:none}}

/* ── 12차 마무리: 다미 판정 고칠 것 ── */
/* FAQ: 목록 끝~마무리 사이·마무리 아래 빈칸 줄이기 */
[data-nc-faq="list"]{padding-bottom:clamp(40px,5vw,64px) !important}
[data-nc-faq="end"]{padding-bottom:clamp(24px,3vw,40px) !important}
/* 내 홈: 큰 할 일 옆 둥근 흰 화살표 버튼 → 글자 화살표(원형 버튼 상투형 제거) */
.nc-next-arrow{flex:none;font-family:var(--font-display);font-size:clamp(34px,4.6vw,64px);line-height:1;color:#fff;transition:transform .3s}
a:hover > .nc-next-arrow{transform:translateX(3px)}
/* 내 홈: 초대(짧음)·오늘의 안내(긺) 두 칸 — 넓은 화면에서 짧은 칸이 따라와 빈 땅이 안 생기게 */
@media (min-width:900px){.nc-home-2col{align-items:start}}
/* 받은 제안: 카드 두 장을 넓게, 카드 높이 줄이고 앞면에 영상 첫 장면 */
.nc-offers-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)) !important;max-width:none !important}
.nc-offers-grid .nc-face:not(.nc-back){aspect-ratio:3/2 !important;position:relative;overflow:hidden}
.nc-offer-thumb{position:absolute !important;right:22px;top:22px;bottom:22px;width:auto;aspect-ratio:9/16;overflow:hidden;border-radius:12px;background-color:#2b201a;background-size:cover;background-position:center 22%;z-index:1}
.nc-offers-grid .nc-face:not(.nc-back) > span:not(.nc-offer-thumb){position:relative;z-index:1;max-width:52%}
/* 받은 초대: 제목과 영상 3칸 사이 숨 돌릴 간격 */
.nc-wstrip,.nc-hband{margin-top:clamp(20px,2.6vw,36px) !important}
/* 받은 초대에도 은은한 빛 띠(민트) */
[data-screen-label="받은 캠페인 초대"]{position:relative;isolation:isolate}
/* 내 홈: 오늘의 안내 카드 영상 칸을 줄여 두 칸 높이 맞춤, 진행 중 앞 간격을 다른 구역과 같게 */
/* 15차: Today's guide는 운영자가 넣는 글 — 영상·사진 없이 큰 세리프 제목·민트 주제 표시 */
.nc-guide-card{min-height:clamp(220px,20vw,280px);align-items:flex-end !important}
.nc-guide-topic{position:relative;align-self:flex-start;border:1px solid rgba(170,220,191,.55);color:#aadcbf;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700;letter-spacing:.02em}
/* 떠오르며 등장(RiseIn 결, 90ms 간격) */
@keyframes nc-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.nc-offers-grid > *,.nc-wstrip > *,.nc-hband-track > *{animation:nc-rise .7s cubic-bezier(.2,.7,.2,1) both}
.nc-offers-grid > :nth-child(2),.nc-wstrip > :nth-child(2),.nc-hband-track > :nth-child(2){animation-delay:.09s}
.nc-offers-grid > :nth-child(3),.nc-wstrip > :nth-child(3),.nc-hband-track > :nth-child(3){animation-delay:.18s}
@media (prefers-reduced-motion: reduce){.nc-offers-grid > *,.nc-wstrip > *,.nc-hband-track > *{animation:none !important}}
/* 12차 마무리 2: 내 홈 두 칸 구역 아래 간격을 다른 구역과 같게, 빛 띠 조금 더 보이게 */
.nc-home-2col{padding-bottom:clamp(8px,1.5vw,24px) !important}
.nc-glowband::before{background:radial-gradient(circle,rgba(170,220,191,.24),rgba(170,220,191,0) 65%)}
.nc-offers-grid{gap:36px !important}

/* 13차(2026-09-28): 첫 화면 혜택 카드 — 영상 빼고 제목이 주인공. 큰 번호(민트, 기울임 없음) */
.nc-ben-n{display:block;font-family:var(--font-display);font-weight:400;font-size:clamp(44px,4.4vw,64px);line-height:.9;letter-spacing:-0.04em;color:#aadcbf;margin-bottom:clamp(8px,1.6vw,28px)}
/* 13차: 캠페인 대표 이미지 = 제품 사진(campaigns.product_images 첫 장). 없으면 모카 그라데이션 + 은은한 민트 빛 + 브랜드·제품명(세리프) */
.nc-prod{position:relative;overflow:hidden;box-sizing:border-box;border-radius:12px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:clamp(16px,2vw,24px);background:radial-gradient(90% 70% at 88% 8%,rgba(170,220,191,.20) 0%,rgba(170,220,191,0) 62%),linear-gradient(160deg,#3b2c25 0%,#2b201a 100%);border:1px solid rgba(255,255,255,.12);text-align:left}
.nc-prod-b{font-family:var(--font-display);font-weight:400;font-size:clamp(18px,1.6vw,22px);line-height:1.1;color:rgba(255,255,255,.72)}
.nc-prod-p{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,2.6vw,38px);line-height:1.02;letter-spacing:-0.02em;color:#fff}
.nc-prod-lg{padding:clamp(22px,3vw,40px) clamp(22px,3vw,40px) clamp(64px,6.5vw,88px)}
.nc-prod-lg .nc-prod-b{font-size:clamp(20px,2vw,28px)}
.nc-prod-lg .nc-prod-p{font-size:clamp(36px,4.4vw,64px)}
.nc-prod-img{border-radius:12px;background-color:#2b201a;background-size:cover;background-position:center}
.nc-prod-tag{position:absolute;left:12px;top:12px;background:rgba(26,20,16,.66);backdrop-filter:blur(10px);border-radius:6px;padding:6px 10px;font-size:12px;font-weight:700}
.nc-offer-thumb.nc-prod-mini{background:radial-gradient(90% 70% at 88% 8%,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 62%),linear-gradient(160deg,#3b2c25 0%,#2b201a 100%) !important;border:1px solid rgba(255,255,255,.12)}

/* ── 14차 (2026-09-28) ── */
/* 0. 첫 화면 혜택 카드: 1·3번 사진 카드(테두리 없음, 아래 어두운 그라데이션 위 제목), 2번은 무사진 글래스 — 디자인시스템 §6 「번갈아」 */
.nc-ben-photo{min-height:clamp(340px,30vw,440px)}
.nc-ben-photo > div{margin-top:auto}
.nc-ben-photo h2{text-shadow:0 1px 18px rgba(26,20,16,.5)}
.nc-ben-photo p{color:rgba(255,255,255,.84) !important}
/* 1. 내 홈 첫 띠: 사진 부채 + 구슬(넓은 화면만), 진행 단계 그림 */
.nc-me-fan{display:none}
@media (min-width:1100px){
  .nc-me-hero{padding-right:calc(3.5vw + clamp(300px,27vw,400px) + 48px) !important}
  .nc-me-fan{display:block;position:absolute;right:3.5vw;top:clamp(20px,3vw,44px);width:clamp(300px,27vw,400px);height:clamp(300px,24vw,360px);pointer-events:none}
  .nc-me-fan > span:not(.nc-me-orb){position:absolute;top:18px;width:44%;aspect-ratio:9/13;border-radius:12px;background-size:cover;background-position:center 25%;box-shadow:0 8px 24px -8px rgba(26,20,16,.38);animation:nc-fan-in .6s cubic-bezier(.2,.7,.2,1) both}
  .nc-me-fan > span:nth-child(1){left:0;transform:rotate(-7deg);animation-delay:0s}
  .nc-me-fan > span:nth-child(2){left:28%;top:0;z-index:2;transform:rotate(2deg);animation-delay:.1s}
  .nc-me-fan > span:nth-child(3){right:0;top:30px;transform:rotate(8deg);animation-delay:.2s}
  .nc-me-orb{position:absolute;right:-12px;bottom:-44px;width:76px;height:76px;z-index:3}
}
@keyframes nc-fan-in{from{translate:0 18px}to{translate:0 0}}
@media (prefers-reduced-motion:reduce){.nc-me-fan > span{animation:none !important}}
.nc-me-inprog{margin-top:clamp(28px,3vw,44px)}
.nc-stage-row{display:flex;flex-direction:column;gap:12px;border-top:1px solid rgba(255,255,255,.16);padding:18px 0;color:#fff;text-decoration:none;font-size:16px}
.nc-stage-row:hover{background:rgba(255,255,255,.03)}
.nc-stage-top{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline}
.nc-stages4{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.nc-stages4::before{content:"";position:absolute;left:6px;right:12%;top:6px;height:1px;background:rgba(255,255,255,.18)}
.nc-st{position:relative;display:flex;flex-direction:column;gap:8px;font-size:13px}
.nc-st i{display:block;width:12px;height:12px;border-radius:50%}
.nc-st b{font-weight:600}
/* 2. 받은 초대 행: 제품 사진 자리(없으면 모카 대체 칸) */
.nc-inv-brand{display:flex;align-items:center;gap:12px;min-width:0}
.nc-prod-row{flex:none;width:44px;height:44px;border-radius:8px;background:radial-gradient(90% 70% at 88% 8%,rgba(170,220,191,.22) 0%,rgba(170,220,191,0) 62%),linear-gradient(160deg,#3b2c25 0%,#2b201a 100%);border:1px solid rgba(255,255,255,.12);background-size:cover;background-position:center}
/* 3. 프로필 사진 */
.nc-av-wrap{display:flex;align-items:center;gap:16px;margin-left:auto}
.nc-av{position:relative;overflow:hidden;width:clamp(72px,7vw,96px);aspect-ratio:1/1;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:radial-gradient(90% 80% at 30% 20%,rgba(170,220,191,.28),rgba(170,220,191,0) 65%),#2b201a;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.18)}
.nc-av-i{font-family:var(--font-display);font-size:clamp(34px,3.4vw,46px);line-height:1;color:#fff}
.nc-av-btns{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.nc-av-up{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:600;font-size:14px;cursor:pointer}
.nc-av-up input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.nc-av-up:focus-within{outline:2px solid #f9a898;outline-offset:2px}
.nc-av-rm{background:none;border:none;padding:0;color:rgba(255,255,255,.66);font-size:14px;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.nc-av-msg{font-size:13px;color:#f9a898}
.nc-av-msg:empty{display:none}
@media (max-width:600px){.nc-titlerow{flex-wrap:wrap}.nc-av-wrap{margin-left:0}}
/* 5. 교육자료 게시판 */
.nc-board{max-width:1100px;display:flex;flex-direction:column}
.nc-board-f{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.nc-board-f button{min-height:40px;padding:0 16px;border-radius:999px;border:none;background:rgba(255,255,255,.07);color:#fff;font-size:15px;font-weight:500;cursor:pointer}
.nc-board-h,.nc-board-row{display:grid;grid-template-columns:2.4fr 1fr 1fr .9fr 1fr;gap:16px;align-items:center;text-align:left}
.nc-board-h{padding:0 0 12px;font-size:13px;font-weight:700;color:rgba(255,255,255,.56)}
.nc-board-row{width:100%;background:none;border:none;border-top:1px solid rgba(255,255,255,.16);padding:18px 0;color:rgba(255,255,255,.7);font:inherit;font-size:15px;cursor:pointer}
.nc-board-row:last-of-type{border-bottom:1px solid rgba(255,255,255,.16)}
.nc-board-row:hover{background:rgba(255,255,255,.03)}
.nc-board-t{font-family:var(--font-display);font-size:22px;line-height:1.15;color:#fff}
@media (max-width:760px){.nc-board-h{display:none}.nc-board-row{grid-template-columns:1fr 1fr;gap:6px 16px}.nc-board-t{grid-column:1/-1}}
.nc-board-d{max-width:760px;display:flex;flex-direction:column;gap:16px}
.nc-board-back{align-self:flex-start;background:none;border:none;padding:0;cursor:pointer}
/* 6. 받은 제안 앞면 사진 */
.nc-face-photo span{position:relative;z-index:1}
/* 7. 계정 설정: 다른 로그인 뒤 화면과 같은 1400 폭·3.5vw 여백, 글줄은 880까지 */
.nc-settings > *:not(.nc-glowband){max-width:880px;width:100%}

/* 15차: 내 홈 첫 띠 부채 = 영상 3편(9:16) */
@media (min-width:900px){.nc-me-fan > span:not(.nc-me-orb){aspect-ratio:9/16 !important;width:38% !important;overflow:hidden;background-color:#2b201a}}
.nc-me-fan > span.nc-has-vid > video.nc-vid{border-radius:inherit}

/* 16차 */
/* 2. 한 구역 한 액센트: 내 홈 첫 띠(코럴 빛·구슬) = 흰 글자, 진행 중(민트 단계 점) = 「See all」 민트 */
.nc-seeall{color:#aadcbf}.nc-seeall:hover{color:#c6e8d5}
/* 3. A43 열 맞춤(17차): 카드를 늘이지 않는다. 짧은 오른쪽 열(Today's guide 제목+카드)을 섹션 세로 가운데에 앉힌다 —
   왼쪽 열의 남는 구간에 있는 상자 밖 글은 In progress 제목 한 줄뿐(구간의 절반 미만)이라 「붙임」이 아니라 「가운데」(디자인시스템 99행) */
@media (min-width:900px){.nc-home-2col{align-items:center !important}}
/* 4. 제품 사진 없는 대체 카드: 16차 4종 변주 삭제 — 캔버스 기본 한 모양(모카 그라데이션 + 브랜드·제품 세리프)만. 사진 공개 필수라 사진이 깨졌을 때만 쓰는 비상용 (사장님 2026-09-29) */
/* 2. 받은 제안: 위 카드가 코럴 빛 → 아래 대체 제품 칸은 민트 대신 흰 빛 */
[data-screen-label="받은 제안"] .nc-prod{background:radial-gradient(90% 70% at 88% 8%,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 62%),linear-gradient(160deg,#3b2c25 0%,#2b201a 100%)}
/* 16차 다미 1회차: 구슬은 영상 카드 모서리에서 띄움 */
@media (min-width:1100px){.nc-me-fan .nc-me-orb{bottom:-76px;right:-20px}}
/* 17차 다미 1회차: 캠페인 카드 사진 바로 밑 7px에 브랜드명이 붙음 → 사진과 글 사이 14px */
.nc-camp-grid .nc-prod{margin-bottom:14px}
/* 18차 다미 2회차: 큰 할 일 옆 64px 단독 화살표가 따로 떠 보임 → 글줄 끝에 붙는 작은 화살표(글줄 크기·아래선 맞춤) */
.nc-next-arrow{font-size:clamp(22px,2.2vw,30px);align-self:flex-end;margin-bottom:.35em;opacity:.8}
a:hover > .nc-next-arrow{opacity:1}

/* 20차: 내 홈 「Campaigns for you」 맞는 캠페인 0건 — 글래스 카드 한 장(문구·버튼은 캔버스 빈 상태 그대로) */
.nc-empty{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;padding:28px 32px;border-radius:14px;background:radial-gradient(120% 160% at 18% 0%,rgba(255,255,255,.11),rgba(255,255,255,.04) 58%,rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.14);animation:nc-empty-in .6s cubic-bezier(.2,.7,.2,1) both;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 16px 40px -12px rgba(0,0,0,.45)}
.nc-empty p{margin:0;max-width:52ch;font-size:16px;line-height:1.5;color:rgba(255,255,255,.78)}
.nc-empty a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:14px;background:#fff;color:#1a1410;font-weight:700;font-size:14px;text-decoration:none}
@keyframes nc-empty-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.nc-empty{animation:none}}
@media (max-width:600px){.nc-empty{padding:22px 20px}}
/* 21차: 로그인 후 내 홈 구슬 잘림 — 구슬(.nc-me-orb, 부채 아래 76px)이 떠다니는 길(아래로 최대 110px, nc-orn-drift)까지
   「내 홈」 섹션(overflow:hidden, 정본 글래스구-모션.md 마크업 조건) 안에 들어오도록 첫 띠 높이를 부채+구슬 길만큼 확보 */
/* 22차: 21차의 첫 띠 높이 늘리기(빈 공간 약 108px)를 되돌림. 대신 넓은 화면에서 「내 홈」 섹션의 세로 방향만 넘침을 보이게 해
   구슬이 정본 모션(글래스구-모션.md: 아래 110px·왼쪽 150px 왕복)을 그대로 하며 다음 구역 위 여백까지 내려가도 잘리지 않게 함.
   가로는 clip으로 계속 잘라 가로 스크롤이 생기지 않음. 구슬 가장 아랫길은 다음 구역 위 여백(72~96px) 안이라 글자와 안 겹침(22차 실측). */
@media (min-width:1100px){section[data-screen-label="내 홈"]{overflow-x:clip !important;overflow-y:visible !important}}
/* 21차: My campaigns 6단계 줄 = 누르는 탭이 아니라 진행 순서 표시(aria-hidden) — 아래 In progress/Past 탭과 헷갈리지 않게 작은 글자·넓은 자간·낮은 대비, 누름 반응 없음 */
/* 25차: 여섯 단계 줄 = 누르면 그 단계의 내 캠페인만(다시 누르면 전체). 21차 이전 크기·대비로 되돌리고 누를 수 있는 모양 */
.nc-stages-btn sc-for{display:contents}
.nc-stg-b{background:none;border:none;margin:0;padding:6px 2px;font:inherit;font-size:14px;color:rgba(255,255,255,.66);cursor:pointer;border-radius:6px;position:relative;transition:color .15s}
.nc-stg-b:hover{color:#fff}
.nc-stg-b:active{transform:translateY(1px);opacity:.8}
.nc-stg-b:focus-visible{outline:2px solid #aadcbf;outline-offset:3px}
.nc-stg-b[aria-pressed="true"]{color:#fff;font-weight:700}
.nc-stg-b[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:4px;border-radius:4px;background:#aadcbf;box-shadow:0 0 12px rgba(170,220,191,.7);z-index:1}
.nc-stages-btn[data-picked="1"]::after{display:none}
.nc-stg-empty{margin:18px 0 0;font-size:15px;color:rgba(255,255,255,.72)}
@media (max-width:640px){.nc-stages-btn{overflow-x:auto;gap:14px;justify-content:flex-start}.nc-stg-b{white-space:nowrap;font-size:13px;min-height:40px}}

/* 37차: 캠페인 화면 개선(Collaboom 비교 추천 3개 + 결정 1 「나」). 모션 240ms ease-out, 움직임 줄이기면 정지. */
/* ① 목록 카드 상태: Apply(지원 가능) / ✓ Applied(지원함, 민트) / Closed(마감, 사진 흑백) */
.nc-camp-card .nc-card-st{display:inline-flex;align-items:center;min-height:26px;padding:0 12px;border-radius:14px;font-size:13px;font-weight:700;line-height:1}
.nc-camp-card[data-st="open"] .nc-card-st{background:#fff;color:#1a1410!important}
.nc-camp-card[data-st="applied"] .nc-card-st{padding:0;color:#aadcbf!important}
.nc-camp-card[data-st="closed"] .nc-card-st{padding:0;color:rgba(255,255,255,.56)!important}
.nc-camp-card[data-st="closed"] .nc-live-img,.nc-camp-card[data-st="closed"] .nc-prod-img{filter:grayscale(1) brightness(.7)}
.nc-camp-card .nc-live-img{transition:transform 240ms ease-out}
.nc-camp-card:hover .nc-live-img{transform:scale(1.03)}
/* ④ 자리 얼마 안 남음 띠 — 서버가 참일 때만 */
.nc-few{display:none;align-items:center;gap:6px;min-height:26px;padding:0 10px;border-radius:6px;background:rgba(26,20,16,.66);backdrop-filter:blur(10px);color:#f9a898;font-size:13px;font-weight:700}
.nc-few::before{content:"";width:6px;height:6px;border-radius:50%;background:#f37a65}
.nc-few-card{display:inline-flex;position:absolute;left:12px;top:12px;z-index:2}
/* ② 상세 맨 위 요약 + 지원 버튼 */
.nc-sum{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.nc-sum-cells{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;width:100%}
.nc-sum-c{display:flex;flex-direction:column;gap:6px;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.28);min-width:0}
.nc-sum-k{font-size:13px;color:rgba(255,255,255,.56)}
.nc-sum-v{font-family:var(--font-display);font-size:22px;line-height:1.2;overflow-wrap:anywhere}
.nc-sum-act{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.nc-sum-go{min-height:52px;min-width:200px;padding:0 28px;border-radius:18px;background:#fff;color:#1a1410;border:none;font-weight:700;font-size:16px;cursor:pointer;transition:transform 240ms ease-out,box-shadow 240ms ease-out}
.nc-sum-go:hover{transform:translateY(-1px);box-shadow:0 8px 24px -8px rgba(170,220,191,.55)}
.nc-sum-go:focus-visible,.nc-guide-open:focus-visible,.nc-copy:focus-visible,.nc-drawer-x:focus-visible{outline:2px solid #aadcbf;outline-offset:3px}
.nc-sum-done{color:#aadcbf;font-weight:700;font-size:16px}
.nc-sum-link{color:#fff;font-size:15px;font-weight:600}
@media (max-width:640px){
  .nc-sum-act{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(26,20,16,.92);backdrop-filter:blur(14px);justify-content:space-between}
  .nc-sum-go{flex:1;min-width:0}
  section[data-screen-label="캠페인 상세"] + section{padding-bottom:96px!important}
  .nc-sum-v{font-size:19px}
}
/* ③ 가이드 서랍 */
.nc-guide-open{text-align:left;min-height:40px;padding:0 16px;border-radius:14px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.28);font-weight:700;font-size:14px;cursor:pointer}
.nc-guide-open:hover{background:rgba(255,255,255,.16)}
.nc-drawer-bg{position:fixed;inset:0;z-index:90;background:rgba(10,8,6,.6);animation:nc-fade 240ms ease-out}
.nc-drawer{position:fixed;top:0;right:0;bottom:0;z-index:91;width:min(440px,100vw);overflow-y:auto;background:#1f1813;border-left:1px solid rgba(255,255,255,.16);padding:24px clamp(16px,3vw,32px) 40px;display:flex;flex-direction:column;gap:14px;color:#fff;animation:nc-slide 240ms ease-out}
.nc-drawer-h{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nc-drawer-h h2{margin:0;font-family:var(--font-display);font-weight:400;font-size:32px;line-height:1.1}
.nc-drawer-x{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:transparent;color:#fff;font-size:22px;cursor:pointer}
.nc-guide-k{font-family:inherit;letter-spacing:0;margin:12px 0 0;font-size:13px;font-weight:700;color:rgba(255,255,255,.56)}
.nc-guide-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.nc-guide-list li{border-top:1px solid rgba(255,255,255,.16)}
.nc-guide-list label{display:flex;gap:12px;align-items:flex-start;padding:14px 0;font-size:16px;line-height:1.45;cursor:pointer}
.nc-guide-list input{accent-color:#aadcbf;width:18px;height:18px;margin:2px 0 0;flex:none}
.nc-guide-list input:checked + *,.nc-guide-list label:has(input:checked){color:rgba(255,255,255,.56)}
.nc-guide-vid{width:100%;max-width:260px;aspect-ratio:9/16;border-radius:12px;background:#2b201a;object-fit:cover}
.nc-guide-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.nc-tag{padding:6px 12px;border-radius:14px;background:rgba(255,255,255,.1);font-size:14px;font-weight:600}
.nc-copy{min-height:36px;padding:0 14px;border-radius:14px;background:#fff;color:#1a1410;border:none;font-weight:700;font-size:14px;cursor:pointer;transition:background 240ms ease-out}
.nc-copy.is-done{background:#aadcbf}
@keyframes nc-slide{from{transform:translateX(100%)}to{transform:none}}
@keyframes nc-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.nc-drawer,.nc-drawer-bg{animation:none}.nc-sum-go,.nc-camp-card .nc-live-img,.nc-copy{transition:none}.nc-camp-card:hover .nc-live-img,.nc-sum-go:hover{transform:none}}
.nc-camp-card div:has(> .nc-card-st),.nc-camp-card div:has(> sc-if > .nc-card-st){align-items:center}

/* 37차 보정: 허용 글리프(→↗×≡↓)에 ✓가 없어 체크 표시는 CSS로 그린다 */
.nc-camp-card[data-st="applied"] .nc-card-st::before,.nc-sum-done::before{content:"";display:inline-block;width:9px;height:5px;margin:0 7px 3px 1px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}

/* 문장 단위 줄바꿈(2026-09-30) — public/c/lines.js 가 문장을 .nc-s 로 감싼다. 점검: node scripts/line-breaks.mjs */
.nc-s{display:block;text-wrap:balance}
.nc-bal{text-wrap:balance!important}
.nc-pre{text-wrap:pretty!important}
/* 캠페인 상세 완성작 영상 줄 + 소제목 자리표시 칩: 소제목 문구가 정해질 때까지 가림. 이 줄을 지우면 다시 보인다(lib/canvas.ts 가 nc-works-hold 를 붙인다). */
.nc-works-hold{display:none !important}

/* 캠페인 상세 「Keep your post up for …」 줄: 무가 시딩은 게시 의무·기한이 없어 가림. 이 줄을 지우고 lib/canvas.ts 의 hidden 을 빼면 다시 보인다. */
.nc-keepup-hold{display:none !important}

/* 10-03 사장님 「영국은 영국식 계좌번호, 나머지는 IBAN + 세금번호는 사업자만」: 지급 정보 칸 전환(public/c/payout.js가 html에 표시를 붙인다) */
html:not([data-nc-uk]) [data-pay="uk"], html[data-nc-uk] [data-pay="iban"], html:not([data-nc-biz]) [data-pay="biz"] { display: none !important; }

/* 2026-10-03 크리에이터 영상 → 원 게시물 바로가기 카드(video.js SRC·캔버스 nc-src) */
.nc-src { display:flex; align-items:flex-end; width:100%; height:100%; padding:8px; box-sizing:border-box; text-decoration:none; color:#fff; border-radius:inherit; }
.nc-src-ov { position:absolute; inset:0; z-index:2; }
.nc-src-l { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 11px/1.3 Pretendard, system-ui, sans-serif; padding:4px 8px; border-radius:999px; background:rgba(26,20,16,.62); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.nc-src:hover .nc-src-l, .nc-src:focus-visible .nc-src-l { background:rgba(26,20,16,.85); }
.nc-has-src > span[aria-hidden="true"] { z-index:1; }

/* 10-03 공개 준비: 약관·개인정보·쿠키 본문(lib/legal.ts) */
.nc-legal{max-width:760px;border-top:1px solid rgba(255,255,255,.16);padding-top:28px;font-size:17px;line-height:1.55;color:rgba(255,255,255,.82)}
.nc-legal h2{margin:40px 0 12px;font-family:var(--font-display);font-weight:400;font-size:clamp(24px,2.6vw,32px);line-height:1.15;letter-spacing:-0.02em;color:#fff}
.nc-legal h2:first-child{margin-top:0}
.nc-legal h3{margin:24px 0 8px;font-size:18px;font-weight:700;color:#fff}
.nc-legal p,.nc-legal ul{margin:0 0 12px}
.nc-legal ul{padding-left:22px}
.nc-legal li{margin:4px 0}
.nc-legal a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.nc-legal code{font-size:.92em;background:rgba(255,255,255,.08);border-radius:4px;padding:1px 5px}
.nc-legal-tw{overflow-x:auto;margin:0 0 16px}
.nc-legal table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}
.nc-legal th,.nc-legal td{text-align:left;vertical-align:top;padding:10px 12px 10px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.nc-legal th{font-weight:700;color:#fff}
/* 10-03 화면점검(다미) 반영: 제목 번호가 따로 떨어지지 않게, 소제목은 본문 글꼴로 키우고, 표 뒤 소제목 위 간격을 넓힌다 */
.nc-legal h2{display:block;margin:56px 0 20px;text-wrap:pretty}
.nc-legal h2:first-child{margin-top:0}
.nc-legal h3{font-family:'Pretendard Variable',Pretendard,system-ui,sans-serif;font-size:19px;letter-spacing:0;line-height:1.35;margin:40px 0 14px}
.nc-legal h2 + h3{margin-top:8px}

/* 10-13 사장님 피드백 3번: 캠페인 상세에서 제품 이미지·제품 설명·지원 폼을 감춘 뒤 남는 빈칸을 줄인다.
   감춘 칸은 lib/canvas.ts 가 hidden data-nc-off 로 표시한다 — 다시 보이게 하면 이 규칙도 자연히 맞물린다. */
section[data-screen-label="캠페인 상세"] + section{padding-top:clamp(24px,3vw,40px)}
section[data-screen-label="캠페인 상세"] + section > div:first-child{border-bottom:none}

/* 2026-10-15 영상 위 틱톡 바로가기 버튼(영상은 그대로 재생, 버튼만 오른쪽 아래 모서리 — video.js SRC·캔버스 nc-srcb) */
.nc-srcb { position:absolute; right:8px; bottom:8px; z-index:5; display:inline-flex; align-items:center; min-height:26px; padding:0 10px; border-radius:999px; background:rgba(26,20,16,.62); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); color:#fff; font:600 11px/1 Pretendard, system-ui, sans-serif; text-decoration:none; white-space:nowrap; }
/* 첫 화면 글 상자(z-index 5, 600px)가 뒤쪽 영상 칸 버튼을 덮어 클릭이 막혔다 → 글 상자 빈 곳은 클릭을 통과시키고 버튼·링크·입력만 클릭 가능 */
div:has(> h1.nc-bal) { pointer-events:none; }
div:has(> h1.nc-bal) :is(a, button, input, select, textarea, label, [role="button"]) { pointer-events:auto; }
.nc-srcb:hover, .nc-srcb:focus-visible { background:rgba(26,20,16,.88); }