/* ─────────────────────────────────────────────────────────────
   라원쿠지 브랜드 v2 (2026-10-21) — 새 로고(캔디 티켓)에 맞춘 밝은 화면
   원칙: 귀여운 건 로고·종이·당첨 순간에만. 나머지는 흰 바탕 · 얇은 선 · 먹색 글씨.
         빨강(#DC2A33)은 돈이 나가는 버튼에만, 노랑은 헤더 밑 띠·강조 배지에만.
   실리는 조건: 관리자 설정에서 켜거나(손님 전체) 관리자 미리보기 쿠지(이 브라우저만).
   순서: app.css → renewal.css → brand-remap.css(자동 생성) → 이 파일.
   이 파일과 brand-remap.css 두 줄만 빠지면 예전 먹빛 화면으로 돌아간다.
   ───────────────────────────────────────────────────────────── */
:root{
  --paper:#FFFDF8; --paper-2:#FBF6EA; --surface:#FFFFFF; --surface-2:#FBF6EA; --line:#ECE4D3; --line-strong:#DCD0B8;
  --ink:#1E1915; --ink-2:#4A3F36; --muted:#8B7F72; --muted-2:#A3968A;
  --red:#DC2A33; --red-2:#B81E27; --red-soft:#FDECEC; --red-glow:rgba(220,42,51,.16);
  --gold:#E9AE2E; --gold-2:#9A6800; --gold-soft:#FFF3C4;
  --black:#1E1915; --black-2:#2A221C;
  --ok:#1F7A4D; --ok-soft:#E6F4EC; --warn:#9A6300; --warn-soft:#FCF1D8; --danger:#B3261E; --danger-soft:#FCEAE8;
  --code:#F4EEDF; --shadow:0 4px 14px rgba(30,25,21,.07);
  --radius:12px; --radius-sm:9px;
  /* 종이(티켓) — 로고 속 티켓처럼 따뜻한 흰색 */
  --tk-paper:#FFFBF0; --tk-paper-2:#F3EAD6; --tk-ink:#1E1915; --tk-mute:#7A6E62; --tk-line:#DCCFB2;
  --brand-y:#FCE073; --brand-y-soft:#FFF3C4; --brand-y-line:#F1DE97;
}
body{background:var(--paper);color:var(--ink)}
::selection{background:rgba(252,224,115,.55)}

