/* QR journey uses the original character, flower art and stage lighting. */
html.qr-entering body{overflow:hidden}html.qr-entering main,html.qr-entering header,html.qr-entering footer,html.qr-entering nav{visibility:hidden}
#opening[data-version=qr]{position:fixed;inset:0;display:grid;place-items:center;background:#09090c;overflow:hidden;isolation:isolate}
#opening[hidden]{display:none!important}
.qr-opening-scene{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.qr-burst-character{position:relative;width:min(49vw,260px);transform-origin:center 85%;animation:qr-daruma-burst 1.15s cubic-bezier(.2,.8,.3,1) both}
.qr-burst-character>.real-daruma,.qr-burst-character>svg{width:100%;height:auto;display:block}
.qr-head-flower{position:absolute;width:48%;height:48%;top:-24%;left:26%;z-index:2;transform-origin:50% 95%;animation:qr-flower-bloom .8s .95s cubic-bezier(.15,.9,.3,1.35) both}
.qr-head-flower .flower-art,.qr-head-flower img{width:100%;height:100%;object-fit:contain}
.qr-opening-title{position:absolute;top:71%;text-align:center;animation:qr-title .4s 1.6s both}
.qr-opening-title b{font-size:clamp(24px,5vw,42px);line-height:1.05;letter-spacing:-.04em}.qr-opening-title p{font-size:14px;margin:12px 0}
@keyframes qr-daruma-burst{0%{opacity:0;transform:translateY(65vh) scale(.3) rotate(-22deg)}40%{opacity:1;transform:translateY(-7vh) scale(1.15) rotate(9deg)}68%{transform:translateY(1vh) scale(.96) rotate(-5deg)}100%{transform:translateY(0) scale(1) rotate(0)}}
@keyframes qr-flower-bloom{from{opacity:0;transform:scale(0) rotate(-30deg)}65%{opacity:1;transform:scale(1.15) rotate(8deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes qr-title{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
#modal:has(.qr-result){padding:38px 24px 20px;width:min(94vw,720px);max-height:calc(100dvh - 32px);overflow:auto;isolation:isolate;background:#0c0c10}
.qr-result{padding:0;position:relative;isolation:isolate}.qr-result>.music-stage-lights{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;opacity:.45}
.fortune-result-summary{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-right:20px}
.result-daruma{padding:0;border:0;width:42px;flex:0 0 42px}.result-daruma svg{width:100%;height:46px}.result-flower{width:40px;height:50px;flex:0 0 40px}.result-flower img,.result-flower .flower-art{width:100%;height:100%;object-fit:contain}
.result-flower-name{font-size:16px;font-weight:700;margin:0;line-height:1.3}.result-flower-meaning{font-size:13px;margin:3px 0;line-height:1.4}.fortune-result-summary small{font-size:10px;color:#c4c0b6;display:block;line-height:1.4}
#modal .qr-result .music-message-static{margin:0;padding:10px 0 0;border-top:1px solid #585345}
#modal .qr-result h3.original-message{width:100%;max-width:100%;margin:12px 0 16px;font-size:clamp(28px,5vw,52px);line-height:1.35;letter-spacing:-.025em}
#modal .qr-result .phrase-line{max-width:none}
.qr-result .music-track{padding-top:10px;margin-top:0;gap:5px;animation:none}
.qr-result .music-track>div{min-width:0}.qr-result .field-label{font-size:9px;line-height:1.4;letter-spacing:.06em}
.qr-result .music-track p{margin:2px 0!important;line-height:1.35}.qr-result .song-title{font-size:clamp(16px,4.6vw,23px);overflow-wrap:break-word;word-break:normal}.qr-result .artist-text{font-size:13px;overflow-wrap:break-word;word-break:normal}.qr-result .artist-kana{display:block;font-size:11px;margin-top:2px}
.qr-result .music-player{padding:12px 0 0;border:0;margin:0}.qr-result .music-player>.eyebrow{display:none}.qr-result .service-links{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}.qr-result .service-link{display:flex;align-items:center;justify-content:center;min-width:0;min-height:46px;padding:10px 8px;font-size:12px;white-space:normal;line-height:1.3}.qr-result .service-icon{width:18px;height:18px;flex-shrink:0}.qr-result #youtube-status{font-size:11px;margin:6px 0;line-height:1.5}.qr-result .music-options{margin:6px 0 0}.qr-result .music-options button{font-size:11px;min-height:36px;padding:6px 0;border:0}
.result-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid #343434;padding-top:8px;margin-top:4px}.result-actions .lime{font-size:12px;min-height:42px;margin:0;padding:10px 12px}.result-saved{font-size:10px;line-height:1.4;color:#bdb7a4;margin:0}
.fortune-journey .color-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.fortune-journey .color-options button{min-width:0;display:flex;gap:6px;align-items:center;justify-content:center;min-height:70px;padding:8px 5px;font-size:13px}.fortune-journey .color-options small{display:block;font-size:10px;margin-top:3px}.fortune-journey .color-options i{width:18px;height:18px;flex-shrink:0}.fortune-journey>p{font-size:13px;line-height:1.7}.fortune-journey h2{font-size:clamp(22px,5.5vw,30px)}
nav.mobile{grid-template-columns:1fr 1fr 1fr}nav.mobile a{display:flex;align-items:center;justify-content:center;min-height:48px;font-size:12px}
@media(max-width:650px){#modal:has(.qr-result){width:calc(100vw - 16px);max-width:none;max-height:calc(100dvh - 16px);padding:38px 16px 14px;margin:auto}#modal .qr-result h3.original-message{font-size:clamp(27px,8.4vw,38px);margin:12px 0 14px;line-height:1.38}.fortune-result-summary{margin-bottom:8px}.qr-result .music-track{gap:4px}.qr-result .music-player{padding-top:10px}}
@media(max-width:360px),(max-height:680px){#modal:has(.qr-result){padding:32px 12px 10px}.fortune-result-summary{gap:7px;margin-bottom:6px}.result-daruma,.result-flower{width:32px;flex-basis:32px;height:40px}.result-daruma svg{height:38px}#modal .qr-result h3.original-message{font-size:clamp(25px,8vw,34px);margin:9px 0 11px}.qr-result .artist-kana{display:none}.qr-result .music-track{gap:2px}.qr-result .service-link{font-size:11px}.result-actions{gap:6px}}
@media(prefers-reduced-motion:reduce){.qr-burst-character,.qr-head-flower,.qr-opening-title{animation:none!important}.qr-result .music-stage-lights{display:none}}
#modal .qr-result .music-player .service-links .service-link{font-size:12px;min-height:46px;padding:10px 7px;gap:6px;white-space:nowrap}
#modal .qr-result h3.original-message{animation:none!important;transform:none!important;opacity:1}
.journey-language{display:block;margin:0 0 10px auto;min-height:36px;padding:6px 10px;font-size:11px}
#modal .qr-result>.journey-language{position:absolute;right:0;top:-29px;margin:0;min-height:28px;padding:3px 7px}
#modal:has(.qr-result)>.close{z-index:4}
#modal .qr-result>.journey-language{right:48px}
@media(max-width:360px){#modal .qr-result .music-player .service-links .service-link{font-size:11px;padding:9px 5px;gap:5px}}
.fortune-result-summary>div:last-child{min-width:0;overflow-wrap:break-word}
/* Three-second impact opening. Only the existing character and flower originals are used. */
#opening[data-version=qr-impact]{position:fixed;inset:0;width:100vw;height:100dvh;display:block;z-index:1000;background:#060608;overflow:hidden;isolation:isolate;perspective:760px}
#opening[data-version=qr-impact][data-revealing=true]{background:transparent}
.qr-depth-stage{position:absolute;inset:0;display:grid;place-items:center;perspective:760px;animation:qr-stage-clear 3s linear both}
.qr-flight{width:min(68vw,340px);transform-style:preserve-3d;animation:qr-weight-flight 3s both;will-change:transform,opacity}
.qr-shake{position:relative;transform-origin:50% 83%;animation:qr-comic-shake 3s linear both}
.qr-shake>.real-daruma{display:block;width:100%;height:auto;animation:none!important;filter:drop-shadow(0 20px 14px #0008)}
.qr-impact-flower{position:absolute;z-index:2;width:74%;height:74%;left:13%;top:-34%;transform-origin:50% 85%;animation:qr-flower-impact 3s linear both}
.qr-impact-flower .flower-art,.qr-impact-flower img{width:100%;height:100%;object-fit:contain;animation:none!important}
.qr-floor-shadow{position:absolute;top:68%;left:24%;width:52%;height:30px;border-radius:50%;background:#ad93c329;filter:blur(14px);animation:qr-weight-shadow 3s linear both}
.qr-impact-caption{position:absolute;left:5%;right:5%;bottom:17%;text-align:center;font-size:14px;letter-spacing:.08em;color:#e8e4d9;margin:0;animation:qr-caption-out 3s linear both}
.qr-impact-controls{position:absolute;left:16px;right:16px;bottom:max(22px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;gap:12px;z-index:5}
.qr-impact-controls button{font-size:12px;min-height:44px;padding:10px 14px;border:1px solid #9a9380;background:#111e;color:#f5eedc;backdrop-filter:none}
.qr-impact-controls button:disabled{opacity:.75;cursor:default}
.qr-petal-flight{position:absolute;inset:0;overflow:hidden;perspective:650px;pointer-events:none;transform-style:preserve-3d}
.qr-flying-petal{position:absolute;left:50%;top:37%;display:block;width:var(--petal-size);height:calc(var(--petal-size)*1.45);margin-left:calc(var(--petal-size)*-.5);border-radius:85% 12% 80% 20%;background:linear-gradient(130deg,#fff7,var(--petal-color) 38%,var(--petal-color));opacity:0;animation:qr-petal-to-lens 1.36s calc(1.64s + var(--petal-delay)) cubic-bezier(.12,.35,.34,1) both;will-change:transform,opacity}
.qr-flying-petal.petal-near{filter:blur(1px);z-index:2}
.qr-petal-cover{position:absolute;inset:-10%;pointer-events:none;overflow:hidden}
.qr-petal-cover i{position:absolute;top:10%;left:calc(-20% + var(--cover-index)*23%);width:68%;height:95%;border-radius:75% 15% 75% 20%;background:var(--cover-color);transform-origin:50% 50%;animation:qr-petal-wipe 3s linear both;--cover-rotation:calc(-32deg + var(--cover-index)*19deg)}
@keyframes qr-weight-flight{0%{opacity:0;transform:translate3d(0,-5vh,-1050px) scale(.25) rotate(-12deg)}5%{opacity:.25}20%{opacity:1;transform:translate3d(0,1vh,45px) scale(1.12) rotate(5deg)}26%{transform:translate3d(0,2vh,-15px) scale(.94) rotate(-3deg)}31%{transform:translate3d(0,0,0) scale(1) rotate(0)}100%{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(0)}}
@keyframes qr-comic-shake{0%,29%{transform:none}31%{transform:translateX(-12px) rotate(-5deg)}33%{transform:translateX(13px) rotate(5deg)}35%{transform:translateX(-14px) rotate(-5deg)}37%{transform:translateX(13px) rotate(5deg)}39%{transform:translateX(-11px) rotate(-4deg)}41%{transform:translateX(10px) rotate(4deg)}43%{transform:translateX(-7px) rotate(-3deg)}45%{transform:translateX(5px) rotate(2deg)}47%,100%{transform:none}}
@keyframes qr-flower-impact{0%,47%{opacity:0;transform:scale(0) rotate(-20deg)}49%{opacity:1;transform:scale(1.28) rotate(7deg)}52%{opacity:1;transform:scale(.96) rotate(-3deg)}54%{opacity:1;transform:scale(1.08) rotate(0)}57%{opacity:0;transform:scale(1.5) rotate(5deg)}100%{opacity:0;transform:scale(1.5)}}
@keyframes qr-petal-to-lens{0%{opacity:0;transform:translate3d(0,0,-130px) rotate(0) scale(.12)}8%{opacity:1}55%{opacity:1}100%{opacity:0;transform:translate3d(var(--petal-x),var(--petal-y),520px) rotate(var(--petal-turn)) scale(1.4)}}
@keyframes qr-petal-wipe{0%,64%{opacity:0;transform:translateY(24vh) scale(.01) rotate(var(--cover-rotation))}72%{opacity:1;transform:translateY(0) scale(.85) rotate(var(--cover-rotation))}80%,85%{opacity:1;transform:translateY(0) scale(1.4) rotate(var(--cover-rotation))}100%{opacity:0;transform:translateY(45vh) scale(1.85) rotate(var(--cover-rotation))}}
@keyframes qr-stage-clear{0%,56%{opacity:1}70%,100%{opacity:0}}
@keyframes qr-weight-shadow{0%{opacity:0;transform:scale(.1)}20%{opacity:1;transform:scale(1.15)}28%{opacity:.6;transform:scale(.9)}35%,56%{opacity:.7;transform:scale(1)}70%,100%{opacity:0}}
@keyframes qr-caption-out{0%,50%{opacity:1}62%,100%{opacity:0}}
#opening[data-economy=true] .qr-flying-petal{filter:none;will-change:auto;animation-name:qr-petal-economy}
#opening[data-economy=true] .qr-floor-shadow{filter:none;opacity:.15}
@keyframes qr-petal-economy{0%{opacity:0;transform:translate(0,0) scale(.1)}10%{opacity:1}100%{opacity:0;transform:translate(var(--petal-x),var(--petal-y)) scale(2.7) rotate(var(--petal-turn))}}
#opening[data-quiet=true] .qr-flight,#opening[data-quiet=true] .qr-shake,#opening[data-quiet=true] .qr-impact-flower,#opening[data-quiet=true] .qr-depth-stage{animation:none!important;transform:none!important;opacity:1}
#opening[data-quiet=true] .qr-flight{width:min(42vw,180px)}
#opening[data-quiet=true] .qr-floor-shadow,#opening[data-quiet=true] .qr-petal-flight,#opening[data-quiet=true] .qr-petal-cover{display:none}
.opening-replay{font-size:11px;min-height:44px;margin:8px auto 0;display:block;padding:8px 12px;color:#c9c3b6}
@media(prefers-reduced-motion:reduce){#opening[data-version=qr-impact] *{animation:none!important;transform:none!important}.qr-petal-flight,.qr-petal-cover{display:none!important}}
/* Pop the blossom already painted on the approved character; do not add a new character or a whole flower stem. */
.qr-impact-flower{width:100%;height:100%;left:0;top:0;transform-origin:50% 43%;clip-path:polygon(10% 0,90% 0,90% 41%,83% 49%,17% 49%,10% 41%)}
.qr-impact-flower>img.real-daruma{display:block;width:100%;height:100%;object-fit:contain;animation:none!important}
@keyframes qr-flower-impact{0%,47%{opacity:0;transform:scale(0) rotate(-20deg)}49%,52%{opacity:1;transform:scale(1.45) rotate(5deg)}54%{opacity:1;transform:scale(1.22) rotate(-2deg)}57%{opacity:.65;transform:scale(1.6) rotate(4deg)}59%,100%{opacity:0;transform:scale(1.75) rotate(5deg)}}
.qr-impact-flower{clip-path:polygon(10% 0,90% 0,90% 36%,78% 42%,60% 44%,40% 44%,22% 42%,10% 36%)}

/* Keep the garden heading clear of the sticky site header. */
#garden{scroll-margin-top:84px}