/* 오늘의 운세 쿠지 (2026-11-01, 디자인 시안 H — 캐릭터 '라우'). 찢기 종이(.rv-tk)는 쿠지 뜯기 화면 스타일을 그대로 쓴다 */
.ft,.ft-tear,.ft-confetti{--ft-cream:#FBF3E4;--ft-paper:#FFFBF2;--ft-red:#B8001F;--ft-red-2:#D9304A;--ft-ink:#4A2C22;--ft-gold:#E2B93B;--ft-gold-2:#F6D77A;--ft-line:#E9D9BE;
  --ft-hand:"Jua","Pretendard Variable",Pretendard,sans-serif}
.ft{color:var(--ft-ink);max-width:560px;margin:0 auto}
.ft *{box-sizing:border-box}

/* ── 위 그림 + 제목 ── */
.ft-hero{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:3/2;background:var(--ft-cream) url(/img/fortune/bg.webp) center bottom/cover no-repeat;box-shadow:0 10px 30px rgba(74,44,34,.18)}
.ft-title{position:absolute;left:0;right:0;top:6%;display:flex;flex-direction:column;align-items:center;gap:.45rem}
.ft-hero h1{margin:0;text-align:center;font-family:var(--ft-hand);font-weight:400;font-size:clamp(2.1rem,9.5vw,3.3rem);line-height:1.04;letter-spacing:-.01em;
  color:var(--ft-red);-webkit-text-stroke:7px #fff;paint-order:stroke fill;text-shadow:0 5px 0 rgba(226,185,59,.55),0 8px 18px rgba(74,44,34,.18)}
.ft-hero h1 span{display:block;font-size:.62em;color:var(--ft-ink)}
.ft-ribbon{white-space:nowrap;font-family:var(--ft-hand);font-size:clamp(.95rem,4vw,1.15rem);
  color:var(--ft-red);background:var(--ft-paper);border:2.5px solid var(--ft-red);border-radius:999px;padding:.2rem 1rem;box-shadow:0 3px 0 var(--ft-gold)}
.ft-ribbon::before,.ft-ribbon::after{content:"✿";margin:0 .35rem;color:var(--ft-red-2);font-size:.85em}
.ft-meta{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin:.8rem 0 2.6rem;font-size:.86rem;color:#8A6F5E}
.ft-meta b{color:var(--ft-red)}

/* ── 종이판 ── */
.ft-board{position:relative;margin-top:.7rem;padding:14px 12px 16px;border-radius:18px;background:linear-gradient(#C8243A,#A3001B);
  box-shadow:inset 0 0 0 4px #8C0016,inset 0 0 0 7px var(--ft-gold),0 12px 28px rgba(74,44,34,.25)}
.ft-board::before{content:"";position:absolute;left:18px;right:18px;top:-9px;height:18px;border-radius:9px;background:repeating-linear-gradient(-55deg,#F2DFA4 0 7px,#D9B45A 7px 12px);box-shadow:0 2px 0 rgba(0,0,0,.15)}
.ft-board::after{content:"";position:absolute;left:50%;top:-16px;width:30px;height:30px;transform:translateX(-50%) rotate(45deg);border-radius:7px;background:var(--ft-gold);box-shadow:inset 0 0 0 4px #F6D77A,0 2px 4px rgba(0,0,0,.2)}
.ft-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:8px}
.ft-tk{position:relative;aspect-ratio:3/3.5;border:0;padding:0;border-radius:6px;cursor:pointer;font:inherit;color:var(--ft-ink);
  background:var(--ft-paper);box-shadow:0 2px 0 #E2CBA4,0 4px 8px rgba(0,0,0,.18);transition:transform .15s,box-shadow .15s}
.ft-tk::before{content:"";position:absolute;left:4px;right:4px;top:5px;border-top:2px dashed rgba(184,0,31,.35)}
.ft-tk::after{content:"";position:absolute;left:50%;top:1px;width:14px;height:8px;transform:translateX(-50%);border-radius:50% 50% 40% 40%;
  background:radial-gradient(circle at 25% 50%,var(--ft-red) 0 3px,transparent 3.5px),radial-gradient(circle at 75% 50%,var(--ft-red) 0 3px,transparent 3.5px)}
.ft-tk .n{position:absolute;inset:0;display:grid;place-items:center;padding-top:4px;font-family:var(--ft-hand);font-size:clamp(1.05rem,5vw,1.4rem);color:#5A3A2C}
.ft-tk:hover:not(:disabled){transform:translateY(-2px) rotate(-1deg);box-shadow:0 4px 0 #E2CBA4,0 8px 14px rgba(0,0,0,.22)}
.ft-tk:focus-visible{outline:3px solid var(--ft-gold-2);outline-offset:2px}
/* 뜯긴 칸: 위가 들쭉날쭉 찢긴 종이 + 나온 등급 */
.ft-tk.torn{cursor:default;background:#F3E6CC;box-shadow:inset 0 0 0 1px #E2CBA4;
  clip-path:polygon(0 12%,10% 6%,20% 13%,32% 5%,44% 12%,56% 4%,68% 12%,80% 6%,90% 13%,100% 7%,100% 100%,0 100%)}
.ft-tk.torn::before,.ft-tk.torn::after{display:none}
.ft-tk.torn .n{font-size:.62rem;place-items:start center;padding-top:22%;color:#A88B74}
.ft-tk.torn .g{position:absolute;left:0;right:0;bottom:16%;text-align:center;font-family:var(--ft-hand);font-size:clamp(.82rem,3.8vw,1.05rem);color:#6C6C6C}
.ft-tk.torn .g.g1{color:var(--ft-red)}.ft-tk.torn .g.g2{color:#C08A12}.ft-tk.torn .g.g3{color:#3E6DB5}
.ft-tk.me{clip-path:none;box-shadow:0 0 0 3px var(--ft-gold),0 0 14px 2px rgba(246,215,122,.9)}
.ft-tk.me .n::after{content:"내 운세";position:absolute;left:50%;top:-8px;transform:translateX(-50%);white-space:nowrap;font-family:var(--ft-hand);font-size:.62rem;color:#fff;background:var(--ft-red);border-radius:999px;padding:.05rem .4rem}
.ft-grid.locked .ft-tk:not(.torn){cursor:default;opacity:.92}
.ft-grid.locked .ft-tk:not(.torn):hover{transform:none}
.ft-rawoo-tear{position:absolute;left:-8px;top:-64px;width:84px;z-index:2;pointer-events:none;filter:drop-shadow(0 4px 6px rgba(0,0,0,.18));animation:ftBob 2.4s ease-in-out infinite}
@keyframes ftBob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}
.ft-hint{display:flex;align-items:center;gap:.6rem;margin:1.6rem 0 0;padding:.75rem 1rem;border-radius:16px;background:var(--ft-paper);border:2px dashed var(--ft-line);font-size:.92rem;line-height:1.5}
.ft-hint img{width:58px;flex:none}
.ft-hint b{color:var(--ft-red)}

/* ── 결과 카드 ── */
.ft-result{position:relative;margin:5.6rem 0 4.6rem;padding:3.9rem 1.1rem 1.1rem;border-radius:22px;background:var(--ft-paper);
  box-shadow:inset 0 0 0 3px var(--ft-red),inset 0 0 0 6px var(--ft-paper),inset 0 0 0 7.5px var(--ft-gold),0 14px 34px rgba(74,44,34,.2)}
.ft-result[hidden]{display:none}
.ft-result.pop{animation:ftPop .6s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes ftPop{0%{transform:scale(.7) translateY(40px);opacity:0}100%{transform:none;opacity:1}}
.ft-r-pose{position:absolute;left:50%;top:-80px;height:116px;width:auto;max-width:150px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 6px 8px rgba(0,0,0,.15))}
.ft-result.pop .ft-r-pose{animation:ftJump .9s .35s cubic-bezier(.3,1.6,.5,1) both}
@keyframes ftJump{0%{transform:translateX(-50%) translateY(30px) scale(.6)}60%{transform:translateX(-50%) translateY(-14px) scale(1.06)}100%{transform:translateX(-50%)}}
.ft-r-date{display:table;margin:0 auto;font-family:var(--ft-hand);font-size:1.05rem;padding:.15rem 1.1rem;border-radius:8px;background:#F6E7C3;border:2px solid var(--ft-gold)}
.ft-r-grade{text-align:center;margin:.35rem 0 .1rem;font-family:var(--ft-hand);font-size:clamp(4rem,20vw,5.4rem);line-height:1;color:var(--ft-red);
  -webkit-text-stroke:2px #7E0014;paint-order:stroke fill;text-shadow:0 4px 0 rgba(226,185,59,.5)}
.ft-r-grade::before,.ft-r-grade::after{content:"🌿";font-size:.42em;vertical-align:.55em;margin:0 .15em;-webkit-text-stroke:0;filter:sepia(1) saturate(4) hue-rotate(5deg)}
.ft-r-grade::after{display:inline-block;transform:scaleX(-1)}
.ft-r-line{text-align:center;margin:0 0 .9rem;font-size:.95rem;font-weight:700;color:#7A5A49}
.ft-rows{border-top:1.5px dashed var(--ft-line)}
.ft-row{display:flex;align-items:center;gap:.75rem;padding:.6rem .2rem;border-bottom:1.5px dashed var(--ft-line)}
.ft-row i{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;font-style:normal;font-size:1.4rem;background:#FFF4DE;border:1.5px solid #EBD6AE}
.ft-row small{display:block;font-size:.78rem;font-weight:800;color:#9A7B68}
.ft-row b{font-size:1.08rem}
.ft-dot{display:inline-block;width:.9em;height:.9em;border-radius:50%;vertical-align:-.08em;margin-right:.3rem;box-shadow:inset 0 0 0 1.5px rgba(0,0,0,.15)}
.ft-quote{position:relative;margin:.9rem 0 .2rem;padding:.9rem 1rem;border-radius:14px;border:2px solid var(--ft-gold);background:#FFF8E8;text-align:center;font-weight:700;line-height:1.6}
.ft-faces{display:flex;justify-content:center;gap:.4rem;margin:.9rem 0 .2rem}
.ft-faces span{display:flex;flex-direction:column;align-items:center;gap:.1rem;width:64px;opacity:.45;filter:grayscale(.6);transition:opacity .2s}
.ft-faces span img{width:52px;height:52px;object-fit:contain}
.ft-faces span em{font-style:normal;font-family:var(--ft-hand);font-size:.86rem;color:#fff;border-radius:6px;padding:0 .5rem;background:#9AA0A6}
.ft-faces span.on{opacity:1;filter:none;transform:scale(1.12)}
.ft-faces span:nth-child(1) em{background:var(--ft-red)}.ft-faces span:nth-child(2) em{background:#D7A21C}.ft-faces span:nth-child(3) em{background:#3E6DB5}
.ft-btns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.45rem;margin-top:1rem}
.ft-btns .btn{min-height:48px;padding:.5rem .3rem;border-radius:12px;font-weight:800;font-size:.9rem;white-space:nowrap}
.btn.ft-save{background:#fff;color:var(--ft-ink);border:2px solid var(--ft-line)}
.btn.ft-kakao{background:#FEE500;color:#191600;border:2px solid #E7CF00}
.btn.ft-go{background:var(--ft-red);color:#fff;border:2px solid #8C0016}
.ft-note{margin:.8rem 0 0;font-size:.74rem;color:#9A8676;text-align:center;line-height:1.5}
.ft-admin{margin-top:.6rem;text-align:center}
.ft-login{margin-top:1rem}

/* ── 찢기 화면 ── */
.ft-tear{position:fixed;inset:0;z-index:calc(var(--z-modal,1000) + 5);display:none;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1rem;
  background:radial-gradient(70% 50% at 50% 45%,rgba(255,206,110,.32),rgba(255,206,110,0) 70%),rgba(38,21,16,.95)}
.ft-tear.show{display:flex}
.ft-cands{display:flex;justify-content:center;gap:.5rem;min-height:104px}
.ft-cand{overflow:hidden;flex:none;display:flex;flex-direction:column;align-items:center;width:76px;padding:.35rem .2rem .3rem;border-radius:12px;background:var(--ft-paper);border:2px solid var(--ft-line);
  box-shadow:0 10px 22px rgba(0,0,0,.4);transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .3s,width .35s,margin .35s;animation:ftIn .4s cubic-bezier(.2,.9,.3,1.3) both}
.ft-cand:nth-child(2){animation-delay:.06s}.ft-cand:nth-child(3){animation-delay:.12s}.ft-cand:nth-child(4){animation-delay:.18s}
@keyframes ftIn{0%{transform:translateY(-30px) scale(.7);opacity:0}100%{transform:none;opacity:1}}
.ft-cand img{width:54px;height:54px;object-fit:contain}
.ft-cand b{font-family:var(--ft-hand);font-weight:400;font-size:1rem;color:var(--ft-red)}
.ft-cand.gone{transform:translateY(60px) rotate(14deg) scale(.6);opacity:0;width:0;padding:0;border-width:0;margin:0 -.25rem;pointer-events:none}
.ft-cand.win{border-color:var(--ft-gold);transform:scale(1.25);box-shadow:0 0 0 3px rgba(246,215,122,.6),0 0 34px 8px rgba(246,215,122,.45),0 14px 30px rgba(0,0,0,.5)}
.ft-stage{width:min(460px,92vw)}
.ft-stage .rv-tk{aspect-ratio:1.55/1}
.ft-stage .rv-tk .in{background:radial-gradient(circle at 50% 55%,#FFF6DC,#FFFBF2 70%)}
.ft-in-no{position:absolute;left:1rem;top:.75rem;font-family:var(--ft-hand);font-size:.95rem;color:#A88B74}
.ft-in-g{font-family:var(--ft-hand);font-size:clamp(4.4rem,22vw,6.4rem);line-height:1;color:var(--ft-red);-webkit-text-stroke:2px #7E0014;paint-order:stroke fill;letter-spacing:.02em}
.ft-in-sub{font-family:var(--ft-hand);font-size:1rem;color:#8A6F5E;margin-top:.1rem}
.ft-stage .rv-tk.glow .ft-in-g{animation:ftGlow 1.1s ease-in-out infinite alternate}
@keyframes ftGlow{0%{text-shadow:0 0 0 rgba(246,215,122,0)}100%{text-shadow:0 0 22px rgba(246,215,122,1),0 0 44px rgba(246,215,122,.7)}}
.ft-tear-help{color:#F6E7C3;text-align:center;font-size:.92rem;line-height:1.6}
.ft-tear-help b{color:var(--ft-gold-2)}
.ft-tear-row{display:flex;gap:.5rem}
.ft-tear-row .btn{border-radius:999px}
.ft-confetti{position:fixed;inset:0;pointer-events:none;z-index:calc(var(--z-modal,1000) + 6);overflow:hidden}
.ft-confetti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:ftFall linear forwards}
@keyframes ftFall{to{transform:translateY(105vh) rotate(720deg);opacity:.9}}
@media (prefers-reduced-motion:reduce){.ft-rawoo-tear,.ft-result.pop,.ft-result.pop .ft-r-pose,.ft-cand{animation:none}}
@media (max-width:420px){.ft-grid{gap:5px}.ft-board{padding:12px 8px 14px}.ft-rawoo-tear{width:56px;left:-2px;top:-34px}.ft-btns .btn{font-size:.82rem}}
/* 사주 풀이 (2026-11-01) — 동의 카드와 결과 카드 안의 풀이 칸 */
.ft-row[hidden],.ft-saju[hidden]{display:none}
.ft-saju{margin:.9rem 0 .2rem;padding:.9rem 1rem;border-radius:14px;background:linear-gradient(#FFF3F3,#FFF8EC);border:2px solid #E7B7B7}
.ft-saju-hd{display:flex;align-items:center;gap:.4rem;font-size:1.02rem}
.ft-saju-hd b{color:var(--ft-red)}
.ft-saju-chips{display:flex;flex-wrap:wrap;gap:.35rem;margin:.5rem 0 .4rem}
.ft-saju-chips span{font-size:.76rem;font-weight:800;color:#7A5A49;background:#fff;border:1.5px solid #EBD6AE;border-radius:999px;padding:.12rem .55rem}
.ft-saju p{margin:.25rem 0;line-height:1.55;font-weight:700}
.ft-saju .ft-saju-rel{font-size:.86rem;font-weight:600;color:#8A6F5E}
.ft-saju-luck{display:flex;gap:1rem;margin-top:.45rem;font-size:.86rem;color:#7A5A49}
.ft-saju-luck b{color:var(--ft-ink)}
.ft-sajuopt{display:flex;align-items:center;gap:.8rem;margin:1.4rem 0 0;padding:.85rem 1rem;border-radius:16px;background:#FFF6F0;border:2px solid #F0C9BE}
.ft-sajuopt.on{background:#F6FBF3;border-color:#BFE0B5}
.ft-sajuopt-t{flex:1;min-width:0}
.ft-sajuopt-t b{display:block;font-size:.98rem}
.ft-sajuopt-t small{display:block;margin-top:.2rem;font-size:.78rem;line-height:1.5;color:#8A6F5E}
.ft-sajuopt .btn{flex:none;white-space:nowrap}
.ft-sajuopt:not(.on) .btn{background:var(--ft-red);color:#fff;border-color:#8C0016}
/* 행운 숫자 — 끝자리 + 열린 판별 번호 (2026-11-01) */
.ft-lucky>div{flex:1;min-width:0}
.ft-digit{display:inline-grid;place-items:center;min-width:1.7em;height:1.7em;margin-left:.15rem;border-radius:50%;background:var(--ft-red);color:#fff;font-family:var(--ft-hand);font-size:1.05em;vertical-align:-.15em}
.ft-picks{display:flex;flex-direction:column;gap:.3rem;margin-top:.45rem}
.ft-picks:empty{display:none}
.ft-picks a{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.4rem .65rem;border-radius:10px;background:#FFF4DE;border:1.5px solid #EBD6AE;color:var(--ft-ink);text-decoration:none;font-size:.86rem}
.ft-picks a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7A5A49;font-weight:700}
.ft-picks a b{flex:none;font-family:var(--ft-hand);font-weight:400;font-size:1.1rem;color:var(--ft-red)}
.ft-picks a b::after{content:" ›";color:#B9A08B}
.ft-picks a:hover{border-color:var(--ft-gold)}
/* 대흉 (2026-11-01) — 무섭지 않게 '액땜 완료' 도장 */
.ft-tk.torn .g.g5{color:#5B4A7A}
.ft-faces{gap:.2rem}
.ft-faces span{width:58px}
.ft-faces span img{width:46px;height:46px}
.ft-faces span:nth-child(5) em{background:#5B4A7A}
.ft-cands{gap:.35rem}
.ft-cand{width:66px}
.ft-cand img{width:46px;height:46px}
.ft-cand b{font-size:.92rem}
.ft-stamp{display:none;position:absolute;right:16px;top:58px;width:84px;height:84px;border-radius:50%;border:4px solid rgba(184,0,31,.8);color:rgba(184,0,31,.85);
  font-family:var(--ft-hand);font-size:1.15rem;line-height:1.05;text-align:center;display:none;place-items:center;transform:rotate(-14deg);background:rgba(255,251,242,.6)}
.ft-result.bad .ft-stamp{display:grid}
.ft-result.bad.pop .ft-stamp{animation:ftStamp .5s .9s cubic-bezier(.3,1.6,.5,1) both}
@keyframes ftStamp{0%{transform:rotate(-14deg) scale(2.4);opacity:0}100%{transform:rotate(-14deg) scale(1);opacity:1}}
.ft-result.bad .ft-r-grade{color:#5B4A7A;-webkit-text-stroke-color:#2E2340}
@media (max-width:380px){.ft-faces span{width:52px}.ft-faces span img{width:40px;height:40px}.ft-cand{width:58px}}