/* ── 무대: 뜯기 · 상품 팝업 · 용사 추첨 · 레이드는 어둡게 둔다 (초콜릿 먹빛 + 로고 노랑) ── */
.rvscreen,.prizepop,.yjscreen,.yj-raid,.yj-boss-poster,.om-art{
  --paper:#15100D; --paper-2:#1E1814; --surface:#1E1814; --surface-2:#27201A; --line:#3A2F26; --line-strong:#4A3D32;
  --ink:#F5EEDF; --ink-2:#DCCFBC; --muted:#AE9F8C; --muted-2:#857767;
  --gold:#E9AE2E; --gold-2:#FCE073; --gold-soft:rgba(252,224,115,.14);
  --code:#27201A; --shadow:0 12px 34px rgba(0,0,0,.45);
}
.rvscreen{background:
  radial-gradient(60% 45% at 50% 0%,rgba(220,42,51,.24),rgba(220,42,51,0) 70%),
  radial-gradient(50% 40% at 50% 100%,rgba(252,224,115,.14),rgba(252,224,115,0) 70%),#140F0C}
.prizepop{background:radial-gradient(60% 60% at 50% 45%,rgba(252,224,115,.26),rgba(20,15,12,.93) 75%)}
.rvscreen .btn,.prizepop .btn,.yjscreen .btn{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink)}
.rvscreen .btn-primary,.prizepop .btn-primary,.yjscreen .btn-primary{background:var(--red);border-color:var(--red);color:#fff}

/* ── 헤더: 흰 바탕 + 로고 + 밑 노란 띠 하나 ── */
.topbar{background:#fff;border-bottom:1px solid var(--line);box-shadow:inset 0 -3px 0 var(--brand-y)}
.brand-v2-logo{display:flex;align-items:center;gap:.7rem;color:var(--ink)}
.brand-v2-logo img{height:52px;width:auto;display:block}
.brand-v2-logo .brand-tag{font-family:var(--sans);font-size:.72rem;font-weight:600;color:var(--muted);letter-spacing:.02em;white-space:nowrap}
.account .lnk{color:var(--ink-2)}
.account .lnk:hover{color:var(--ink)}
.admin-lnk{color:var(--red)!important}
.tabs{background:#fff;border-bottom:1px solid var(--line)}
.tabs a{color:var(--muted);font-weight:700}
.tabs a:hover{color:var(--ink)}
.tabs a.on{color:var(--ink);border-color:var(--red)}
.wal{background:var(--surface-2);border:1px solid var(--line);color:var(--ink)}
.wal .wal-k{color:var(--muted)}
.wal.cash b{color:var(--ink)}
.wal.goods b{color:var(--gold-2)}
@media (max-width:640px){
  .brand-v2-logo img{height:42px}
  .brand-v2-logo .brand-tag{display:none}
}

/* ── 푸터: 아래쪽만 먹색으로 무게 ── */
.footer{background:#1E1915;border-top:0;color:#CFC5B8;
  --ink:#F5EEDF; --ink-2:#DCCFBC; --muted:#B0A393; --muted-2:#8E8173; --line:#3A2F26; --line-strong:#4A3D32}
.footer-links a{color:#F5EEDF}
.footer-links a:hover{color:var(--brand-y)}
.footer b{color:#F5EEDF}
.footer .biz-check{color:var(--brand-y)}

/* ── 공통: 평평하고 단정하게 ── */
.btn{background:#fff;border-color:var(--line-strong);color:var(--ink);box-shadow:none}
.btn:hover{border-color:var(--ink-2);box-shadow:none}
.btn-primary,.btn-primary:hover{background:var(--red);border-color:var(--red);color:#fff;box-shadow:none}
.btn-primary:hover{background:var(--red-2);border-color:var(--red-2)}
.btn-gold{background:var(--brand-y);border-color:var(--brand-y-line);color:var(--ink);text-shadow:none}
.btn-gold:hover{background:#F8D658}
.card,.set-card,.modal,.tablewrap{box-shadow:none}
.card{border-color:var(--line)}
.set-card{border-radius:12px;border-color:var(--line)}
.set-card:hover{border-color:var(--line-strong);box-shadow:0 6px 20px rgba(30,25,21,.08)}
.modal{border-color:var(--line);box-shadow:0 24px 60px rgba(30,25,21,.18)}
.eyebrow{color:var(--red)}.eyebrow::before{background:var(--red)}
.pill{background:var(--brand-y);color:var(--ink)}
.badge.soldout{background:var(--surface-2);color:var(--muted)}
.badge.brand{background:var(--red-soft);color:var(--red-2)}
.toast{background:#1E1915;color:#F5EEDF;border-color:#1E1915}
.alert{background:var(--surface-2);border-color:var(--line)}
.consent{background:var(--brand-y-soft);border-color:var(--brand-y-line)}
.fchip.on{background:var(--ink);border-color:var(--ink);color:#fff}
a.chip.on{color:#fff}
.admin-nav a.on,.admin-nav a:hover{color:#fff}
.kc-circle{background:var(--ink);color:#fff}
.set-meta b,.set-strip small b,.lf .g,.lf .g.last{color:var(--gold-2)}
.legend .mine::before{background:var(--brand-y);border-color:var(--gold)}
.q-list li.me{background:var(--brand-y-soft)}

/* ── 먹색 블록: 홈 배너 · 차례 상자 · 안내 칩처럼 일부러 어둡게 둔 곳은 금색 글씨를 로고 노랑으로 ── */
.khero,.q-eta,.kc-poster,.kc-queue,.emptycard .ec-ic,.tb-ic,.s4 .s4n,.vc-code,.pb-ball,.btn-dark,.toast{--gold-2:#FCE073;--gold:#E9AE2E}
.khero{border-color:#1E1915;box-shadow:0 10px 30px rgba(30,25,21,.16)}
.kh-dot.on{background:var(--brand-y)}

/* ── 종이 고르기 판 ── */
.pickroom{background:var(--paper)}
.pr-head{background:#fff;box-shadow:inset 0 -3px 0 var(--brand-y);color:var(--ink)}
.pr-tab.on{background:var(--ink);border-color:var(--ink);color:#fff}
.pr-tab.on small{color:var(--brand-y)}
.pr-amount{color:var(--ink)}
.ticket{background:var(--tk-paper);border:1px solid var(--tk-line);box-shadow:inset 0 -2px 0 rgba(30,25,21,.05)}
.ticket:hover{box-shadow:0 6px 16px rgba(30,25,21,.12),0 0 0 2px var(--brand-y)}
.ticket.mine{background:var(--brand-y);color:var(--ink);border-color:var(--gold);box-shadow:0 0 0 2px rgba(233,174,46,.45)}
.ticket.hold{background:rgba(47,111,208,.08);color:#2F6FD0;border-color:rgba(47,111,208,.35)}
.legend span::before{background:var(--tk-paper);border-color:var(--tk-line)}
.legend .hold::before{background:rgba(47,111,208,.25);border-color:rgba(47,111,208,.45)}

/* ── 등급표 포스터 ── */
.poster{box-shadow:none;border:1px solid var(--line)}
.pz{border-color:var(--line)}
.pz:hover{box-shadow:0 8px 20px rgba(30,25,21,.10)}
.pz.last-one{background:var(--brand-y-soft);border-color:var(--gold)}
.pz .g.last,.om-art .g.last,.prizepop .gb.last{background:var(--brand-y);color:var(--ink)}

/* 접근성: 노랑 위 흰 글씨 금지 — 노랑 바탕은 전부 먹색 글씨 */
.badge.yj-done{background:var(--brand-y);border-color:var(--gold);color:var(--ink)}
.wal.goods{background:var(--brand-y-soft);border-color:var(--brand-y-line)}
.wal.cash{background:#fff;border-color:var(--line-strong)}

/* ── 가독성 (2026-10-21 PC 확인: 글씨가 작고 가늘어 안 보임) ──
   밝은 바탕에서는 먹빛 때보다 얇은 글씨가 훨씬 흐려 보인다. 기본 굵기를 올리고, 흐린 글씨를 진하게,
   가는 고정폭 글꼴(IBM Plex Mono)은 Pretendard 숫자 고정폭으로 바꾼다. */
:root{--muted:#6B6054;--muted-2:#857869;--mono:'Pretendard Variable',Pretendard,'Apple SD Gothic Neo','Malgun Gothic',system-ui,sans-serif}
body{font-weight:500;font-variant-numeric:tabular-nums}
.small{font-size:.88rem}
b,strong{font-weight:800}
.brand-v2-logo .brand-tag{font-size:.8rem;font-weight:700;color:var(--ink-2)}
.account{font-size:.92rem}
.account .lnk{font-weight:700}
.tabs a{font-size:1rem;font-weight:800}
.wal{font-size:.9rem}.wal b{font-weight:800}.wal .wal-k{font-size:.74rem;font-weight:800}
.set-title{font-size:1.02rem;font-weight:800}
.set-meta{color:var(--ink-2);font-weight:700}
.set-meta b{font-size:1.08rem;font-weight:900}
.set-price{font-weight:900}
.set-strip small{font-size:.7rem;font-weight:700;color:var(--ink-2)}
.set-thumb .wait{font-size:.78rem;font-weight:800;color:var(--ink)}
.livefeed .lf-h{font-size:.92rem;font-weight:800;color:var(--ink)}
.livefeed .lf-h .stats{font-size:.86rem;font-weight:700;color:var(--ink-2)}
.lf .g{font-size:.8rem;font-weight:900}
.lf .n{font-size:.86rem;font-weight:700}
.lf .w{font-size:.74rem;font-weight:600;color:var(--muted)}
.kh-live span{font-size:.82rem;font-weight:700}
.kh-series{font-size:.8rem;font-weight:800}
.kh-gauge-txt{font-size:.95rem;font-weight:700}
.kh-prize b{font-size:.86rem;font-weight:800}.kh-prize small{font-size:.76rem;font-weight:600}
.kh-fair{font-size:.86rem;font-weight:700}
.fchip{font-weight:800}
.footer{font-size:.84rem}.footer-inline b{font-weight:800}.footer-inline i{font-weight:600}
.badge{font-weight:800}

/* ── 모바일 헤더: 로고가 커져 '로그아웃' 이 밀려났다 → 로고를 줄이고 간격을 좁힌다 ── */
@media (max-width:640px){
  .brand-v2-logo{flex:none;gap:0}
  .brand-v2-logo img{height:34px}
  .account{gap:.15rem;font-size:.8rem;min-width:0}
  .account .lnk{padding:.3rem .32rem}
  .wal{font-size:.78rem;padding-left:.4rem;padding-right:.4rem;gap:.2rem}
  .wal .wal-k{font-size:.66rem}
  .tabs a{font-size:.92rem}
}
@media (max-width:400px){
  /* 관리자는 '관리자' 링크까지 한 줄에 들어가야 해서 지갑 이름표를 뗀다. 손님은 이름표를 남긴다 */
  .account:has(.admin-lnk) .wal .wal-k{display:none}
  .wal i{display:none}
  .kakao-btn{padding:.34rem .45rem}
}

/* ── 뜯는 종이 = 로고 속 티켓 ──
   크림 종이 + 양 끝 빨간 꼭지(톱니는 기존 절취선 홈이 만든다) + 안쪽 빨간 점선 + 가운데 별.
   잡는 탭은 빨간 꼭지 위에 흰 테두리로. 구조(HTML)는 그대로 두고 색·무늬만 바꾼다. */
.rv-tk{background:var(--tk-paper);box-shadow:0 26px 60px rgba(0,0,0,.6)}
.rv-tk .cv{background:
  linear-gradient(90deg,var(--red) 0 46px,transparent 46px calc(100% - 46px),var(--red) calc(100% - 46px)),
  #FFFBF0}
.rv-tk .cv::before{content:"";position:absolute;top:8px;bottom:8px;left:56px;right:56px;border:2px dashed rgba(220,42,51,.45);border-radius:8px;pointer-events:none}
.rv-tk .cv .hd{padding:.95rem 4.6rem .3rem;color:var(--tk-mute);font-weight:700}
.rv-tk .cv .hd b{color:var(--tk-ink);font-weight:900}
.rv-tk .cv .band{background:none;color:var(--tk-ink);padding:.2rem 4.4rem .1rem;font-size:.9rem;font-weight:900;letter-spacing:-.01em}
.rv-tk .cv .band small{font-family:var(--sans);font-weight:900;background:var(--red);color:#fff;border-radius:999px;padding:.18rem .6rem;font-size:.78rem;opacity:1}
.rv-tk .cv .num{position:relative;color:var(--tk-ink);font-weight:900}
.rv-tk .cv .num::before{content:"★";position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);font-size:1.9em;color:rgba(220,42,51,.10);z-index:0}
.rv-tk .cv .num small{color:var(--tk-mute);font-weight:800;position:relative}
.rv-tk .cv .ft{border-top:0;margin:0 3.9rem;padding:.3rem .4rem .8rem;color:var(--tk-mute);font-weight:700}
.rv-tk .cv .tab{border-color:#fff;background:rgba(255,255,255,.14)}
.rv-tk .cv .tab i{background:#fff}
.rv-tk .cv .tab.l{left:.45rem}.rv-tk .cv .tab.r{right:.45rem}
.rv-tk .cv:hover .tab,.rv-tk .cv.dragging .tab{background:rgba(255,255,255,.28);border-color:#fff}
.rv-tk .cv.dragging .tab i{background:#fff}
.rv-tk .fringe{background:#F3EAD6}
.rv-tk .in{background:#FFFBF0}
.rv-tk .in .seal{color:rgba(220,42,51,.10);background:repeating-linear-gradient(-35deg,transparent 0 22px,rgba(220,42,51,.035) 22px 24px)}
.rv-tk .in .seal i{color:rgba(30,25,21,.32)}
.rv-tk .in .g{color:var(--red)}
.rv-tk .in .no,.rv-tk .in .winno{font-weight:800}
@media (max-width:640px){
  .rv-tk .cv{background:linear-gradient(90deg,var(--red) 0 34px,transparent 34px calc(100% - 34px),var(--red) calc(100% - 34px)),#FFFBF0}
  .rv-tk .cv::before{top:6px;bottom:6px;left:41px;right:41px}
  .rv-tk .cv .hd{padding:.62rem 3.1rem .2rem;font-size:.66rem}
  .rv-tk .cv .band{padding:.15rem 3rem 0;font-size:.74rem}
  .rv-tk .cv .band small{font-size:.66rem;padding:.12rem .45rem}
  .rv-tk .cv .ft{margin:0 2.8rem;padding-bottom:.55rem;font-size:.58rem}
  .rv-tk .cv .tab.l{left:.32rem}.rv-tk .cv .tab.r{right:.32rem}
}
/* 뜯기 화면 글씨도 굵게 */
.rv-title{font-weight:900}
.rv-sub,.rv-help{font-weight:700}
.rv-fan .fc .pct{font-weight:900}
.rv-fan .fc .cnt{font-weight:700}

/* ── 탭 정리: '내 기록' 은 닉네임(PC)·더보기(모바일)로 ── */
.tabs{position:relative}
.tab-more{display:none;align-items:center;gap:.25rem;margin-left:auto;padding:0 .8rem;background:none;border:0;border-bottom:2px solid transparent;
  font:inherit;font-size:.92rem;font-weight:800;color:var(--muted);cursor:pointer;white-space:nowrap}
.tab-more::after{content:"";width:.42rem;height:.42rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:.15rem}
.tab-more.open::after{transform:rotate(-135deg) translateY(-1px)}
.tab-more.on,.tab-more.open{color:var(--ink)}
.tab-more.on{border-bottom-color:var(--red)}
.tab-more .dot,.more-menu .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-left:.25rem;vertical-align:.35em}
.more-menu{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 14px 30px rgba(30,25,21,.12);z-index:5}
.more-in{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding:.8rem 1rem 1rem}
.more-menu a{display:flex;flex-direction:column;gap:.1rem;padding:.7rem .85rem;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.more-menu a b{font-size:.95rem;font-weight:800;color:var(--ink)}
.more-menu a small{font-size:.74rem;font-weight:600;color:var(--muted)}
.more-menu a:active{background:var(--surface-2)}
.more-menu a.kk{background:#FEE500;border-color:#FEE500}.more-menu a.kk small{color:#4a4400}
@media (max-width:640px){
  /* 탭이 넘쳐 옆으로 밀려도 '더보기' 는 늘 오른쪽 끝에 보이게 */
  .tab-more{display:inline-flex;position:sticky;right:0;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 18%);padding-left:1.1rem}
  .tabs a{padding:0 .7rem}
}

/* ── 뜯는 종이 v2 (전쿠 실제 뽑기 화면 참고, 2026-10-21) ──
   겉장: 판 그림 한 장 + 오른쪽 아래 작은 로고 + 왼쪽 ▶ 힌트. 글씨 없음.
   안쪽: 아주 큰 당첨번호 — 찢는 만큼 보인다. 위·아래 빨간 띠. 등급·상품명은 다 찢은 뒤에 떠오른다.
   번호 자리 표시 줄(당첨번호 ? ?)은 종이 안 숫자가 대신하므로 숨긴다. */
.rv-digits{display:none}
.rv-tk[data-v="2"]{aspect-ratio:1.55/1;background:#FFFBF0}
.rv-tk[data-v="2"] .cv{background:#FFFBF0}
.rv-tk[data-v="2"] .cv::before{display:none}
.rv-tk[data-v="2"] .art{position:absolute;inset:0;overflow:hidden;background:#1E1915}
.rv-tk[data-v="2"] .art img:not(.mark){width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.rv-tk[data-v="2"] .art::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 6px #FFFBF0,inset 0 0 0 8px rgba(220,42,51,.55);pointer-events:none}
.rv-tk[data-v="2"] .art .mark{position:absolute;right:14px;bottom:12px;height:46px;width:auto;filter:drop-shadow(0 3px 6px rgba(0,0,0,.45));pointer-events:none}
.rv-tk[data-v="2"] .art.none{background:repeating-linear-gradient(-35deg,#FFF3C4 0 18px,#FFFBF0 18px 36px)}
.rv-tk[data-v="2"] .art.none .mark{position:absolute;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);height:58%;filter:none}
.rv-tk[data-v="2"] .go{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;
  display:grid;place-items:center;font-size:1.05rem;box-shadow:0 6px 16px rgba(0,0,0,.4);animation:goNudge 1.2s ease-in-out infinite;pointer-events:none;z-index:2}
@keyframes goNudge{0%,100%{transform:translate(0,-50%)}50%{transform:translate(8px,-50%)}}
.rv-tk[data-v="2"] .cv.dragging .go{display:none}
.rv-tk[data-v="2"] .cv .tab{opacity:0}
/* 안쪽 */
.rv-tk[data-v="2"] .in{background:
  linear-gradient(180deg,var(--red) 0 14%,transparent 14% 86%,var(--red) 86%),#FFFBF0;justify-content:center;gap:.1rem}
.rv-tk[data-v="2"] .in .bigno{display:flex;flex-direction:column;align-items:center;font-weight:900;line-height:.92;letter-spacing:-.02em;color:#1E1915;
  font-size:clamp(4.4rem,17vw,8.4rem);font-variant-numeric:tabular-nums;transition:transform .35s ease .1s}
.rv-tk[data-v="2"] .in .bigno i{font-style:normal;font-size:.8rem;font-weight:800;letter-spacing:.2em;color:var(--tk-mute);margin-bottom:.35rem}
.rv-tk[data-v="2"].open .in .bigno{transform:scale(.62) translateY(-18%)}
.rv-tk[data-v="2"] .in .g{font-size:2.6rem;margin-top:-.6rem}
.rv-tk[data-v="2"] .in .nm{font-size:.95rem;font-weight:800}
.rv-tk[data-v="2"] .in .seal{background:none;color:rgba(220,42,51,.14)}
@media (max-width:640px){
  .rv-tk[data-v="2"] .art .mark{height:32px;right:9px;bottom:8px}
  .rv-tk[data-v="2"] .go{width:34px;height:34px;left:9px;font-size:.85rem}
  .rv-tk[data-v="2"] .in .bigno{font-size:clamp(3.6rem,19vw,5.4rem)}
  .rv-tk[data-v="2"] .in .g{font-size:1.9rem}
  .rv-tk[data-v="2"] .in .nm{font-size:.8rem}
}
/* 당첨 팝업: 큰 "당첨!" */
.prizepop .eb{font-family:var(--sans);font-size:1.9rem;font-weight:900;letter-spacing:-.02em;color:var(--brand-y);text-shadow:0 4px 18px rgba(252,224,115,.35)}
.prizepop .pp.top .eb{font-size:2.1rem}
.prizepop .no{font-weight:700}
.rv-tk[data-v="2"] .in .g small{vertical-align:baseline;font-size:.5em;margin-left:.08em}
.rv-fan .fc .pct.nums{font-size:.8rem;font-weight:900;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 무대 안 글씨색: 토큰만 바꾸면 body 에서 물려받은 먹색이 그대로 남는다 — 상품 팝업 이름이 안 보였다 */
.rvscreen,.prizepop,.yjscreen,.yj-raid,.yj-boss-poster,.om-art{color:var(--ink)}
.prizepop h3{color:var(--ink)}

/* ── 뜯기 연출 v3: 후보 피라미드 · 교체 · 모임 · 떨림 · 숫자 불 (전쿠 프레임 분석 반영) ── */
.rv-fan-wrap{overflow:visible;min-height:0}
.rv-fan.pyr{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:0;width:auto;margin:0 auto;padding:0;transition:opacity .1s,filter .1s}
.rv-fan.pyr .pr{display:flex;justify-content:center;gap:8px}
.rv-fan.pyr .pc{position:relative;width:96px;margin:0;padding:4px 4px 5px;border-radius:10px;background:#fff;border:2px solid #E5DECF;color:var(--tk-ink);text-align:center;box-shadow:0 12px 30px rgba(0,0,0,.55);
  animation:pcIn .32s cubic-bezier(.2,.9,.3,1.25) both;animation-delay:var(--d,0ms)}
.rv-fan.pyr .r2 .pc{width:88px}
.rv-fan.pyr .pc .pct.nums{display:block;margin-top:.25rem;font-size:.74rem}
.rv-fan.pyr .pc .g{font-size:.66rem}
@keyframes pcIn{0%{opacity:0;transform:translateY(-18px) scale(.7) !important;filter:blur(6px)}100%{opacity:1;transform:none;filter:none}}
/* 자리 하나가 더 보이면: 지금 카드가 0.1초 만에 흐려지며 빠진다 */
.rv-fan.pyr.out .pc{animation:pcOut .11s ease-in both}
@keyframes pcOut{to{opacity:0;transform:scale(.85);filter:blur(5px)}}
/* 후보가 하나 남으면: 가운데로 빨려 들며 모인다 */
.rv-fan.pyr.gather .pr{gap:0}
.rv-fan.pyr.gather .pc{animation:pcGather .17s ease-in both}
@keyframes pcGather{to{opacity:0;transform:scale(.5);filter:blur(6px)}}
.rv-fan.pyr.one .pc{width:124px;animation:pcOne .36s cubic-bezier(.2,.9,.3,1.3) both;border-color:var(--gold);box-shadow:0 0 0 3px rgba(252,224,115,.5),0 0 34px 8px rgba(252,224,115,.3),0 16px 40px rgba(0,0,0,.6)}
@keyframes pcOne{0%{opacity:0;transform:scale(.6);filter:blur(5px)}60%{opacity:1;transform:scale(1.12)}100%{transform:none}}
.rv-fan.pyr.one .pc .pct.nums{font-size:.86rem}
/* 카드가 나오면 종이는 살짝 작아지며 내려간다 (위에 자리를 만든다) */
/* 후보 자리는 처음부터 비워 둔다 — 카드가 나타날 때 종이가 밀려 내려가면 끄는 중에 끊겨 보였다 */
.rv-fan-wrap:has(.rv-fan.pyr){padding:10px 0 6px;flex:none}   /* 화면이 낮으면 줄어들어 카드가 종이를 덮었다 */
.rv-fan.pyr{min-height:282px;justify-content:flex-end}
/* 정답이 정해진 직후 종이가 좌우로 떤다 (마지막 자리 직전의 긴장) */
.rv-tk.shake{animation:tkShake .44s linear both}
@keyframes tkShake{0%,100%{transform:rotate(0)}12%{transform:rotate(-2.6deg) translateX(-3px)}25%{transform:rotate(2.4deg) translateX(3px)}38%{transform:rotate(-2deg) translateX(-2px)}52%{transform:rotate(1.8deg) translateX(2px)}66%{transform:rotate(-1.2deg)}80%{transform:rotate(.8deg)}}
/* 열리면 숫자에 불이 들어온다 */
.rv-tk[data-v="2"].open .in .bigno{transform:scale(.82) translateY(-10%)}
.rv-tk[data-v="2"].glow .in .bigno .ds{color:var(--red);-webkit-text-stroke:2px #1E1915;paint-order:stroke fill;
  text-shadow:0 0 10px rgba(252,224,115,1),0 0 26px rgba(252,224,115,.9),0 0 48px rgba(233,174,46,.7);animation:noGlow .55s ease-in-out infinite alternate}
@keyframes noGlow{from{transform:scale(1)}to{transform:scale(1.05)}}
.rv-tk[data-v="2"].glow{box-shadow:0 0 0 3px rgba(252,224,115,.85),0 0 46px 12px rgba(252,224,115,.45),0 26px 60px rgba(0,0,0,.6)}
.rv-tk[data-v="2"] .in .bigno .ds{display:inline-flex}
/* 당첨 팝업: 왕관 · 당첨번호 알약 · 상품 사진 뒤 금색 원이 퍼진다 · 카드가 둥둥 */
.prizepop .eb{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.prizepop .eb .crown{font-size:2.2rem;line-height:1;animation:crownIn .6s cubic-bezier(.2,.9,.3,1.4) both}
@keyframes crownIn{0%{transform:translateY(-14px) scale(.4);opacity:0}100%{transform:none;opacity:1}}
.prizepop .eb .wpill{display:inline-block;margin-top:.3rem;font-size:.95rem;font-weight:900;color:#1E1915;background:var(--brand-y);border-radius:999px;padding:.15rem .9rem;letter-spacing:0;text-shadow:none}
#ppImg{position:relative}
#ppImg::after{content:"";position:absolute;left:50%;top:50%;width:70%;aspect-ratio:1;border:3px solid rgba(252,224,115,.85);border-radius:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;pointer-events:none;animation:ringOut 1.1s ease-out .25s 2}
@keyframes ringOut{0%{opacity:.9;transform:translate(-50%,-50%) scale(.6)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}
.prizepop .pp{animation:ppIn .55s cubic-bezier(.2,.9,.3,1.25),ppFloat 3s ease-in-out .6s infinite}
@keyframes ppFloat{0%,100%{translate:0 0}50%{translate:0 -6px}}
@media (max-width:640px){
  .rv-fan.pyr .pc{width:78px}.rv-fan.pyr .r2 .pc{width:72px}.rv-fan.pyr.one .pc{width:104px}
  .rv-fan.pyr .pc .pct.nums{font-size:.66rem}
}
@media (prefers-reduced-motion:reduce){.rv-tk.shake,.rv-fan.pyr .pc,.prizepop .pp,#ppImg::after,.rv-tk[data-v="2"].glow .in .bigno .ds{animation:none}}

.rv-fan.pyr .pc img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:6px;display:block}
.rv-fan.pyr .pc .noimg{width:100%;aspect-ratio:1;display:grid;place-items:center;background:#F1ECE1;color:#A89B88;font-size:.62rem;letter-spacing:.15em;border-radius:6px}
.rv-fan.pyr .pc .g{position:absolute;left:-2px;top:-2px;background:var(--red);color:#fff;font-weight:900;padding:.2rem .45rem;border-radius:10px 0 8px 0}
.rv-fan.pyr .pc .g.lo{background:#1E1915}
.rv-fan.pyr .pc .pct.nums{color:var(--tk-ink);font-weight:900;font-family:var(--sans)}
/* 번호가 길면 두 줄까지 — 높이는 늘 두 줄 몫으로 고정해 카드가 바뀔 때 들썩이지 않게 */
.rv-fan.pyr .pc .pct.nums{white-space:normal;word-break:keep-all;line-height:1.2;height:2.4em;overflow:hidden;display:flex;align-items:center;justify-content:center;text-overflow:clip}

.rv-tk.hold .cv{animation:snag .14s linear infinite}
@media (max-width:640px){.rv-fan.pyr{min-height:228px}}

/* 판매 종료(완판 아님) 카드 — 완판과 구분되게 짙은 회색 */
.set-thumb .corner .badge.closed{background:#4A403A;border-color:#4A403A;color:#fff}
.kh-badge.closed{background:#4A403A}
