/* 금빛 움직임 (2026-10-03): 첫 화면 붓글씨 제목·금가루·시작 단추 반짝임, 고민 카드 펼침, 기다리는 화면 십이지 원판, 결과 열릴 때 붉은 책.
   글자는 움직이지 않고, '움직임 줄이기'를 켠 기기에서는 모두 꺼진다. motion.js 가 html 에 .bh-motion 을 붙일 때만 움직인다. */
.bh-dust{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}

.bh-motion .landing h1{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 55%);mask-image:linear-gradient(90deg,#000 45%,transparent 55%);-webkit-mask-size:250% 100%;mask-size:250% 100%;-webkit-mask-position:0 0;mask-position:0 0;animation:bh-brush 1.7s cubic-bezier(.5,0,.3,1) .15s both}
.bh-motion .landing h1 em{background:linear-gradient(100deg,#e8b860 0%,#f6d896 30%,#fff6d8 46%,#f6d896 62%,#e8b860 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;animation:bh-sheen 6s ease-in-out 2.2s infinite}
@keyframes bh-brush{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 0;mask-position:0 0}}
@keyframes bh-sheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}

.bh-motion .landing-start{position:relative;overflow:hidden;isolation:isolate}
.bh-motion .landing-start::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,#ffffffb0 48%,transparent 66%);transform:translateX(-120%);animation:bh-shine 5s ease-in-out 1.8s infinite;pointer-events:none}
@keyframes bh-shine{0%{transform:translateX(-120%)}30%,100%{transform:translateX(120%)}}

.bh-motion .landing-topic.bh-in{animation:bh-fan .7s cubic-bezier(.3,1.3,.5,1) both;animation-delay:calc(var(--bh-i,0) * 70ms)}
@keyframes bh-fan{from{opacity:0;transform:translateY(28px) rotate(-6deg)}to{opacity:1;transform:none}}

/* 기다리는 화면: 기존 불빛 세 개 자리에 원판을 넣는다(오류 화면에서 그 자리가 숨으면 원판도 같이 숨음) */
.reading-wait .wait-lights.bh-has-wheel{display:block;width:auto;height:auto;margin:14px auto 4px;background:none;box-shadow:none}
.reading-wait .wait-lights.bh-has-wheel>i{display:none}
.bh-wheel{position:relative;width:min(240px,64vw);aspect-ratio:1;max-width:100%;margin:0 auto}
.bh-wheel svg{display:block;width:100%;height:100%;filter:drop-shadow(0 0 16px #e5bd7959)}
.bh-motion .bh-wheel svg{animation:bh-spin 26s linear infinite}
@keyframes bh-spin{to{transform:rotate(360deg)}}
.bh-hub{position:absolute;inset:33%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#6b2433 0%,#551b25 60%,#3a121a 100%);border:2px solid #e5bd79;box-shadow:inset 0 0 22px #e5bd7973;color:#fff3c9;font:800 13px/1.35 var(--serif,serif);text-align:center}
.bh-hub b{font-size:21px}
/* 정임 할머니 방: 원판 대신 장부 영상(2026-10-08). 그림이 먼저, 영상은 재생될 때 서서히 */
.bh-ledger{position:relative;width:min(240px,62vw);aspect-ratio:2/3;margin:0 auto;border-radius:14px;overflow:hidden;border:2px solid #d9b56f;background:#1c0f0b;box-shadow:0 0 26px #e5bd7947,0 14px 34px #0009}
.bh-ledger-still,.bh-ledger-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.bh-ledger-video{opacity:0;transition:opacity .6s ease}
.bh-ledger.is-playing .bh-ledger-video{opacity:1}
.bh-ledger-tag{position:absolute;left:50%;bottom:10px;z-index:2;transform:translateX(-50%);padding:4px 13px;border-radius:999px;border:1px solid #e5bd79;background:#2a140ed9;color:#fff3c9;font:800 14px/1.5 var(--serif,serif);white-space:nowrap}
@media (max-height:700px){.bh-ledger{width:min(200px,52vw)}}
.bh-say{margin:14px auto 0;max-width:22em;min-height:3.2em;font:700 18px/1.6 var(--serif,serif);color:#fff0d3;text-align:center;transition:opacity .45s}

/* 결과가 열릴 때: 붉은 책이 펼쳐지며 금빛이 퍼진 뒤 사라진다(눌러도 막지 않음) */
.bh-book{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,#2a140ee6,#120709f2);pointer-events:none;animation:bh-fade 2.6s ease-in both}
.bh-book-scene{position:relative;width:190px;height:250px;perspective:1000px}
.bh-book-pages{position:absolute;inset:5px 5px 5px 9px;border-radius:4px 10px 10px 4px;background:linear-gradient(90deg,#e9d7b4,#fbf0d9 12%,#f6e6c6);box-shadow:0 18px 40px #0008}
.bh-book-cover{position:absolute;inset:0;border-radius:4px 12px 12px 4px;background:linear-gradient(135deg,#7a1f2c,#4c121b 70%);box-shadow:inset 0 0 0 7px #5a1822,inset 0 0 0 9px #b8894a;transform-origin:left center;backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#e5bd79;font:800 12px var(--sans,sans-serif);letter-spacing:.2em;animation:bh-open 1.3s cubic-bezier(.6,.05,.25,1) .2s both}
.bh-book-cover b{font:900 30px/1.2 var(--serif,serif);color:#fff3c9;letter-spacing:.2em}
.bh-book-glow{position:absolute;inset:-70px;border-radius:50%;background:radial-gradient(circle,#ffe096f2 0%,#e5bd7973 30%,transparent 65%);opacity:0;animation:bh-burst 1.6s ease-out .8s both}
@keyframes bh-open{to{transform:rotateY(-165deg)}}
@keyframes bh-burst{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.3)}}
@keyframes bh-fade{0%,70%{opacity:1}100%{opacity:0}}

@media (prefers-reduced-motion:reduce){.bh-motion *,.bh-motion *::before,.bh-motion *::after{animation:none!important}.bh-book{display:none}}
