/* B급 포스터 톤(카드뉴스) — 홈 밖 화면(/deep · /night-market · /me · 인앱 오라클)을 홈과 같은 말투로 맞춰요.
   규칙(홈의 .home-featured 와 같은 문법): 2px 진한 외곽선(#2b2436) · 딱딱한 오프셋 그림자 · 기울어진 스티커 라벨 · 파스텔 종이 바탕 · 큼직한 글자.
   기능·마크업은 그대로고 이 파일은 겉모습만 덮어써요(기존 CSS 뒤에 불러요). 움직임 줄이기에서는 기울임·전환을 끄고, 글자 대비는 기존보다 낮추지 않아요.
   범위: body.bp-deep(/deep) · body.bp-market(/night-market) · body.bp-me(/me) · #v-oracle/.tarot(인앱 오라클). */
:root{--bp-ink:#2b2436;--bp-yellow:#ffe46b;--bp-pink:#ffb7d1;--bp-mint:#bdecd6;--bp-lav:#dccffb;--bp-peach:#ffd5b6;--bp-paper:#fffaf2;
  --bp-shadow:4px 5px 0 rgba(43,36,54,.22);--bp-shadow-lg:7px 8px 0 rgba(43,36,54,.16)}
/* ── 공용 조각 ── */
.bp-sticker{display:inline-block;padding:4px 9px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow);color:var(--bp-ink);font-size:11px;font-weight:900;letter-spacing:-.02em;box-shadow:2px 3px 0 rgba(43,36,54,.18);transform:rotate(-2deg)}
.bp-grid-paper{background-color:var(--bp-paper);background-image:linear-gradient(0deg,rgba(43,36,54,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(43,36,54,.025) 1px,transparent 1px);background-size:7px 7px,9px 9px}

/* ═════════ /deep — 심층편 영물 타로 ═════════ */
body.bp-deep{background:#fff6ea}
body.bp-deep .hero{border:2px solid var(--bp-ink);border-radius:24px;box-shadow:var(--bp-shadow-lg);background:linear-gradient(0deg,rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(150deg,#2a1d4a,#44307a 70%,#2c4d6e);background-size:7px 7px,9px 9px,100% 100%;padding-top:34px}
body.bp-deep .hero .eyebrow{display:inline-block;padding:4px 10px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow);color:var(--bp-ink);font-size:11px;font-weight:900;letter-spacing:-.02em;transform:rotate(-2deg);box-shadow:2px 3px 0 rgba(0,0,0,.3)}
body.bp-deep .hero h1{font-size:34px;font-weight:400;text-shadow:3px 4px 0 rgba(0,0,0,.28)}
body.bp-deep .hero h1 em{display:inline-block;margin-top:6px;padding:2px 10px;border:2px solid var(--bp-ink);border-radius:10px;background:var(--bp-yellow);color:var(--bp-ink);font-style:normal;transform:rotate(-1.5deg);box-shadow:3px 4px 0 rgba(0,0,0,.3);text-shadow:none}
body.bp-deep .stat{border:2px solid var(--bp-ink);border-radius:12px;background:#fffaf2;color:#2b2436;box-shadow:2px 3px 0 rgba(0,0,0,.25)}
body.bp-deep .stat b{color:#2b2436}
body.bp-deep .stat-collection span{color:#5d5368}
body.bp-deep .pull-panel{border:2px solid var(--bp-ink);border-radius:20px;background-color:var(--bp-paper);background-image:linear-gradient(0deg,rgba(43,36,54,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(43,36,54,.025) 1px,transparent 1px);background-size:7px 7px,9px 9px;box-shadow:var(--bp-shadow-lg)}
body.bp-deep .pull-top h2{font-size:21px;letter-spacing:-.03em}
body.bp-deep .count-pill{padding:4px 9px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;transform:rotate(2deg);box-shadow:2px 3px 0 rgba(43,36,54,.18)}
body.bp-deep .primary{border:2px solid var(--bp-ink);border-radius:14px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;box-shadow:4px 5px 0 rgba(43,36,54,.28);transition:transform .12s,box-shadow .12s}
body.bp-deep .primary:active{transform:translate(2px,3px);box-shadow:2px 2px 0 rgba(43,36,54,.28)}
body.bp-deep .secondary{border:2px solid var(--bp-ink);background:#fff;color:var(--bp-ink);box-shadow:3px 4px 0 rgba(43,36,54,.18)}
body.bp-deep .section-head h2{font-size:22px;letter-spacing:-.03em}
body.bp-deep .filter{border:2px solid var(--bp-ink);border-radius:10px;color:var(--bp-ink);font-weight:800;box-shadow:2px 3px 0 rgba(43,36,54,.14)}
body.bp-deep .filter[aria-pressed="true"]{background:var(--bp-ink);color:#fff;transform:rotate(-1deg)}
body.bp-deep .search{border:2px solid var(--bp-ink);border-radius:12px;box-shadow:2px 3px 0 rgba(43,36,54,.14)}
body.bp-deep .grid>*{border-radius:12px;box-shadow:3px 4px 0 rgba(43,36,54,.2)}
body.bp-deep .tile .card-label{border:2px solid var(--bp-ink);background:var(--bp-yellow)!important;color:var(--bp-ink)!important;transform:rotate(-2deg);box-shadow:1px 2px 0 rgba(0,0,0,.35)}
body.bp-deep .pick-card{border-radius:14px;box-shadow:3px 4px 0 rgba(43,36,54,.28)}
body.bp-deep .pick-card .face .position-tag,body.bp-deep .reading .slot{border:2px solid var(--bp-ink);background:var(--bp-yellow);color:var(--bp-ink);font-weight:900}
body.bp-deep .reading{border:2px solid var(--bp-ink);border-radius:18px;background:#fffdf6;color:var(--bp-ink);box-shadow:4px 5px 0 rgba(43,36,54,.2)}
body.bp-deep .dialog{border:2px solid var(--bp-ink);border-radius:22px;box-shadow:6px 8px 0 rgba(0,0,0,.35)}

/* ═════════ /night-market — 야시장 ═════════ */
body.bp-market .hero{border:2px solid #f5e6c2;border-radius:24px;box-shadow:6px 7px 0 rgba(0,0,0,.4)}
body.bp-market .hero .eyebrow{display:inline-block;padding:4px 10px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;transform:rotate(-2deg);box-shadow:2px 3px 0 rgba(0,0,0,.35)}
body.bp-market .sec-title *{color:var(--bp-ink)!important}
body.bp-market .sec-title{display:inline-block;margin-bottom:12px;padding:3px 10px;border:2px solid var(--bp-ink);border-radius:9px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;transform:rotate(-1deg);box-shadow:2px 3px 0 rgba(0,0,0,.35)}
body.bp-market .today,body.bp-market .week,body.bp-market .coll{border:2px solid #f5e6c2;border-radius:20px;box-shadow:5px 6px 0 rgba(0,0,0,.32)}
body.bp-market .tents{gap:16px}
body.bp-market .tent{min-height:104px;padding:22px 14px 14px;border:2px solid var(--bp-ink);border-radius:18px;background:#fff7ea;color:var(--bp-ink);box-shadow:5px 6px 0 rgba(0,0,0,.4);transition:transform .12s,box-shadow .12s}
body.bp-market .tent:active{transform:translate(2px,3px);box-shadow:2px 3px 0 rgba(0,0,0,.4)}
body.bp-market .tent b{color:var(--bp-ink);font-size:17px;letter-spacing:-.03em}
body.bp-market .tent small{color:#5d5368;font-size:12.5px;font-weight:700}
body.bp-market .tent .ico{display:grid;place-items:center;width:54px;height:54px;border:2px solid var(--bp-ink);border-radius:16px;background:color-mix(in srgb,var(--awn,#ffb347) 55%,#fff);font-size:28px;box-shadow:2px 3px 0 rgba(43,36,54,.25);transform:rotate(-3deg)}
body.bp-market .tent .st{padding:4px 8px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;font-size:11px;transform:rotate(2deg)}
body.bp-market .tent .st[data-state="soon"]{background:#e9e1f5}
body.bp-market .tent:nth-child(odd){transform:rotate(-.6deg)}
body.bp-market .tents li:nth-child(even) .tent{transform:rotate(.6deg)}

/* ═════════ /me — 내 기록 ═════════ */
body.bp-me{background:var(--bp-paper)}
body.bp-me .card,body.bp-me section.card,body.bp-me .panel{border:2px solid var(--bp-ink);border-radius:20px;background-color:#fff;box-shadow:var(--bp-shadow-lg)}
body.bp-me h1{display:inline-block;margin:22px 0 8px;padding:2px 12px;border:2px solid var(--bp-ink);border-radius:12px;background:var(--bp-yellow);font-size:28px;letter-spacing:-.05em;transform:rotate(-1.2deg);box-shadow:3px 4px 0 rgba(43,36,54,.2)}
body.bp-me .brand{font-weight:900}
body.bp-me .ghost{border:2px solid var(--bp-ink);border-style:solid;border-radius:10px;background:var(--bp-lav);color:var(--bp-ink);font-weight:800;box-shadow:2px 3px 0 rgba(43,36,54,.16)}
body.bp-me .bar{height:14px;border:2px solid var(--bp-ink);background:#fff}
body.bp-me .bar>*{background:var(--bp-pink)}
body.bp-me .danger{border:2px solid #b3382a;box-shadow:3px 4px 0 rgba(179,56,42,.2)}
body.bp-me textarea{border:2px solid var(--bp-ink);border-radius:12px}
body.bp-me .empty .big,body.bp-me .empty svg,body.bp-me .empty img{transform:rotate(-4deg)}
body.bp-me .btn,body.bp-me button.primary{border:2px solid var(--bp-ink);border-radius:13px;box-shadow:3px 4px 0 rgba(43,36,54,.24);font-weight:900}
body.bp-me .btn.primary,body.bp-me .primary{background:var(--bp-yellow);color:var(--bp-ink)}

/* ═════════ 인앱 오라클(그림자·날씨·묘약·문·별빛·식물) ═════════ */
#v-oracle .oracle-intro,#v-botany .oracle-intro{position:relative;padding-top:14px}
#v-oracle .oracle-hero,#v-botany .oracle-hero{width:100%;max-width:340px;height:auto;aspect-ratio:16/10;object-fit:cover;border:2px solid var(--bp-ink);border-radius:20px;box-shadow:var(--bp-shadow-lg);transform:rotate(-1deg)}
#v-oracle .oracle-intro .ih,#v-botany .oracle-intro .ih{display:inline-block;margin:-26px auto 8px;position:relative;z-index:2;padding:6px 12px;border:2px solid var(--bp-ink);border-radius:12px;background:#fff;box-shadow:3px 4px 0 rgba(43,36,54,.2);transform:rotate(1.5deg);font-size:23px;font-weight:900;letter-spacing:-.05em}
#v-oracle .oracle-intro>p,#v-botany .oracle-intro>p{max-width:34em;margin-left:auto;margin-right:auto}
#v-oracle .whenbox,#v-botany .whenbox{border:2px solid var(--bp-ink);border-radius:14px;background:#fff6c2;box-shadow:3px 4px 0 rgba(43,36,54,.16);transform:rotate(-.6deg)}
#v-oracle .whenbox b,#v-botany .whenbox b{color:var(--bp-ink)}
#v-oracle #oracleStart,#v-botany #botanyStart{border:2px solid var(--bp-ink);border-radius:16px;background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;box-shadow:4px 5px 0 rgba(43,36,54,.28);transition:transform .12s,box-shadow .12s}
#v-oracle #oracleStart:active,#v-botany #botanyStart:active{transform:translate(2px,3px);box-shadow:2px 2px 0 rgba(43,36,54,.28)}
/* 뽑기 상자(.tarot): 밤 포스터 — 어두운 속은 그대로 두고 겉틀·글자·단추를 B급 포스터 말투로 */
.tarot{border:2px solid var(--bp-ink);box-shadow:var(--bp-shadow-lg)}
.tarot .t-eyebrow{display:block;width:fit-content;margin-left:auto;margin-right:auto;padding:4px 10px;border:2px solid var(--bp-ink);border-radius:8px;background:var(--bp-yellow)!important;color:var(--bp-ink)!important;font-weight:900;letter-spacing:.02em;transform:rotate(-2deg);box-shadow:2px 3px 0 rgba(0,0,0,.35)}
.tarot .btn.gold{border:2px solid var(--bp-ink);background:var(--bp-yellow)!important;color:var(--bp-ink)!important;font-weight:900;box-shadow:4px 5px 0 rgba(0,0,0,.4)}
.tarot .btn.ghost{border:2px solid #f5e6c2;box-shadow:3px 4px 0 rgba(0,0,0,.35)}
.tarot .ac{border-radius:6px;box-shadow:2px 3px 0 rgba(0,0,0,.45)}
.tarot h2{text-shadow:3px 4px 0 rgba(0,0,0,.35)}
.tarot .pcrow .tc{border:2px solid #fff3c0;border-radius:12px;box-shadow:4px 5px 0 rgba(0,0,0,.5)}
.tarot .pcrow .tc .f small,.tarot .pcrow .tc .f .slot-tag{border:2px solid var(--bp-ink);background:var(--bp-yellow);color:var(--bp-ink);font-weight:900;box-shadow:2px 2px 0 rgba(0,0,0,.35)}
.tarot .taste,.tarot .peek,.tarot .lock{border:2px solid rgba(255,228,107,.75);border-radius:14px;box-shadow:3px 4px 0 rgba(0,0,0,.4)}
.tarot .reveal{border:2px solid #f5e6c2;border-radius:16px;box-shadow:4px 5px 0 rgba(0,0,0,.45)}

/* ═════════ 인앱 도감(#v-dex) — 스티커 앨범 ═════════ */
#v-dex .intro .big{display:inline-block;transform:rotate(-4deg);filter:drop-shadow(3px 4px 0 rgba(43,36,54,.22))}
#v-dex .intro .ih{display:inline-block;padding:4px 12px;border:2px solid var(--bp-ink);border-radius:12px;background:var(--bp-yellow);box-shadow:3px 4px 0 rgba(43,36,54,.2);transform:rotate(-1.2deg);letter-spacing:-.05em}
#v-dex .dxbar{height:16px;border:2px solid var(--bp-ink);border-radius:99px;background:#fff;overflow:hidden}
#v-dex .dxbar>i{background:var(--bp-pink)!important}
#v-dex .dxtools .chip,#v-dex .dxjump .chip,#v-dex .chip{border:2px solid var(--bp-ink);border-radius:10px;font-weight:800;box-shadow:2px 3px 0 rgba(43,36,54,.14)}
#v-dex .dxh{border:2px solid var(--bp-ink)!important;border-radius:14px!important;box-shadow:3px 4px 0 rgba(43,36,54,.18)}
#v-dex .dxcard{border:2px solid var(--bp-ink);border-radius:14px;box-shadow:3px 4px 0 rgba(43,36,54,.2)}
#v-dex .dxcard.lock,#v-dex .dxcard[data-lock],#v-dex .dxcard.empty{border:2px dashed var(--bp-ink);background:repeating-linear-gradient(45deg,#fff4dc,#fff4dc 8px,#ffeccb 8px,#ffeccb 16px);box-shadow:none}
#v-dex .dxrecent{border:2px solid var(--bp-ink);border-radius:14px;background:#fff6c2;box-shadow:3px 4px 0 rgba(43,36,54,.16);transform:rotate(-.4deg)}
@media (prefers-reduced-motion:reduce){#v-dex .intro .big,#v-dex .intro .ih,#v-dex .dxrecent{transform:none}}
@media (prefers-reduced-motion:reduce){
  .bp-sticker,body.bp-deep .hero .eyebrow,body.bp-deep .hero h1 em,body.bp-deep .count-pill,body.bp-deep .filter[aria-pressed="true"],
  body.bp-market .hero .eyebrow,body.bp-market .sec-title,body.bp-market .tent,body.bp-market .tent .ico,body.bp-market .tent .st,body.bp-market .tents li .tent,
  #v-oracle .oracle-hero,#v-oracle .oracle-intro .ih,#v-oracle .whenbox,.tarot .t-eyebrow{transform:none!important}
  body.bp-deep .primary,body.bp-market .tent,#v-oracle #oracleStart,#v-botany #botanyStart{transition:none}
}