/* ─────────────────────────────────────────────────────────────
   라원쿠지 리뉴얼 v1 (2026-09) — "홉비샵 쇼케이스 위의 쿠지 코너"
   app.css 뒤에 붙는다. 토큰을 먹빛/황동/인주홍으로 바꾸고, 종이(paper)는
   티켓·등급표·결과지에만 남긴다. 이 파일 하나를 빼면 예전 화면으로 돌아간다.
   ───────────────────────────────────────────────────────────── */
:root{
  --paper:#0E0C0B; --paper-2:#14110F; --surface:#171412; --surface-2:#1F1B18; --line:#2A2521; --line-strong:#3A332D;
  --ink:#F3EDE2; --ink-2:#D9CFC0; --muted:#A89B88; --muted-2:#7A6F63;
  --red:#C8102E; --red-2:#9C0B22; --red-soft:rgba(200,16,46,.16); --red-glow:rgba(200,16,46,.38);
  --gold:#B8912B; --gold-2:#E2C776; --gold-soft:rgba(226,199,118,.14);
  --black:#0B0908; --black-2:#141110;
  --ok:#4CC38A; --ok-soft:rgba(76,195,138,.14); --warn:#D9A441; --warn-soft:rgba(217,164,65,.14); --danger:#E8695C; --danger-soft:rgba(232,105,92,.14);
  --code:#221D1A; --shadow:0 12px 34px rgba(0,0,0,.45);
  /* 손에 잡히는 것만 종이색 */
  --tk-paper:#F4EFE4; --tk-paper-2:#E9E2D3; --tk-ink:#1A1512; --tk-mute:#6B6156; --tk-line:#C9BFAF;
}
body{background:var(--paper);color:var(--ink)}
::selection{background:rgba(226,199,118,.35)}

/* ── 헤더/탭: 먹빛 통일, 금선만 남김 ── */
.topbar{background:#0B0908;border-bottom-color:#2A2521;box-shadow:inset 0 -1px 0 rgba(226,199,118,.25)}
.tabs{background:#100D0C;border-bottom-color:#2A2521}
.tabs a{color:#A89B88}.tabs a.on{color:#fff;border-color:var(--red)}
.account .lnk{color:#C6B9A4}
.footer{background:#0B0908;border-top-color:#2A2521}
.footer-links a{color:#E8DCC6}

/* ── 공통 컴포넌트 ── */
.btn{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink)}
.btn:hover{border-color:var(--gold);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.btn-primary{background:linear-gradient(180deg,#E63950,#C8102E);border-color:#C8102E;color:#fff;box-shadow:0 8px 22px var(--red-glow)}
.btn-primary:hover{background:linear-gradient(180deg,#F04A60,#D2122F);border-color:#D2122F}
.btn-gold{background:linear-gradient(180deg,#F0D68A,#B8912B);border-color:#9B7A1E;color:#2A1F05;text-shadow:none}
.btn-ghost{background:transparent}
.card{background:var(--surface);border-color:var(--line)}
.badge{border-color:var(--line-strong);color:var(--muted)}
.badge.open{background:rgba(76,195,138,.16);color:var(--ok)}
.badge.soldout{background:#2A2521;color:var(--gold-2)}
.badge.brand{background:var(--red-soft);color:#FF9BA8}
.badge.draft,.badge.closed{background:var(--code);color:var(--muted)}
.alert{background:var(--surface);border-color:var(--line-strong)}
.tablewrap{border-color:var(--line);background:var(--surface)}
th{background:var(--surface-2);color:var(--muted)}
th,td{border-bottom-color:var(--line)}
.grade{color:#FF6B7D}.grade.low{color:var(--muted)}
.form input[type=text],.form input[type=password],.form input[type=number],.form input[type=date],.form input[type=tel],.form input[type=email],.form select,.form textarea,.qty,.pr-jump input{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink)}
.eyebrow{color:var(--gold-2)}.eyebrow::before{background:var(--gold)}
.sec-head{border-bottom-color:var(--line-strong)}
.modal{background:var(--surface);border-color:var(--line-strong);box-shadow:0 30px 80px rgba(0,0,0,.7)}
.modal-actions{background:var(--surface);border-top-color:var(--line-strong)}
.consent{background:rgba(217,164,65,.10);border-color:rgba(217,164,65,.45)}
.party-notice,.buy-odds,.broker-note{background:var(--surface-2);border-color:var(--line-strong)}
.odds-list li{border-bottom-color:var(--line)}
.lightbox img{background:#0E0C0B}
.toast{background:#F3EDE2;color:#0E0C0B;border-color:var(--gold)}
.welcome .wl-item{background:var(--surface-2);border-color:var(--line-strong)}
.welcome .wl-item .ic{background:#0B0908;color:var(--gold-2);border:1px solid var(--line-strong)}
.fchip{background:var(--surface);border-color:var(--line-strong);color:var(--muted)}
.fchip.on{background:var(--ink);border-color:var(--ink);color:#0E0C0B;box-shadow:none}
.fairbar{background:var(--surface);border-color:var(--line-strong)}
.party-strip{background:var(--surface);border-color:var(--line);color:var(--muted)}
.party-strip b{color:var(--ink-2)}
.strip{background:var(--surface);border-color:var(--line)}
.emptycard{background:var(--surface);border-color:var(--line-strong)}
.q-list{background:var(--surface-2);border-color:var(--line)}
.q-list li{border-bottom-color:var(--line)}
.q-list li.cur{background:rgba(76,195,138,.12)}
.q-list li.me{background:rgba(226,199,118,.12)}
.kc-status{background:rgba(14,12,11,.85);color:var(--ink);border-color:rgba(255,255,255,.18)}
.kc-board::before{height:4px}
.kc-stub{background:var(--surface-2);border-color:var(--line-strong)}
.kc-stub::before,.kc-stub::after{background:var(--surface);border-color:var(--line-strong)}
.kc-circle{background:var(--ink);color:var(--paper)}
.kc-circle span{color:#5C5248}
.kc-sec-h{border-bottom-color:var(--line-strong)}
.kc-links a{color:var(--muted)}.kc-links a:hover{color:var(--gold-2)}
.notice-box{background:var(--surface);border-color:var(--line-strong)}
.kc-bar{background:var(--surface);border:1px solid var(--line-strong);border-bottom:0;box-shadow:0 -14px 40px rgba(0,0,0,.5)}
.sel-box::before{height:3px}
.sel-nums span{background:var(--red-soft);color:#FF9BA8}
.pill{background:var(--gold-2);color:#2A1F05}
.set-thumb .pct{background:rgba(14,12,11,.85)}
.hash,pre,code{background:var(--surface-2);border-color:var(--line);color:var(--ink-2)}
.locker-item{background:var(--surface);border-color:var(--line)}
.locker-item img,.locker-item .ph{background:var(--code)}
.w-row{background:var(--surface-2);border-color:var(--line)}
.wal-card{background:var(--surface);border-color:var(--line-strong)}
.cmp-table th,.cmp-table td{border-color:var(--line-strong)}
.cmp-table tr>th:first-child{background:var(--surface-2)}
.info-table th{background:var(--surface-2)}
.pb-wrap{background:var(--surface)}
.pb-rankchip{background:var(--surface-2);border-color:var(--line);color:var(--ink-2)}
.roster span{background:var(--surface-2);border-color:var(--line-strong)}
pre.roster-text{background:var(--surface-2);border-color:var(--line-strong)}
.prize-line input{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink)}
.admin-nav{border-bottom-color:var(--line-strong)}
.admin-nav a.on,.admin-nav a:hover{background:var(--ink);color:var(--paper)}
.legal h2{border-bottom-color:var(--line-strong)}
.stat{background:var(--surface-2);border-color:var(--line-strong)}
.hband,.hero,.featured,.prod,.pin-card,.bigcard,.tb,.step3,.s4,.wal-card,.fee-note,.vc-body,.social-row{background:var(--surface);border-color:var(--line-strong)}
.qbar{background:var(--surface);border-color:var(--line)}
.qchip{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink-2)}
.chip{background:var(--surface-2);border-color:var(--line-strong)}
a.chip.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.also-th{background:var(--surface-2);border-color:var(--line)}
.bar{background:var(--code)}
.lu-bar{background:var(--code)}
.prob-list .barw{background:var(--code)}

/* ── 홈: 쿠지 카드 v2 (등급 스트립 · 대기 pill · 랭킹) ── */
.grid-3{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.set-card{background:var(--surface);border-color:var(--line);border-radius:16px}
.set-card:hover{border-color:var(--gold);box-shadow:0 14px 40px rgba(0,0,0,.5)}
.set-card::after{display:none}
.set-thumb{aspect-ratio:4/3;background:#000}
.set-thumb .rank{position:absolute;left:0;top:0;width:42px;height:42px;background:var(--red);color:#fff;font-family:var(--mono);font-weight:700;font-size:1.05rem;display:flex;align-items:center;justify-content:center;border-bottom-right-radius:14px;z-index:1}
.set-thumb .rank~.corner{left:calc(42px + .5rem)}
.set-thumb .wait{position:absolute;right:.55rem;bottom:.55rem;background:rgba(14,12,11,.78);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:.22rem .6rem;font-size:.72rem;color:var(--ink)}
.set-thumb .wait b{color:var(--ok);font-family:var(--mono)}
.set-thumb .pct{display:none}
.set-body{padding:.75rem .85rem .9rem;gap:.5rem}
.set-title{font-size:.95rem;min-height:2.6em}
.set-strip{display:flex;gap:4px}
.set-strip div{flex:1;min-width:0;text-align:center}
.set-strip img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;background:#000;border:1px solid var(--line-strong);display:block}
.set-strip .ph{width:100%;aspect-ratio:1;border-radius:6px;background:var(--surface-2);border:1px solid var(--line-strong)}
.set-strip small{display:block;font-family:var(--mono);font-size:.6rem;color:var(--muted-2);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.set-strip small b{color:var(--gold-2);font-weight:600}
.set-strip .x img{filter:grayscale(1) brightness(.4)}
.set-strip .x small b{color:#FF6B7D;text-decoration:line-through}
.set-strip .last img{border-color:var(--gold)}
.set-strip .last small{color:var(--gold-2)}
.set-meta{padding-top:.2rem;color:var(--muted)}
.set-meta b{color:var(--gold-2);font-family:var(--mono);font-size:1rem}
.set-price{color:var(--ink)}
.bar i{background:linear-gradient(90deg,#E63950,var(--red),var(--gold-2))}
.set-seller{color:var(--muted-2)}

/* LIVE 피드 카드 */
.livefeed{margin-top:1.2rem}
.livefeed .lf-h{display:flex;align-items:center;gap:.6rem;font-size:.86rem;color:var(--muted);margin-bottom:.55rem}
.livefeed .lf-h .live-tag{font-size:.62rem}
.livefeed .lf-h .stats{margin-left:auto;font-family:var(--mono);font-size:.78rem;color:var(--muted-2)}
.livefeed .lf-h .stats b{color:var(--ink)}
.lf-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.55rem}
.lf{display:flex;gap:.55rem;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.5rem .6rem;min-width:0;text-decoration:none;color:inherit}
.lf:hover{border-color:var(--gold)}
.lf img,.lf .ph{width:42px;height:42px;border-radius:8px;object-fit:cover;background:#000;flex:none;border:1px solid var(--line-strong)}
.lf .ph{display:grid;place-items:center;font-family:var(--mono);font-size:.62rem;color:var(--muted-2)}
.lf .b{min-width:0}
.lf .g{font-family:var(--mono);font-weight:700;font-size:.72rem;color:var(--gold-2)}
.lf .g.a{color:#FF6B7D}
.lf .g.last{color:var(--gold-2)}
.lf .n{font-size:.78rem;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--ink)}
.lf .w{font-size:.68rem;color:var(--muted-2);margin-top:.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lf.new{animation:lfIn .5s ease-out}
@keyframes lfIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:1000px){.lf-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.lf-row{grid-template-columns:repeat(2,minmax(0,1fr))}.lf .n{font-size:.74rem}}

/* ── 세트 상세: 등급표 포스터 ── */
.poster{background:var(--tk-paper);color:var(--tk-ink);border-radius:16px;padding:1.1rem 1.15rem 1rem;position:relative;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.poster::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.022) 3px 4px);pointer-events:none}
.poster>*{position:relative}
.poster-h{display:flex;align-items:center;gap:.8rem;border-bottom:3px solid var(--tk-ink);padding-bottom:.6rem;margin-bottom:.8rem;flex-wrap:wrap}
.poster-h .k{background:var(--tk-ink);color:var(--tk-paper);font-weight:900;font-size:.72rem;padding:.3rem .55rem;border-radius:4px;letter-spacing:.1em;flex:none}
.poster-h h2{font-size:1.05rem;font-weight:900;letter-spacing:-.02em;color:var(--tk-ink);border:0;padding:0;min-width:0;flex:1}
.poster-h .p{font-family:var(--mono);font-weight:700;font-size:.85rem;color:var(--tk-ink);white-space:nowrap}
.poster-h .hint{flex-basis:100%;font-size:.74rem;color:var(--tk-mute)}
.pgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55rem}
.pz{background:#fff;border:1px solid #D9D2C4;border-radius:8px;padding:.45rem;position:relative;cursor:pointer;transition:transform .12s,box-shadow .15s;text-align:left;font:inherit;color:inherit;display:flex;flex-direction:column;gap:.3rem}
.pz:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.18)}
.pz:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.pz img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:4px;display:block}
.pz .noimg{width:100%;aspect-ratio:1;display:grid;place-items:center;background:#F1ECE1;color:#A89B88;font-family:var(--mono);font-size:.7rem;letter-spacing:.15em;border-radius:4px}
.pz .g{position:absolute;left:-1px;top:-1px;background:var(--red);color:#fff;font-weight:900;font-size:.7rem;padding:.25rem .5rem;border-radius:8px 0 8px 0;z-index:1;letter-spacing:.02em}
.pz .g.lo{background:var(--tk-ink)}
.pz .g.last{background:linear-gradient(180deg,#F0D68A,#B8912B);color:#2A1F05}
.pz .n{font-size:.72rem;font-weight:700;line-height:1.3;min-height:2.6em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--tk-ink)}
.pz .q{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--mono);font-size:.7rem;color:var(--tk-mute)}
.pz .q b{color:var(--red);font-size:.86rem}
.pz .q .pct{font-weight:700;color:var(--tk-ink)}
.pz.out{opacity:.42}
.pz.out .q b{color:var(--tk-mute);text-decoration:line-through}
.pz.last-one{border-color:var(--gold);background:#FFF9E6}
.pz.last-one .q .pct{color:var(--gold)}
.poster-f{margin-top:.7rem;display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap;font-size:.68rem;color:var(--tk-mute);font-family:var(--mono)}
.poster-f a{color:var(--tk-ink);text-decoration:underline}
@media (max-width:900px){.pgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:640px){.pgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}.pz{padding:.35rem}.pz .n{font-size:.66rem}.poster{padding:.8rem .8rem .7rem;border-radius:12px}.poster-h h2{font-size:.92rem}}

/* 상품 확률 팝업 */
.odds-modal{max-width:560px;padding:0;overflow:hidden}
.odds-modal::before{display:none}
.om-art{background:radial-gradient(70% 70% at 50% 40%,rgba(226,199,118,.22),rgba(226,199,118,0) 70%),#0E0C0B;padding:1.4rem 1.4rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.6rem;position:relative}
.om-art img{width:min(260px,60vw);aspect-ratio:1;object-fit:contain;background:#fff;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.6)}
.om-art .g{position:absolute;left:1rem;top:1rem;background:var(--red);color:#fff;font-weight:900;padding:.3rem .7rem;border-radius:6px;font-size:.85rem}
.om-art .g.lo{background:#3A332D}.om-art .g.last{background:linear-gradient(180deg,#F0D68A,#B8912B);color:#2A1F05}
.om-art .x{position:absolute;right:.8rem;top:.8rem;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1rem}
.om-body{padding:1rem 1.4rem 1.3rem;display:flex;flex-direction:column;gap:.7rem}
.om-body h3{font-size:1.15rem;line-height:1.3}
.om-kv{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.om-kv div{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:.6rem .5rem;text-align:center}
.om-kv b{display:block;font-family:var(--mono);font-size:1.35rem;color:var(--gold-2);font-weight:600;line-height:1.1}
.om-kv b.hot{color:#FF6B7D}
.om-kv span{font-size:.68rem;color:var(--muted)}
.om-bar{height:10px;border-radius:5px;background:var(--code);overflow:hidden}
.om-bar i{display:block;height:100%;background:linear-gradient(90deg,#E63950,var(--red),var(--gold-2));border-radius:5px;transition:width .5s}
.om-note{font-size:.76rem;color:var(--muted);line-height:1.55}
.om-note b{color:var(--ink)}

/* ── 종이 고르기: 먹빛 판 위의 종이 ── */
.pickroom{background:var(--paper)}
.pr-head{background:#0B0908;box-shadow:inset 0 -1px 0 rgba(226,199,118,.3)}
.pr-bar{background:var(--surface);border-bottom-color:var(--line-strong)}
.pr-tab{background:var(--surface-2);border-color:var(--line-strong);color:var(--ink-2)}
.pr-tab.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pr-tab.on small{color:#7A5F12}
.pr-foot{background:var(--surface);border-top-color:var(--line-strong);box-shadow:0 -14px 40px rgba(0,0,0,.5)}
.pr-amount{color:var(--gold-2)}
.ticket-grid,.pr-body .ticket-grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.ticket{aspect-ratio:1;border-radius:9px;background:var(--tk-paper);color:var(--tk-ink);font-size:.9rem;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.09),0 1px 0 rgba(0,0,0,.3);border:1px solid #D9D2C4}
.ticket::before{height:0;border:0;background:none}
.ticket::after{background:none}
.ticket:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,0,0,.45),0 0 0 2px var(--gold-2)}
.ticket.sold{background:var(--surface-2);color:var(--muted-2);border-color:var(--line);box-shadow:none;text-decoration:line-through}
.ticket.sold::after{background:none}
.ticket.hold{background:rgba(111,168,255,.16);color:#8FBBFF;border-color:rgba(111,168,255,.5);box-shadow:none}
.ticket.hold::before{background:none}
.ticket.mine{background:linear-gradient(180deg,#F0D68A,#B8912B);color:#2A1F05;border-color:var(--brass,#B8912B);box-shadow:0 0 0 3px rgba(226,199,118,.35),0 8px 18px rgba(0,0,0,.4)}
.ticket.mine::before,.ticket.mine::after{background:none}
.legend span::before{background:var(--tk-paper);border-color:#D9D2C4}
.legend .sold::before{background:var(--surface-2);border-color:var(--line);border-style:solid}
.legend .hold::before{background:rgba(111,168,255,.4);border-color:rgba(111,168,255,.6)}
.legend .mine::before{background:var(--gold-2);border-color:var(--gold)}
@media (max-width:640px){.ticket-grid,.pr-body .ticket-grid{grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:6px}.ticket{font-size:.8rem}}

/* ── 뜯기 화면 (전면) ──
   전쿠 방식: 상단에 뽑을 수 있는 상품을 확률과 함께 부채꼴로, 가운데에 종이 한 장 크게.
   여러 장이면 한 장씩 차례로. 뜯기면 상품이 팝업으로 튀어나온다. */
.rvscreen{position:fixed;inset:0;z-index:var(--z-modal);background:
  radial-gradient(60% 45% at 50% 0%,rgba(200,16,46,.28),rgba(200,16,46,0) 70%),
  radial-gradient(50% 40% at 50% 100%,rgba(226,199,118,.16),rgba(226,199,118,0) 70%),#0B0908;
  display:none;flex-direction:column;align-items:center;overflow:auto;padding:1.2rem 1rem 2rem}
.rvscreen.show{display:flex}
.rvscreen::before,.rvscreen::after{content:"";position:absolute;width:260px;height:180px;border-radius:26px;background:rgba(255,255,255,.03);transform:rotate(-18deg);pointer-events:none}
.rvscreen::before{left:-90px;top:8%}.rvscreen::after{right:-100px;bottom:10%;transform:rotate(22deg)}
.rv-top{display:flex;align-items:center;gap:.8rem;width:100%;max-width:980px;color:var(--muted);font-size:.82rem}
.rv-top .x{margin-left:auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;width:38px;height:38px;border-radius:50%;font-size:1rem}
.rv-title{margin-top:1.4rem;font-weight:900;font-size:1.35rem;letter-spacing:-.02em;color:var(--gold-2);text-align:center;display:flex;align-items:center;gap:.6rem;text-wrap:balance}
.rv-title::before,.rv-title::after{content:"✦";font-size:.9rem;color:var(--gold)}
.rv-sub{font-size:.8rem;color:var(--muted);margin-top:.25rem;font-family:var(--mono)}
/* 부채꼴 상품 */
.rv-fan{display:flex;justify-content:center;align-items:flex-end;gap:0;margin:1.1rem 0 .2rem;min-height:190px;width:100%;max-width:980px;padding:0 .5rem}
.rv-fan .fc{position:relative;width:126px;flex:none;margin:0 -10px;background:#fff;border-radius:10px;padding:5px 5px 6px;box-shadow:0 14px 34px rgba(0,0,0,.55);border:2px solid #E5DECF;transform-origin:50% 120%;transition:transform .3s,opacity .3s,box-shadow .3s;color:var(--tk-ink);text-align:center;
  transform:rotate(var(--rot,0deg)) translateY(var(--lift,0px))}
.rv-fan .fc:hover{transform:rotate(var(--rot,0deg)) translateY(calc(var(--lift,0px) - 14px)) scale(1.06);z-index:20}
/* 뜯을수록 아닌 카드가 떨어져 나간다 · 정답만 남아 튀어오른다 */
.rv-fan .fc.gone{transform:rotate(var(--rot,0deg)) translateY(calc(var(--lift,0px) + 46px)) scale(.55);opacity:0;pointer-events:none}
.rv-fan .fc.win{transform:rotate(0deg) translateY(-26px) scale(1.16);z-index:30;border-color:var(--gold);box-shadow:0 0 0 3px rgba(226,199,118,.55),0 0 40px 10px rgba(226,199,118,.35),0 20px 50px rgba(0,0,0,.6);animation:fcwin .6s cubic-bezier(.2,.9,.3,1.3)}
@keyframes fcwin{0%{transform:rotate(0deg) translateY(0) scale(1)}60%{transform:rotate(0deg) translateY(-34px) scale(1.24)}100%{transform:rotate(0deg) translateY(-26px) scale(1.16)}}
.rv-fan .fc img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:6px;display:block}
.rv-fan .fc .noimg{width:100%;aspect-ratio:1;display:grid;place-items:center;background:#F1ECE1;color:#A89B88;font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;border-radius:6px}
.rv-fan .fc .g{position:absolute;left:-2px;top:-2px;background:var(--red);color:#fff;font-weight:900;font-size:.66rem;padding:.22rem .45rem;border-radius:10px 0 8px 0}
.rv-fan .fc .g.lo{background:var(--tk-ink)}
.rv-fan .fc.top{border-color:var(--gold);box-shadow:0 0 0 2px rgba(226,199,118,.35),0 16px 40px rgba(0,0,0,.6)}
.rv-fan .fc .pct{display:block;font-family:var(--mono);font-weight:700;font-size:.92rem;color:var(--tk-ink);margin-top:.3rem;line-height:1}
.rv-fan .fc .cnt{display:block;font-family:var(--mono);font-size:.6rem;color:var(--tk-mute);margin-top:.15rem}
.rv-fan .fc.out{opacity:.35;filter:grayscale(1)}
/* 종이 한 장 */
.rv-stage{position:relative;width:min(560px,94vw);margin:1.2rem 0 .8rem;perspective:1200px}
.rv-tk{position:relative;width:100%;aspect-ratio:1.62/1;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.7);background:var(--tk-paper);transform:rotate(-1.5deg)}
.rv-tk .in{position:absolute;inset:0;background:var(--tk-paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:1rem;color:var(--tk-ink)}
.rv-tk .in .g{font-size:5rem;font-weight:900;line-height:1;letter-spacing:-.04em;color:var(--red)}
.rv-tk .in .g small{font-size:1.6rem;vertical-align:.9em;margin-left:.1rem}
.rv-tk .in .nm{font-size:1rem;font-weight:800;text-align:center;line-height:1.3;max-width:90%}
.rv-tk .in img{width:88px;height:88px;object-fit:contain;background:#fff;border-radius:8px;border:1px solid #E5DECF;position:absolute;right:1rem;bottom:1rem}
.rv-tk .in .no{position:absolute;left:1rem;top:.8rem;font-family:var(--mono);font-size:.8rem;color:var(--tk-mute)}
/* 겉장: 붉은 띠 + 큰 번호 + 반짝이는 절취선 */
.rv-tk .cv{position:absolute;inset:0;background:var(--tk-paper);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;z-index:2;will-change:clip-path;display:flex;flex-direction:column}
.rv-tk .cv.dragging{cursor:grabbing}
.rv-tk .cv .hd{display:flex;justify-content:space-between;align-items:center;padding:.7rem 1rem .4rem;font-family:var(--mono);font-size:.74rem;color:var(--tk-mute)}
.rv-tk .cv .hd b{color:var(--tk-ink)}
.rv-tk .cv .band{background:var(--red);color:#fff;padding:.55rem 1rem;font-weight:900;font-size:.82rem;letter-spacing:.06em;display:flex;justify-content:space-between;align-items:center}
.rv-tk .cv .band small{font-family:var(--mono);font-weight:600;opacity:.9}
.rv-tk .cv .num{flex:1;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;font-size:clamp(3.6rem,13vw,5.6rem);letter-spacing:.04em;color:var(--tk-ink);line-height:1}
.rv-tk .cv .num small{font-size:.28em;color:var(--tk-mute);margin-right:.35em;font-weight:600;align-self:center;margin-top:.5em}
.rv-tk .cv .ft{border-top:2px dashed var(--tk-line);padding:.45rem 1rem;font-family:var(--mono);font-size:.68rem;color:var(--tk-mute);display:flex;justify-content:space-between}
.rv-tk .cv .grip{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);width:26px;height:74px;border-radius:8px;border:3px solid var(--tk-ink);background:rgba(0,0,0,.06);display:grid;place-items:center}
.rv-tk .cv .grip::after{content:"";width:6px;height:40px;border-radius:3px;background:var(--tk-ink)}
.rv-tk .cv.done{transition:transform .55s cubic-bezier(.3,.7,.2,1),opacity .45s;transform:translateX(130%) rotate(8deg);opacity:0;pointer-events:none}
.rv-tk .edge{position:absolute;top:-6px;bottom:-6px;width:8px;left:0;z-index:3;pointer-events:none;opacity:0;background:linear-gradient(180deg,transparent,var(--gold-2) 20%,#fff 50%,var(--gold-2) 80%,transparent);box-shadow:0 0 18px 6px rgba(226,199,118,.7),0 0 40px 12px rgba(226,199,118,.35);border-radius:4px}
.rv-tk .edge.on{opacity:1}
.rv-tk .edge i{position:absolute;left:50%;width:6px;height:6px;border-radius:50%;background:#FFE9A8;box-shadow:0 0 8px 2px rgba(255,233,168,.9);animation:spark .7s ease-out infinite}
.rv-tk .edge i:nth-child(1){top:12%;animation-delay:0s}.rv-tk .edge i:nth-child(2){top:38%;animation-delay:.18s}.rv-tk .edge i:nth-child(3){top:61%;animation-delay:.36s}.rv-tk .edge i:nth-child(4){top:84%;animation-delay:.54s}
@keyframes spark{0%{transform:translate(-50%,0) scale(1);opacity:1}100%{transform:translate(calc(-50% + 22px),-14px) scale(.2);opacity:0}}
.rv-tk.open{animation:tkpop .5s cubic-bezier(.2,.9,.3,1.3)}
@keyframes tkpop{0%{transform:rotate(-1.5deg) scale(.97)}60%{transform:rotate(0) scale(1.03)}100%{transform:rotate(0) scale(1)}}
.rv-help{text-align:center;font-size:.9rem;color:var(--muted);line-height:1.7;max-width:36ch}
.rv-help b{color:var(--ink)}
.rv-row{display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap;justify-content:center}
/* 뜯은 종이 모음 */
.rv-done{display:flex;gap:.4rem;margin-top:1rem;flex-wrap:wrap;justify-content:center;max-width:980px}
.rv-done span{display:inline-flex;align-items:center;gap:.35rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:.25rem .6rem .25rem .3rem;font-size:.74rem;color:var(--ink)}
.rv-done img{width:22px;height:22px;border-radius:50%;object-fit:cover;background:#000}
.rv-done b{font-family:var(--mono);color:var(--gold-2)}
/* 상품 팝업 (도파민) */
.prizepop{position:fixed;inset:0;z-index:calc(var(--z-modal) + 5);display:none;place-items:center;padding:1rem;
  background:radial-gradient(60% 60% at 50% 45%,rgba(226,199,118,.30),rgba(14,12,11,.92) 75%)}
.prizepop.show{display:grid}
.prizepop .pp{position:relative;width:min(460px,94vw);background:var(--surface);border:1px solid var(--line-strong);border-radius:22px;padding:1.4rem 1.4rem 1.3rem;text-align:center;box-shadow:0 40px 100px rgba(0,0,0,.8);animation:ppIn .55s cubic-bezier(.2,.9,.3,1.25)}
@keyframes ppIn{0%{transform:scale(.6) translateY(30px);opacity:0}100%{transform:none;opacity:1}}
.prizepop .pp.top{border-color:var(--gold);box-shadow:0 0 0 4px rgba(226,199,118,.25),0 40px 100px rgba(0,0,0,.8)}
.prizepop .rays{position:absolute;inset:-40%;background:conic-gradient(from 0deg,rgba(226,199,118,.0) 0 8%,rgba(226,199,118,.18) 8% 10%,rgba(226,199,118,0) 10% 18%,rgba(226,199,118,.18) 18% 20%,rgba(226,199,118,0) 20% 28%,rgba(226,199,118,.18) 28% 30%,rgba(226,199,118,0) 30% 38%,rgba(226,199,118,.18) 38% 40%,rgba(226,199,118,0) 40% 48%,rgba(226,199,118,.18) 48% 50%,rgba(226,199,118,0) 50% 58%,rgba(226,199,118,.18) 58% 60%,rgba(226,199,118,0) 60% 68%,rgba(226,199,118,.18) 68% 70%,rgba(226,199,118,0) 70% 78%,rgba(226,199,118,.18) 78% 80%,rgba(226,199,118,0) 80% 88%,rgba(226,199,118,.18) 88% 90%,rgba(226,199,118,0) 90% 100%);animation:rays 14s linear infinite;pointer-events:none;border-radius:50%;z-index:-1;opacity:.8}
.prizepop .pp.top .rays{opacity:1}
@keyframes rays{to{transform:rotate(360deg)}}
.prizepop .eb{font-family:var(--mono);font-size:.72rem;letter-spacing:.24em;color:var(--gold)}
.prizepop .gb{display:inline-block;margin-top:.45rem;background:var(--red);color:#fff;font-weight:900;font-size:1.05rem;padding:.3rem .9rem;border-radius:8px}
.prizepop .gb.lo{background:#3A332D}
.prizepop .gb.last{background:linear-gradient(180deg,#F0D68A,#B8912B);color:#2A1F05}
.prizepop img{width:min(300px,68vw);aspect-ratio:1;object-fit:contain;background:#fff;border-radius:16px;margin:.9rem auto .7rem;display:block;box-shadow:0 20px 50px rgba(0,0,0,.6)}
.prizepop .noimg{width:min(300px,68vw);aspect-ratio:1;display:grid;place-items:center;background:var(--surface-2);border-radius:16px;margin:.9rem auto .7rem;font-family:var(--mono);color:var(--muted-2);letter-spacing:.2em}
.prizepop h3{font-size:1.3rem;line-height:1.25;letter-spacing:-.02em}
.prizepop .no{font-family:var(--mono);font-size:.78rem;color:var(--muted);margin-top:.3rem}
.prizepop .acts{display:flex;gap:.5rem;justify-content:center;margin-top:1rem;flex-wrap:wrap}
.prizepop .lo1{margin-top:.8rem;background:linear-gradient(135deg,#FFF6DA,#F5E4B0);color:#2A1F05;border-radius:10px;padding:.6rem .8rem;font-size:.85rem;font-weight:800}
.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:22px}
.confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;animation:cf 1.6s ease-in forwards}
@keyframes cf{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(520px) rotate(720deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.rv-tk .edge i,.prizepop .rays,.confetti i,.prizepop .pp,.rv-tk.open,.lf.new{animation:none}}
@media (max-width:640px){
  .rv-fan .fc{width:96px;margin:0 -8px;padding:4px}
  .rv-fan .fc .pct{font-size:.8rem}
  .rv-title{font-size:1.1rem;margin-top:1rem}
  .rv-tk .in .g{font-size:3.6rem}
  .rv-tk .in img{width:64px;height:64px}
  .prizepop .pp{padding:1.1rem 1rem 1rem}
  .prizepop h3{font-size:1.1rem}
}

/* ── 뜯기 v2: 종이 더미 · 양방향 톱니 찢기 · 잡는 탭 ── */
.rv-stage{padding-top:calc(var(--stack,0) * 9px)}
.rv-tk{transition:transform .35s cubic-bezier(.2,.8,.3,1),opacity .3s}
.rv-tk.behind{position:absolute;left:0;top:0;width:100%;pointer-events:none;
  transform:translateY(calc(var(--k) * -9px)) translateX(calc(var(--k) * 6px)) rotate(calc(-1.5deg + var(--k) * 1.4deg)) scale(calc(1 - var(--k) * .022));
  filter:brightness(calc(1 - var(--k) * .12))}
.rv-tk.behind .in,.rv-tk.behind .edge,.rv-tk.behind .fringe,.rv-tk.behind .hand{visibility:hidden}
.rv-tk.cur{position:relative}
.rv-tk.fly{transform:translate(60vw,-30vh) rotate(24deg) scale(.7)!important;opacity:0;pointer-events:none;transition:transform .5s ease-in,opacity .45s}
.rv-stage.many::after{content:"";position:absolute;left:8px;right:-8px;top:8px;bottom:-8px;border-radius:14px;border:1px dashed rgba(244,239,228,.25);pointer-events:none;z-index:0}
/* 안쪽은 다 찢기기 전까지 봉인 무늬만. 결과(등급·상품명)는 open 뒤에 떠오르고, 이미지는 팝업에서만 보여준다 */
.rv-tk .in .g,.rv-tk .in .nm{opacity:0;transform:translateY(8px);transition:opacity .35s ease .15s,transform .35s ease .15s}
.rv-tk.open .in .g,.rv-tk.open .in .nm{opacity:1;transform:none}
.rv-tk .in img{display:none}
.rv-tk .in .seal{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;
  font-size:5.2rem;font-weight:900;line-height:1;color:rgba(26,21,18,.10);letter-spacing:-.04em;pointer-events:none;
  background:repeating-linear-gradient(-35deg,transparent 0 22px,rgba(26,21,18,.035) 22px 24px)}
.rv-tk .in .seal small{font-size:1.6rem;vertical-align:.9em;margin-left:.1rem}
.rv-tk .in .seal i{font-style:normal;font-family:var(--mono);font-size:.62rem;letter-spacing:.3em;color:rgba(26,21,18,.28);margin-top:.6rem}
.rv-tk.open .in .seal{opacity:0;transition:opacity .3s}
/* 겉장이 왼쪽으로 찢겨 날아갈 때 */
.rv-tk .cv.done.done-l{transform:translateX(-130%) rotate(-8deg)}
/* 양쪽 잡는 탭 — 어느 쪽이든 잡고 옆으로 */
.rv-tk .cv .grip{display:none}
.rv-tk .cv .tab{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:82px;border-radius:10px;border:3px solid var(--tk-ink);background:rgba(0,0,0,.05);display:grid;place-items:center;transition:background .15s}
.rv-tk .cv .tab.l{left:.7rem}.rv-tk .cv .tab.r{right:.7rem}
.rv-tk .cv .tab i{width:6px;height:44px;border-radius:3px;background:var(--tk-ink)}
.rv-tk .cv:hover .tab,.rv-tk .cv.dragging .tab{background:rgba(200,16,46,.12);border-color:var(--red)}
.rv-tk .cv.dragging .tab i{background:var(--red)}
/* 손가락 힌트: 첫 터치 전까지 좌우로 왔다갔다 */
.rv-tk .cv .hand{position:absolute;left:50%;top:58%;font-size:2.2rem;line-height:1;transform:translate(-50%,0);pointer-events:none;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.35));animation:handhint 1.6s ease-in-out infinite;opacity:.95}
.rv-tk .cv .hand.off{display:none}
@keyframes handhint{0%,100%{transform:translate(calc(-50% - 70px),0) rotate(-8deg)}50%{transform:translate(calc(-50% + 70px),0) rotate(8deg)}}
/* 톱니 찢긴 자국: 절취선 옆에 남는 종이 보풀 */
.rv-tk .fringe{position:absolute;top:0;bottom:0;width:14px;left:0;z-index:2;pointer-events:none;opacity:0;background:var(--tk-paper-2);
  clip-path:polygon(0 0,100% 3%,20% 7%,100% 12%,30% 17%,100% 22%,15% 27%,100% 33%,25% 38%,100% 44%,10% 49%,100% 55%,30% 60%,100% 66%,20% 71%,100% 77%,25% 82%,100% 88%,15% 93%,100% 100%,0 100%);
  filter:drop-shadow(-2px 0 2px rgba(0,0,0,.35))}
.rv-tk .fringe.on{opacity:1}
.rv-tk .cv{clip-path:none}
@media (prefers-reduced-motion:reduce){.rv-tk .cv .hand{animation:none}.rv-fan .fc.win{animation:none}}
@media (max-width:640px){
  .rv-tk .cv .tab{width:26px;height:64px}
  .rv-tk .cv .hand{font-size:1.8rem}
}

/* 한 번에 다 뜯기 결과 — 등급별로 묶어 한 판에 */
.prizepop .pp:has(.pp-grid){width:min(640px,96vw)}
.pp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:.5rem;margin:.9rem 0 .6rem;max-height:52vh;overflow:auto;padding:2px}
.pp-grid .it{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:12px;padding:.45rem;text-align:center;display:flex;flex-direction:column;gap:.25rem}
.pp-grid .it img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:8px;margin:0;box-shadow:none}
.pp-grid .it .noimg{width:100%;aspect-ratio:1;margin:0;border-radius:8px;font-size:.6rem}
.pp-grid .it b{font-family:var(--mono);font-size:.82rem;color:var(--gold-2)}
.pp-grid .it small{font-size:.66rem;color:var(--muted);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pp-grid .it.top{border-color:var(--gold);box-shadow:0 0 0 2px rgba(226,199,118,.3)}
.pp-grid .it.top b{color:#FF6B7D}
@media (max-width:640px){.pp-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}}

/* 상세 페이지 안의 종이판 (읽기용 · 내 차례면 클릭해서 바로 고르기) */
.ticket-board{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:6px;margin:.8rem 0 0;padding:.75rem;background:var(--surface-2);border:1px solid var(--line);border-radius:12px}
.ticket-board .ticket{font-size:.78rem;border-radius:7px;cursor:pointer}
.ticket-board .ticket.sold{cursor:default}
.ticket-board .ticket:hover{transform:translateY(-2px)}
@media (max-width:640px){.ticket-board{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:4px;padding:.5rem}.ticket-board .ticket{font-size:.7rem}}

/* 종이 고르기 바닥: 랜덤 선택 묶음 */
.pr-rand{display:inline-flex;align-items:center;gap:.3rem;flex-wrap:wrap;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:.3rem .45rem}
.pr-rand .lbl{font-size:.78rem;font-weight:700;color:var(--muted);margin:0 .25rem 0 .15rem;white-space:nowrap}
.pr-rand .btn{font-family:var(--mono);font-weight:600;min-width:2.9rem}
.pr-rand .btn:hover{border-color:var(--gold-2);color:var(--gold-2)}
.pr-sel .row.between .btn{padding:.2rem .55rem;font-size:.74rem}
@media (max-width:640px){
  .pr-rand{width:100%;justify-content:space-between}
  .pr-rand .btn{flex:1;min-width:0}
  .pr-pay .btn-lg{width:100%}
}