:root{--bg:#fdf3e1;--ink:#2b2233;--pink:#ff3d9a;--card:#fff;--r:16px;--safe-b:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#2b2233;color:var(--ink);font-family:"Hiragino Maru Gothic ProN","Hiragino Sans","Noto Sans JP","Noto Sans CJK JP",system-ui,sans-serif;overscroll-behavior:none}
#app{position:relative;max-width:480px;margin:0 auto;min-height:100dvh;background:var(--bg);display:flex;flex-direction:column;overflow-x:hidden;user-select:none;-webkit-user-select:none}
#layer{position:fixed;inset:0;pointer-events:none;z-index:50;max-width:480px;margin:0 auto}
#layer>*{pointer-events:auto}
#layer>.toast,#layer>.aha-fx,#layer>.confetti{pointer-events:none}
.loading{margin:auto}
h1,h2,h3{margin:.4em 0}
.small{font-size:13px;line-height:1.6}.tiny{font-size:11px;color:#776}
.btn{font:inherit;font-weight:800;font-size:16px;border:0;border-radius:999px;padding:12px 22px;background:var(--pink);color:#fff;box-shadow:0 4px 0 #b3165f;cursor:pointer;touch-action:manipulation;transition:transform .08s}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #b3165f}
.btn.ghost{background:#fff;color:var(--ink);box-shadow:0 3px 0 #d8c8b8;border:2px solid #eadccb}
.btn.big{font-size:20px;padding:16px 30px}.btn.huge{font-size:28px;padding:26px;width:100%;border-radius:24px}
.btn.small{font-size:14px;padding:8px 16px}.btn.danger{background:#fff;color:#c62828;border:2px solid #c62828;box-shadow:none}
.btn:disabled{opacity:.5}
.btn.calm{background:#9e9ac8;box-shadow:0 4px 0 #6f6aa0}
.pulse{animation:pulse 1.2s infinite}@keyframes pulse{50%{transform:scale(1.06)}}
.topbar{display:flex;align-items:center;gap:6px;padding:10px 12px;position:sticky;top:0;z-index:5;background:rgba(253,243,225,.92);backdrop-filter:blur(4px)}
.topbar .title{font-weight:900;font-size:17px}.topbar .title small{font-size:11px;font-weight:600;color:#998}
.topbar .spacer{flex:1}
.icon{font-size:20px;background:#fff;border:2px solid #eadccb;border-radius:12px;width:42px;height:42px;cursor:pointer}
/* ---- home ---- */
.room-wrap{position:relative;height:min(52dvh,420px);overflow:hidden}
.room{position:absolute;inset:0;width:100%;height:100%}
.room .mon{animation:mon 3s ease-in-out infinite}@keyframes mon{50%{opacity:.8}} /* v0.3: 0.8秒のパチパチ点滅→3秒のゆっくり */
.gaki-wrap{position:absolute;left:50%;bottom:6%;width:min(58vw,240px);transform:translateX(-50%);cursor:pointer}
.gaki-wrap .gaki{width:100%;display:block;animation:idle 2.4s ease-in-out infinite;transform-origin:50% 90%}
@keyframes idle{50%{transform:translateY(-6px) scaleY(1.02)}}
.gaki-ira1 .gaki-body,.gaki-ira2 .gaki-body{animation:shiver .25s infinite}
@keyframes shiver{50%{transform:translateX(2px)}}
.gaki-satori{filter:drop-shadow(0 0 12px #fff8c4)}
.g-spark{fill:#ffd400;animation:twinkle 1.6s ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.2}}
.g-float{animation:float 1.6s ease-in-out infinite}@keyframes float{50%{transform:translateY(-8px)}}
.g-aura{animation:spin 40s linear infinite;transform-origin:100px 105px}@keyframes spin{to{transform:rotate(360deg)}}
.boing .gaki{animation:boing .5s}@keyframes boing{30%{transform:scale(1.15,.85)}60%{transform:scale(.92,1.1)}}
.look-clock .gaki{animation:lookclock 7s ease-in-out infinite}
@keyframes lookclock{0%,80%,100%{transform:none}86%,94%{transform:rotate(-12deg) translateX(-6px)}}
.glance .gaki{animation:lookclock 2.4s ease-in-out 1}
.aha .gaki{animation:aha .6s 2}@keyframes aha{50%{transform:scale(1.2) rotate(6deg)}}
.prem .gaki{filter:saturate(1.3)}
.bubble{position:absolute;left:50%;top:7%;transform:translateX(-50%);background:#fff;border:3px solid var(--ink);border-radius:18px;padding:8px 14px;font-weight:800;font-size:15px;white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.bubble:after{content:"";position:absolute;left:50%;bottom:-12px;border:9px solid transparent;border-top-color:var(--ink);transform:translateX(-50%)}
.nameplate{position:absolute;left:10px;bottom:8px;background:rgba(255,255,255,.85);border-radius:10px;padding:3px 10px;font-size:13px;font-weight:700}
.home-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;padding:12px 14px;flex:1}
.flower-wrap{width:96px;height:96px}.flower{width:100%;height:100%;animation:spin 40s linear infinite}
.gauges{flex:1;min-width:160px;display:grid;gap:6px}
.g{display:grid;grid-template-columns:36px 1fr;align-items:center;font-size:12px;font-weight:800}
.g i{display:block;height:10px;border-radius:6px;transition:width .6s}
.g{background:linear-gradient(#0000,#0000)}.g>i{background:#ddd}
.home-bottom .play{width:100%}
.prep-badge{width:100%;text-align:center;font-size:13px;font-weight:800;color:#7e57c2;background:#ede7f6;border-radius:10px;padding:6px}
[data-slot=banner]{width:320px;height:50px}
.mdp-strip{display:flex;justify-content:center;padding:6px 0 calc(6px + var(--safe-b));background:#f3e6d2;margin-top:auto}
.mdp-slot-box{overflow:hidden;border-radius:6px;flex:none}
.mdp-slot-empty{background:transparent}
.mdp-pr{width:100%;height:100%;display:flex;align-items:center;gap:6px;padding:0 8px;background:#fff;border:2px solid var(--c);border-radius:6px;font-size:12px;white-space:nowrap;cursor:pointer}
.mdp-pr b{color:var(--c)}.mdp-pr small{color:#777;overflow:hidden;text-overflow:ellipsis}
.mdp-pr-tag{font-size:9px;font-weight:900;background:#555;color:#fff;border-radius:3px;padding:1px 4px}
/* ---- 全画面の枠（自社広告） ---- */
.mdp-sheet{position:absolute;inset:0;background:rgba(20,10,30,.85);display:flex;align-items:center;justify-content:center;animation:fadein .2s}
.mdp-sheet-x{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;width:48px;height:48px;border-radius:50%;border:0;background:#fff;font-size:22px;font-weight:900;cursor:pointer;z-index:2}
.mdp-pr-card{width:86%;max-width:360px;aspect-ratio:3/4;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;border:5px solid var(--c);position:relative}
.mdp-pr-card .mdp-pr-tag{position:absolute;top:12px;left:12px;font-size:11px}
.mdp-pr-h{font-weight:900;color:#fff;background:var(--c);padding:4px 16px;border-radius:999px;font-size:18px}
.mdp-pr-b{font-size:44px;font-weight:900;color:var(--c);line-height:1.15;animation:pulse 1.4s infinite}
.mdp-pr-f{font-size:13px;color:#555}
.mdp-pr-go{margin-top:4px}
@keyframes fadein{from{opacity:0}}
/* ---- select ---- */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px}
.gcard{font:inherit;text-align:left;border:3px solid var(--c);background:#fff;border-radius:var(--r);padding:12px;min-height:150px;display:flex;flex-direction:column;gap:4px;cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 60%,#000)}
.gc-icon{font-size:38px}.gc-name{font-weight:900;font-size:17px;color:var(--c)}.gcard small{font-size:11px;color:#666;line-height:1.4}
.gc-tol{margin-top:auto;font-size:12px;font-weight:800}
.gcard.fresh{background:radial-gradient(circle,#fff 0,color-mix(in srgb,var(--c) 30%,#fff) 70%);animation:glow 1.2s ease-in-out infinite;align-items:center;justify-content:center;text-align:center}
.gc-sil{font-size:48px;font-weight:900;color:var(--c);text-shadow:0 0 12px var(--c)}
@keyframes glow{50%{box-shadow:0 0 24px var(--c),0 4px 0 var(--c)}}
.gcard.reveal{animation:flip .5s}@keyframes flip{0%{transform:rotateY(90deg)}100%{transform:none}}
.gcard.mini{min-height:120px;width:110px;margin:auto}
/* ---- game common ---- */
.game-root{flex:1;display:flex;flex-direction:column}
.mg{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 14px 20px;position:relative}
.mg-help,.mg-rates{font-size:13px;text-align:center;background:#fff;border-radius:12px;padding:8px 12px;line-height:1.5}
.mg-rates small{color:#888}
.timebar{width:100%;height:10px;background:#e8dccc;border-radius:6px;overflow:hidden}.timebar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ff3d9a,#ffb300)}
.floattext{position:absolute;pointer-events:none;font-weight:900;font-size:22px;animation:floatup .9s forwards;color:#ff3d9a}
.floattext.bad{color:#999}.floattext.good{color:#3fbf7f}.floattext.heart{color:#ff4d6d;font-size:26px}
@keyframes floatup{to{transform:translateY(-50px);opacity:0}}
/* gacha */
.gacha-machine{width:62%;max-width:240px}.gacha-machine svg{width:100%;display:block}
.shake{animation:shake .12s infinite}@keyframes shake{25%{transform:translate(-4px,2px) rotate(-2deg)}75%{transform:translate(4px,-2px) rotate(2deg)}}
.g-handle.spin{animation:hspin .5s linear infinite;transform-box:fill-box;transform-origin:center}@keyframes hspin{to{transform:translate(100px,172px) rotate(360deg)}}
.gacha-stage{min-height:120px;display:flex;flex-direction:column;align-items:center;gap:6px}
.capsule{width:90px;height:90px;border-radius:50%;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-direction:column}
.capsule .cap-top,.capsule .cap-bot{position:absolute;left:0;right:0;height:50%;border:4px solid #222;transition:transform .4s}
.capsule .cap-top{top:0;border-radius:45px 45px 0 0;background:var(--rc)}
.capsule .cap-bot{bottom:0;border-radius:0 0 45px 45px;background:#fff}
.capsule small{position:absolute;bottom:-22px;white-space:nowrap;font-size:12px;font-weight:700}
.capsule.drop{animation:drop .6s cubic-bezier(.3,1.6,.6,1)}@keyframes drop{from{transform:translateY(-120px)}}
.capsule.r-UR{animation:drop .6s cubic-bezier(.3,1.6,.6,1);filter:drop-shadow(0 0 10px #fff)} /* v0.3: 1秒ごとの白い光り→光りっぱなし */
.capsule.open .cap-top{transform:translateY(-40px) rotate(-30deg)}.capsule.open .cap-bot{transform:translateY(20px)}.capsule.open small{display:none}
.gacha-reveal{text-align:center;animation:pop .5s}.gacha-reveal .rlabel{font-weight:900;font-size:28px}.gacha-reveal .iname{font-weight:900;font-size:20px}
.gacha-reveal.r-R .rlabel{color:#0288d1}.gacha-reveal.r-SR .rlabel{color:#f9a825;text-shadow:0 0 10px #ffe082}
.gacha-reveal.r-UR .rlabel{background:linear-gradient(90deg,red,orange,#cc0,green,blue,violet);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:40px}
@keyframes pop{0%{transform:scale(.2)}70%{transform:scale(1.2)}}
/* v0.3: 確定演出は「全画面の点滅」をやめ、画面を少し暗くして中央のカードに光の輪がゆっくり回る形へ（明滅なし） */
.kakutei{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:60;background:rgba(30,22,40,.55);animation:fadein .4s ease-out}
.k-card{position:relative;width:250px;height:250px;border-radius:32px;background:#fffaf0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.35);animation:kcard .5s cubic-bezier(.3,1.5,.6,1) both}
.k-ring{position:absolute;inset:-40%;animation:spin 6s linear infinite;opacity:.85}
.kakutei.ur .k-ring{background:conic-gradient(#ff8fa3,#ffd57a,#b8f0a0,#9fd8ff,#d3b0ff,#ff8fa3)}
.kakutei.sr .k-ring{background:conic-gradient(#ffe9a8,#ffc94a,#fff3cc,#ffc94a,#ffe9a8)}
.k-card::after{content:'';position:absolute;inset:14px;border-radius:22px;background:#fffaf0}
.k-card span,.k-card small{position:relative;z-index:1}
.k-card span{font-size:46px;font-weight:900;letter-spacing:2px;animation:pop .5s .1s both}
.kakutei.ur .k-card span{background:linear-gradient(90deg,#e8459b,#f2a600,#2ea84f,#2f7be8,#9b4de8);-webkit-background-clip:text;background-clip:text;color:transparent}
.kakutei.sr .k-card span{color:#d69400}
.k-card small{font-weight:800;font-size:13px;color:#7a6a5a;margin-top:6px}
@keyframes kcard{from{transform:scale(.6) rotate(-6deg);opacity:0}}
/* sampo */
.sampo-scene{position:relative;width:100%;height:260px;border-radius:16px;overflow:hidden;--off:0px}
.sampo-scene .sky{position:absolute;inset:0;background:linear-gradient(#ffe7c2,#bfe9ff 60%)}
.sampo-scene .sun{position:absolute;right:30px;top:24px;width:44px;height:44px;border-radius:50%;background:#ffd54f;box-shadow:0 0 30px #ffd54f}
.sampo-scene .hills{position:absolute;left:0;right:0;bottom:60px;height:90px;background:radial-gradient(ellipse at 20% 100%,#81c784 40%,transparent 41%),radial-gradient(ellipse at 70% 100%,#66bb6a 45%,transparent 46%);background-size:300px 90px;background-position:calc(var(--off) * -0.3) 0;transition:background-position .3s}
.sampo-scene .path{position:absolute;left:0;right:0;bottom:0;height:60px;background:repeating-linear-gradient(90deg,#d7b98a 0 40px,#cfae7c 40px 80px);background-position:calc(var(--off) * -1) 0;transition:background-position .3s}
.sampo-scene .walker{position:absolute;left:50%;bottom:30px;width:110px;transform:translateX(-50%)}
.sampo-scene .walker .gaki{width:100%;transition:transform .15s}.sampo-scene.stepL .walker .gaki{transform:rotate(-6deg) translateY(-4px)}.sampo-scene:not(.stepL) .walker .gaki{transform:rotate(6deg)}
.rhythm{position:absolute;left:10px;top:10px;background:#fff;border-radius:10px;padding:4px 10px;font-size:13px}
.feet{display:flex;gap:14px;width:100%;margin-top:auto}
.foot{flex:1;font:inherit;font-weight:900;font-size:26px;height:110px;border-radius:24px;border:0;background:#3fbf7f;color:#fff;box-shadow:0 5px 0 #23864f;touch-action:manipulation}
.foot:active{transform:translateY(4px);box-shadow:0 1px 0 #23864f}
/* nade */
.nade-area{position:relative;width:100%;max-width:340px;aspect-ratio:1;background:radial-gradient(#fff3e0,#ffe0b2);border-radius:50%;touch-action:none;cursor:grab}
.nade-area .gaki{width:80%;margin:10%;transition:transform .2s}
.nade-area.happy .gaki{transform:scale(1.05) rotate(-3deg)}.nade-area.nope .gaki{transform:translateX(8px)}
.nade-mood{position:absolute;top:8px;left:50%;transform:translateX(-50%);font-weight:900;color:#ff4d6d}
.meter{position:relative;width:100%;height:24px;background:#eee;border-radius:12px;overflow:hidden}.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffb74d,#ff4d6d);transition:width .2s}
.meter span{position:absolute;inset:0;text-align:center;font-size:12px;font-weight:800;line-height:24px}
/* renda */
.track{position:relative;width:100%;height:150px;background:linear-gradient(#bfe9ff 60%,#e57373 60%);border-radius:16px;overflow:hidden}
.runner{position:absolute;left:0;bottom:10px;width:80px;transition:left .1s}.runner .gaki{width:100%;animation:idle .3s infinite}
.wallline{position:absolute;top:0;bottom:0;left:calc((100% - 80px) * var(--w) + 40px);border-left:6px dashed #5d4037}.wallline span{position:absolute;top:4px;left:4px;font-size:11px;font-weight:900;white-space:nowrap;color:#5d4037}
.count{font-size:20px}.count b{font-size:48px}
.runners-high{background:radial-gradient(#fffdf6,#fff3d6)}
/* v0.3: 限界突破は「画面全体が白く光る」をやめ、文字の帯がすべりこむ形へ */
.highflash{position:absolute;left:0;right:0;top:34%;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:900;color:#ff8a00;-webkit-text-stroke:1.5px #5a2a00;background:linear-gradient(90deg,transparent,rgba(255,244,214,.95) 20%,rgba(255,244,214,.95) 80%,transparent);padding:6px 0;animation:hf 1.3s ease-out forwards;pointer-events:none;z-index:5}
@keyframes hf{0%{opacity:0;transform:translateX(-30px)}20%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0}}
/* ---- result ---- */
.result{display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px}
.res-label{font-weight:900;font-size:18px;text-align:center}
.rare-badge{margin-left:8px;background:linear-gradient(90deg,red,orange,#cc0,green,blue,violet);color:#fff;border-radius:8px;padding:2px 8px;font-size:13px}
.res-gaki{width:150px}.res-gaki .gaki{width:100%;animation:idle 2s infinite}
.deltas{width:100%;display:grid;gap:8px;background:#fff;border-radius:16px;padding:12px}
.dl{display:grid;grid-template-columns:40px 1fr 44px;align-items:center;gap:8px;font-weight:800}
.dl-bar{height:12px;background:#eee;border-radius:6px;overflow:hidden}.dl-bar i{display:block;height:100%;transition:width .8s}
.dl b{text-align:right}.dl b.up{color:#2e7d32}.dl b.down{color:#c62828}
.tol-note{font-size:13px;color:#8d6e63;margin:0}
.res-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}.res-btns [data-again]{grid-column:1/-1}
/* ---- cutin ---- */
.cutin{position:absolute;inset:0;background:rgba(20,10,30,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#fff;animation:fadein .2s;overflow:hidden}
.cutin.out{opacity:0;transition:opacity .25s}
.tap-next{position:absolute;bottom:calc(24px + var(--safe-b));opacity:.7}
.ci-burst{position:absolute;width:200vmax;height:200vmax;background:repeating-conic-gradient(var(--c) 0 10deg,transparent 10deg 20deg);opacity:.16;animation:spin 60s linear infinite} /* v0.3: しま模様の回転を遅く・薄く */
.ci-morph{position:relative;width:220px;height:220px}.ci-morph>div{position:absolute;inset:0}.ci-morph .gaki{width:100%}
.m-from{animation:mfrom 1.6s forwards}.m-to{opacity:0;animation:mto 1.6s forwards}
/* v0.3: 変身は「白く光る（明るさ5倍）」をやめ、ぼかしながら入れ替わる形へ */
@keyframes mfrom{0%,35%{opacity:1;transform:none;filter:none}65%,100%{opacity:0;transform:scale(1.3);filter:blur(6px)}}
@keyframes mto{0%,40%{opacity:0;transform:scale(.5);filter:blur(6px)}75%{opacity:1;transform:scale(1.12);filter:none}100%{opacity:1;transform:none}}
.ci-title{position:relative;font-size:38px;font-weight:900;text-align:center;line-height:1.1;-webkit-text-stroke:1px #000;animation:pop .6s 1s both}.ci-title span{font-size:22px}
.ci-sub{font-size:18px;font-weight:800;text-align:center}
.ci-recall .gaki{width:160px;filter:grayscale(.6) blur(1px);opacity:.8}
/* ---- modal / toast ---- */
.modal-bg{position:absolute;inset:0;background:rgba(20,10,30,.6);display:flex;align-items:center;justify-content:center;padding:16px;animation:fadein .15s}
.modal{background:#fff;border-radius:20px;padding:18px;width:100%;max-height:90dvh;overflow:auto;box-shadow:0 10px 40px #0006}
.modal h3{margin-top:0}
.modal-btns{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:14px}
.code{width:100%;height:110px;font:12px/1.4 ui-monospace,Menlo,monospace;word-break:break-all;border:2px solid #eadccb;border-radius:10px;padding:8px;user-select:text;-webkit-user-select:text}
.row{display:flex;gap:8px;margin-top:8px}
.toast{position:absolute;left:50%;bottom:calc(210px + var(--safe-b));max-width:92%;overflow:hidden;text-overflow:ellipsis;transform:translateX(-50%);background:#2b2233;color:#fff;border-radius:999px;padding:10px 18px;font-weight:800;font-size:14px;white-space:nowrap;animation:fadein .2s;pointer-events:none}
.toast.out{opacity:0;transition:opacity .3s}
.aha-fx{position:absolute;left:50%;top:30%;transform:translateX(-50%);font-size:80px;font-weight:900;color:#ffeb3b;-webkit-text-stroke:3px #222;animation:pop .6s;pointer-events:none}
.memory-flash{position:absolute;right:14px;bottom:120px;width:96px;border:3px dashed #7e57c2;border-radius:16px;background:rgba(255,255,255,.9);padding:4px;cursor:pointer;animation:fadein .4s,memf 1s infinite alternate}
.memory-flash .gaki{width:100%;opacity:.6;filter:grayscale(.5)}.memory-flash span{font-weight:900;color:#7e57c2}
@keyframes memf{to{transform:translateY(-6px)}}
.clear-card{text-align:center}.cc-head{font-size:28px;font-weight:900;color:var(--pink)}
.cc-gakis{display:flex;justify-content:center}.cc-gakis .gaki{width:70px}
.cc-stats{font-size:13px;color:#666}.cc-backup{background:#fff8e1;border-radius:12px;padding:10px;margin:10px 0}
/* ---- onboarding ---- */
.onboard{display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 20px;text-align:center}
.logo{font-size:34px;font-weight:900;color:var(--pink);-webkit-text-stroke:1px #7a1035}.logo small{font-size:14px;color:#998;-webkit-text-stroke:0}
.ob-gaki{width:200px}.ob-gaki .gaki{width:100%;animation:idle 2.4s infinite}
.name{font-weight:800}.name input,.txt{font:inherit;font-size:16px;border:2px solid #eadccb;border-radius:12px;padding:10px;width:100%;max-width:260px;user-select:text;-webkit-user-select:text}
.card{background:#fff;border-radius:16px;padding:14px;text-align:left;font-size:14px;line-height:1.6}.card h3{font-size:16px}
.card ol{padding-left:20px}.card .warn{background:#fff3e0;border-radius:8px;padding:8px}
.card.ok{background:#e8f5e9}
/* ---- return ---- */
.return{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 18px;text-align:center;min-height:100dvh;justify-content:center}
.return.r-ira1,.return.r-ira2{background:linear-gradient(#e6dbea,#cbbad4)}
.return.r-satori{background:linear-gradient(#fffdf5,#efeaff)}
.okaeri-title{font-size:30px;font-weight:900}
.return-stage{position:relative;width:240px;height:240px;cursor:pointer}.return-stage .gaki{width:100%}
.timelapse .tl{position:absolute;inset:0;opacity:0}
.timelapse .tl1{animation:tl1 3.2s forwards}.timelapse .tl2{animation:tl2 3.2s forwards}.timelapse .tl3{animation:tl3 3.2s forwards}
@keyframes tl1{0%,25%{opacity:1}35%,100%{opacity:0}}@keyframes tl2{0%,28%{opacity:0}38%,62%{opacity:1}72%,100%{opacity:0}}@keyframes tl3{0%,68%{opacity:0}85%,100%{opacity:1}}
.return .bubble{position:relative;left:auto;top:auto;transform:none}
.bubble.big{font-size:18px}
.return-sub{color:#555}
/* ---- prep ---- */
.prep{display:flex;flex-direction:column;align-items:center;gap:12px;padding:30px 20px;text-align:center}
.prep-gaki{display:flex}.prep-gaki .gaki{width:130px}
/* ---- zukan ---- */
.tabs{display:flex;gap:6px;padding:0 12px}.tab{flex:1;font:inherit;font-weight:800;border:2px solid #eadccb;background:#fff;border-radius:12px 12px 0 0;padding:8px}.tab.on{background:var(--pink);color:#fff;border-color:var(--pink)}
.zbody{padding:12px;flex:1}
.zgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.zcell{background:#fff;border-radius:14px;padding:6px;text-align:center}.zcell .gaki{width:100%}
.zname{font-size:12px;font-weight:900}.zhint{font-size:10px;color:#7e57c2;line-height:1.3;margin-top:2px}
.zcell.locked{background:#f1ebf5}.zcell.spiky .gaki{filter:drop-shadow(0 0 4px #7e57c2)}
.hint-btn{margin-top:14px;width:100%}
.items{display:grid;grid-template-columns:1fr 1fr;gap:8px}.item{background:#fff;border-radius:10px;padding:8px;font-size:13px;display:flex;flex-direction:column}.item b{font-size:11px}.item.locked{color:#aaa;background:#f5f0ea}
.item.r-R b{color:#0288d1}.item.r-SR b{color:#f9a825}.item.r-UR b{color:#e91e63}
.records{display:grid;gap:6px;background:#fff;border-radius:14px;padding:12px;font-size:14px}.records b{float:right}
.okaeri-card{background:#efeaff;border-radius:10px;padding:8px;margin:4px 0;font-size:13px}
/* ---- settings ---- */
.settings{display:flex;flex-direction:column;gap:10px;padding:12px 16px 30px}
.toggle{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:12px;padding:12px;font-weight:800}
.toggle input{width:22px;height:22px}
details{background:#fff;border-radius:12px;padding:10px}summary{font-weight:800}
a.set-link{display:block;background:#fff;border-radius:12px;padding:12px;font-weight:800;color:var(--ink);text-decoration:none}
.doc{max-width:480px;margin:0 auto;min-height:100dvh;background:var(--bg);padding:18px 18px 48px;user-select:text;-webkit-user-select:text}
.doc h1{font-size:26px}.doc h2{font-size:16px;margin-top:1.3em}
.doc p{font-size:15px;line-height:1.75}
.doc .back{font-weight:800;color:#b3165f;text-decoration:none}
/* ---- debug ---- */
.dbg-btn{position:fixed;left:4px;top:45%;z-index:90;font:700 11px monospace;background:#222;color:#0f0;border:0;border-radius:8px;padding:6px 8px;opacity:.75}
.dbg-panel{position:fixed;left:8px;right:8px;top:96px;z-index:91;background:rgba(0,0,0,.88);color:#fff;font:12px monospace;border-radius:12px;padding:10px;max-width:464px;margin:0 auto}
.dbg-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;align-items:center}.dbg-row button{font:12px monospace;padding:5px 7px;border-radius:6px;border:0}
.dbg-json{font-size:10px;white-space:pre-wrap;max-height:60dvh;overflow:auto}

/* ===================== v0.2 ===================== */
.hud{display:flex;gap:8px;width:100%;align-items:center;justify-content:space-between;font-size:13px;font-weight:800;background:#fff;border-radius:12px;padding:6px 10px}
.hud .best{color:#8d6e63;font-size:12px;text-align:right}
.hud .area{background:#fff3e0;border-radius:8px;padding:2px 8px}
.hud .area.flash{animation:pop .5s}
.gc-best{font-size:11px;font-weight:800;color:#8d6e63;margin-top:4px}
/* --- ガチャ --- */
.mg-gacha2{gap:8px}
.g-hud{display:flex;gap:6px;width:100%;justify-content:space-between;align-items:center;background:#2b2233;color:#fff;border-radius:14px;padding:8px 12px;font-size:13px}
.g-hud b{font-size:17px}.g-hud .tix b{color:#ffd54f;font-size:20px}.g-hud .best b{color:#ff8ccf}
.g-sub{display:flex;width:100%;justify-content:space-between;align-items:center;gap:6px;font-size:10px;color:#776}
.g-sub .btn{white-space:nowrap}
.g-stage{position:relative;width:100%;min-height:340px;display:flex;flex-direction:column;align-items:center}
.g-machine{position:relative;width:52%;max-width:200px;z-index:1;transition:width .3s}
.g-machine svg{width:100%;display:block;position:relative;z-index:1}
.g-glow{position:absolute;inset:-20%;border-radius:50%;background:radial-gradient(circle,var(--glow,#fff) 0,transparent 65%);opacity:0;transition:opacity .2s}
.g-machine.spin .g-glow{opacity:.7;animation:gpulse .6s ease-in-out infinite alternate}
.g-machine.spin .g-handle{animation:hspin .45s linear infinite;transform-box:fill-box;transform-origin:center}
.g-machine.spin .gball{animation:gjump .25s infinite alternate}
.g-machine.spin.lv0{animation:shake .14s infinite}
.g-machine.spin.lv1{animation:shake .1s infinite}
.g-machine.spin.lv2{animation:shake2 .08s infinite}
.g-machine.spin.lv3{animation:shake2 .06s infinite;filter:hue-rotate(0);}
.g-machine.spin.lv3 .g-glow{background:conic-gradient(#ff4d6d,#ffd400,#2ecc71,#4d7cff,#c04dff,#ff4d6d);filter:blur(14px);animation:spin 3s linear infinite}
@keyframes shake2{25%{transform:translate(-7px,3px) rotate(-4deg)}75%{transform:translate(7px,-3px) rotate(4deg)}}
@keyframes gpulse{to{transform:scale(1.15)}}
@keyframes gjump{to{transform:translateY(-6px)}}
.g-reveal{width:100%;display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:-6px}

.g-stage:has(.g-reveal:not(:empty)) .g-machine{width:30%}
.g-skip{position:absolute;right:0;top:0;z-index:5}
.g-note{font-size:12px;color:#7e57c2;text-align:center;margin:0;line-height:1.5}
.g-note:empty{display:none}
.g-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:auto}
.g-btns .btn small{display:block;font-size:11px;opacity:.85}
.g-btns .btn{display:flex;flex-direction:column;align-items:center;line-height:1.2}
.g-ten{background:linear-gradient(135deg,#ff3d9a,#ff9a3d);box-shadow:0 4px 0 #b3165f}
.g-btns .practice{background:#9e9ac8;box-shadow:0 4px 0 #6f6aa0}
.g-end{grid-column:1/-1}
.capsule2{width:96px;height:96px;border-radius:50%;position:relative;cursor:pointer;margin-top:6px}
.capsule2 .cap-top,.capsule2 .cap-bot{position:absolute;left:0;right:0;height:50%;border:4px solid #222;transition:transform .35s}
.capsule2 .cap-top{top:0;border-radius:48px 48px 0 0;background:var(--rc)}
.capsule2 .cap-bot{bottom:0;border-radius:0 0 48px 48px;background:#fff}
.capsule2 small{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:700}
.capsule2.drop{animation:drop .55s cubic-bezier(.3,1.6,.6,1) both}
.capsule2.crack{animation:shake2 .07s infinite}
.capsule2.promoted{animation:pop .45s;filter:drop-shadow(0 0 14px #fff)}
.capsule2.open .cap-top{transform:translateY(-40px) rotate(-30deg)}.capsule2.open .cap-bot{transform:translateY(20px)}.capsule2.open small{display:none}
.capsule2.mini{width:52px;height:52px;margin:0}.capsule2.mini .cap-top{border-radius:26px 26px 0 0;border-width:3px}.capsule2.mini .cap-bot{border-radius:0 0 26px 26px;border-width:3px}
.promote{position:absolute;left:50%;top:-14px;transform:translateX(-50%);font-weight:900;font-size:14px;color:#fff;background:linear-gradient(90deg,#ff4d6d,#ffd400);border-radius:8px;padding:1px 6px;white-space:nowrap;animation:pop .4s;z-index:3}
.promote.big{font-size:22px;top:-34px}
.pcard{position:relative;background:#fff;border-radius:14px;padding:4px;text-align:center;animation:pop .35s}
.pcard .prize{width:100%;display:block}
.pcard.big{width:min(72%,240px);padding:8px;box-shadow:0 6px 24px rgba(0,0,0,.15)}
.pcard.big.r-SR{box-shadow:0 0 24px #ffd54f}.pcard.big.r-UR{box-shadow:0 0 30px #ff8ccf,0 0 60px #b9e5ff;animation:pop .5s,urglow 1.5s infinite alternate}
@keyframes urglow{to{box-shadow:0 0 40px #ffd400,0 0 80px #c04dff}}
.pc-name{font-weight:900;font-size:17px;margin-top:4px}.pc-desc{font-size:12px;color:#666}
.pc-mini{font-size:9px;font-weight:700;line-height:1.2;height:2.4em;overflow:hidden}
.tag{position:absolute;top:-6px;right:-4px;font-style:normal;font-weight:900;font-size:11px;border-radius:8px;padding:1px 6px;z-index:2}
.tag.new{background:#ff3d9a;color:#fff;animation:pulse 1s infinite}.tag.dup{background:#eceff1;color:#555}.tag.prac{background:#9e9ac8;color:#fff}
.ten-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;width:100%}
.ten-cell{min-height:70px;display:flex;align-items:center;justify-content:center}
.ten-sum{font-weight:900;font-size:16px;color:#ff3d9a}
.g-complete{font-weight:900;font-size:20px;color:#fff;background:linear-gradient(90deg,#ff4d6d,#ffd400,#2ecc71,#4d7cff);border-radius:12px;padding:4px 12px;animation:pop .6s}
.g-coll{position:absolute;inset:0;background:rgba(43,34,51,.6);z-index:20;display:flex;align-items:stretch;padding:6px}
.g-coll-in{background:var(--bg);border-radius:16px;padding:10px;overflow:auto;width:100%}
.g-coll-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:17px}
.g-detail{position:absolute;inset:0;z-index:30;background:rgba(0,0,0,.55);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.g-detail .prize-detail{background:#fff;border-radius:16px;padding:14px;width:80%;text-align:center}
.prize-detail .pd-img{width:150px;margin:0 auto}.prize-detail .prize{width:100%}
.coll-head{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:center;background:#fff;border-radius:14px;padding:10px;margin-bottom:8px}
.coll-rate{text-align:center}.coll-rate b{font-size:28px;color:#ff3d9a;display:block;line-height:1}.coll-rate small{font-size:11px}
.coll-by{display:flex;flex-wrap:wrap;gap:4px}.rb{font-size:11px;font-weight:900;color:#fff;background:var(--rc);border-radius:6px;padding:1px 6px}
.coll-comp{grid-column:1/-1;font-size:11px}.coll-comp div{display:flex;flex-wrap:wrap;gap:4px 10px;font-weight:700}
.coll-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.coll-cell{position:relative;border:0;background:none;padding:0;cursor:pointer}
.coll-cell .prize{width:100%;display:block}
.coll-cell .dup,.coll-cell .new{position:absolute;font-style:normal;font-weight:900;font-size:10px;border-radius:6px;padding:0 4px}
.coll-cell .dup{right:2px;top:2px;background:rgba(255,255,255,.9)}.coll-cell .new{left:2px;top:2px;background:#ff3d9a;color:#fff}
/* --- さんぽ --- */
.sampo-scene2,.renda-scene{position:relative;width:100%;height:250px;border-radius:16px;overflow:hidden;background:#cde}
.sampo-scene2 .layer,.renda-scene .layer{position:absolute;inset:0;transition:opacity .6s}
.layer.next{opacity:0}.layer.gone{opacity:0}
.scene{width:100%;height:100%;display:block}
.scene .scroll{transition:transform .25s ease-out}
.sampo-scene2 .walker{position:absolute;left:50%;bottom:22px;width:100px;transform:translateX(-50%);z-index:2}
.sampo-scene2 .walker .gaki{width:100%;transition:transform .15s}.sampo-scene2.stepL .walker .gaki{transform:rotate(-6deg) translateY(-4px)}.sampo-scene2:not(.stepL) .walker .gaki{transform:rotate(6deg)}
.sampo-scene2 .rhythm{z-index:3}
.area-banner{position:absolute;left:50%;top:38%;transform:translateX(-50%);z-index:4;background:rgba(255,255,255,.92);border-radius:999px;padding:6px 16px;font-weight:900;white-space:nowrap;animation:banner 1.4s forwards}
@keyframes banner{0%{opacity:0;transform:translate(-50%,10px) scale(.8)}15%{opacity:1;transform:translate(-50%,0) scale(1.05)}80%{opacity:1}100%{opacity:0}}
.windmill{animation:spin 4s linear infinite;transform-box:fill-box;transform-origin:center}
/* --- マラソン --- */
.renda-scene .runner{position:absolute;left:50%;bottom:18px;width:84px;transform:translateX(-50%);z-index:2}
.renda-scene .runner .gaki{width:100%;animation:idle .3s infinite}
.renda-scene.boosting .runner{filter:drop-shadow(-14px 0 0 rgba(255,214,0,.7)) drop-shadow(-26px 0 0 rgba(255,61,154,.4))}
.renda-scene.boosting .scene .scroll{transition:transform .1s linear}
.speed{position:absolute;left:8px;top:8px;right:8px;display:flex;justify-content:space-between;align-items:center;z-index:3;font-size:12px;font-weight:900;color:#fff;text-shadow:0 1px 2px #000}
.speed .wave{width:90px;height:10px;background:rgba(0,0,0,.35);border-radius:6px;overflow:hidden}
.speed .wave i{display:block;height:100%;background:#4fc3f7;transition:width .1s}.speed .wave i.crest{background:#ffd400}
.mg-renda .count{font-size:18px}.mg-renda .count b{font-size:40px}
/* --- なでなで --- */
.nade-gaki{width:80%;margin:10%;transition:transform .2s}
.nade-gaki .gaki{width:100%;display:block}
.nade-area.happy .nade-gaki{transform:scale(1.06) rotate(-3deg)}.nade-area.nope .nade-gaki{animation:shake .1s 3}.nade-area.plain .nade-gaki{transform:scale(1.01)}
.nade-area.happy{background:radial-gradient(#fff,#ffd6e4)}
.floattext.note{color:#7e57c2;font-size:26px}.floattext.big{font-size:34px}
.nade-combo{position:absolute;left:50%;top:40%;transform:translateX(-50%);font-size:48px;font-weight:900;color:#ff4d6d;animation:pop .6s,floatup 1.1s .4s forwards;pointer-events:none}
/* --- 結果 --- */
.score-box{display:flex;justify-content:space-around;gap:8px;width:100%;background:#fff;border-radius:12px;padding:8px;font-size:13px;flex-wrap:wrap;text-align:center}
.score-box b{font-size:16px}.score-box.new{box-shadow:0 0 0 3px #ffd400}
.new-record{font-size:34px;font-weight:900;background:linear-gradient(90deg,#ff4d6d,#ffd400,#2ecc71,#4d7cff,#c04dff);-webkit-background-clip:text;background-clip:text;color:transparent;animation:pop .6s,pulse 1s .6s infinite}
.first-record{font-weight:900;color:#8d6e63}
.found{width:100%;background:#ede7f6;border-radius:12px;padding:8px 10px;font-size:13px;line-height:1.6}.found b{color:#7e57c2}
#layer>.confetti,.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.confetti i{position:absolute;top:-10px;width:8px;height:14px;border-radius:2px;animation:fall 2.2s ease-in forwards}
@keyframes fall{to{top:110%;transform:rotate(720deg) translateX(30px)}}
/* --- はじめに --- */
.ob-gaki.small{width:120px}
.name-row{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.name-row .name{display:flex;align-items:center;gap:6px}.name-row .name input{width:170px;max-width:52vw}
input.pop{animation:pop .35s}
details.manual{width:100%;text-align:left}
.hs-nudge{width:100%;display:flex;align-items:center;gap:6px;background:#e3f2fd;border-radius:12px;padding:6px 8px;font-size:12px;font-weight:700}
.hs-nudge span{flex:1}.hs-nudge .x{border:0;background:none;font-size:16px;color:#888}
.znade{font-size:10px;color:#ff9a3d;font-weight:800}
.z-detail{width:140px;margin:0 auto}.z-detail .gaki{width:100%}
/* v0.2 fix: 昇格の文字が台の下に隠れていた → 前面へ。昇格はリングが広がる光で強調 */
.g-reveal{position:relative;z-index:2}
.promote.big{font-size:24px;top:auto;bottom:-44px;padding:2px 12px;box-shadow:0 2px 0 #b8004a}
.capsule2.promoted::after{content:'';position:absolute;inset:-10px;border-radius:50%;border:6px solid var(--rc);animation:ring .6s ease-out forwards;pointer-events:none}
@keyframes ring{from{transform:scale(.6);opacity:1}to{transform:scale(2.2);opacity:0}}
/* さんぽ: エリアの道のり（どこまで来たか・ベストの位置） */
.sampo-map{display:flex;justify-content:space-between;align-items:flex-start;width:100%;padding:10px 6px 4px;position:relative}
.sampo-map::before{content:'';position:absolute;left:14px;right:14px;top:16px;height:3px;background:#e6d8c6;border-radius:2px}
.sm-dot{position:relative;display:flex;flex-direction:column;align-items:center;width:10%;}
.sm-dot i{width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid #e6d8c6;z-index:1;transition:all .3s}
.sm-dot.past i{background:#3fbf7f;border-color:#3fbf7f}
.sm-dot.cur i{background:#ff3d9a;border-color:#ff3d9a;transform:scale(1.35);box-shadow:0 0 0 4px #ff3d9a33}
.sm-dot.best::after{content:'★';position:absolute;top:-12px;font-size:12px;color:#f2b200}
.sm-dot small{font-size:10px;font-weight:800;white-space:nowrap;margin-top:3px;color:#7a6a5a;min-height:13px}
.sm-dot.cur small{color:#ff3d9a}
/* v0.3 ゲージ（ホームと結果で共通）: バー=いまの値、しま=今回増えた分、点線=減った分。右に「値/上限」と増減 */
.gauge-list{display:grid;gap:6px;width:100%}
.gr{display:grid;grid-template-columns:30px 1fr 54px;align-items:center;gap:6px;font-weight:800;font-size:12px}
.gauge-list.with-delta .gr{grid-template-columns:34px 1fr 62px 40px;font-size:14px}
.gr-bar{position:relative;height:12px;background:#eee;border-radius:6px;overflow:hidden}
.with-delta .gr-bar{height:14px}
.gr-fill{position:absolute;left:0;top:0;bottom:0;background:var(--c);border-radius:6px 0 0 6px;transition:width .6s}
.gr-seg{position:absolute;top:0;bottom:0}
.gr-seg.up{background:repeating-linear-gradient(-45deg,var(--c) 0 4px,color-mix(in srgb,var(--c) 45%,#fff) 4px 8px)}
.gr-seg.down{background:#fff;border:2px dashed #c62828;border-radius:3px;box-sizing:border-box}
.gr-v{font-size:11px;color:#7a6a5a;text-align:right;white-space:nowrap}.gr-v b{font-size:13px;color:#2b2233}
.with-delta .gr-v b{font-size:15px}
.gr-d{text-align:right;font-size:15px}.gr-d.up{color:#2e7d32}.gr-d.down{color:#c62828}.gr-d.zero{color:#999;font-size:13px}
.gr.locked .gr-n,.gr.locked .gr-v{color:#bbb}
.gr-legend{margin:2px 0 0;font-size:11px;font-weight:600;color:#7a6a5a;line-height:1.4}.gr-legend .up{color:#2e7d32}.gr-legend .down{color:#c62828}
.home-bottom .gauges{min-width:190px}

/* v0.3 なでなで: 背景の色替えはふわっと（すばやく切り替わって明滅しないように） */
.nade-area{isolation:isolate}
.nade-area::before{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(#fff,#ffd6e4);opacity:0;transition:opacity .6s;z-index:-1}
.nade-area.happy{background:radial-gradient(#fff3e0,#ffe0b2)}.nade-area.happy::before{opacity:1}

/* v0.3 動きをへらす: OSの「視差効果を減らす」または設定の「動きをへらす」 */
@media (prefers-reduced-motion: reduce){
  html:not(.motion-ok) *,html:not(.motion-ok) *::before,html:not(.motion-ok) *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
html.reduce-motion *,html.reduce-motion *::before,html.reduce-motion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
html.reduce-motion .confetti,html.reduce-motion .floattext{display:none}
/* v0.3 マラソン: 連打ボタンは絵のすぐ下（結果画面の「もう1回」と重ならない位置） */
.renda-pad{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px}
.mg-renda .renda-pad .btn.huge{margin-top:0}
/* v0.3 結果画面: 出てすぐは押せない（連打の勢いで押さないように） */
.res-btns.locked button{pointer-events:none;opacity:.45;filter:grayscale(.3)}
.res-btns .lock-note{grid-column:1/-1;text-align:center;font-size:12px;color:#7a6a5a;height:16px}
/* v0.4: 前回遊んだときの位置（うすい縦線）・サトリ未解放の図鑑・Safariの注意 */
.gr-mark{position:absolute;top:0;bottom:0;width:3px;margin-left:-1.5px;background:var(--c);opacity:.5;border-radius:2px;pointer-events:none}
.zcell.far{opacity:.55;background:#eceaf0}.zcell.far .zhint{color:#777}
.return-note{margin:4px 18px 0;color:#6d5b7a;background:#fff8;border-radius:10px;padding:6px 10px}
/* v0.5: ペースメーター（さんぽ・なでなで共通）。針は位置だけ動く（明るさは変えない） */
.pace-row{display:flex;align-items:center;gap:8px;width:100%;margin-top:6px}
.pace-row .pr-l{font-size:12px;font-weight:900;color:#555;width:3.2em;flex:none}
.pace-meter{position:relative;flex:1;height:18px;border-radius:9px;background:#e9e4ef;overflow:visible}
.pace-meter .pm-band{position:absolute;top:0;bottom:0;background:#8fd9a8;border-radius:9px}
.pace-meter .pm-needle{position:absolute;top:-4px;bottom:-4px;width:6px;margin-left:-3px;border-radius:3px;background:#555;transition:left .25s ease-out}
.pace-meter .pm-needle[data-pace=good]{background:#23864f}.pace-meter .pm-needle[data-pace=fast]{background:#e65100}.pace-meter .pm-needle[data-pace=slow]{background:#5c6bc0}
.pace-meter small{position:absolute;top:19px;font-size:10px;color:#888}.pace-meter .pm-s{left:0}.pace-meter .pm-f{right:0}
.pace-row + .pace-row{margin-top:14px}
.stamina{flex:1;height:10px;border-radius:5px;background:#e9e4ef;overflow:hidden}
.stamina i{display:block;height:100%;background:#4fc3f7;border-radius:5px;transition:width .3s}
.stamina.low i{background:#ffb74d}
.breath{position:absolute;right:10px;top:8px;width:62px;height:62px;display:grid;place-items:center;z-index:3}
.breath i{position:absolute;inset:6px;border-radius:50%;border:3px solid #3fbf7f;background:#ffffffb0;transform:scale(.8)}
.mg-sampo.walking .breath i{animation:breathe var(--beat,600ms) ease-in-out infinite alternate}
.breath small{position:relative;font-size:11px;font-weight:900;color:#23864f}
@keyframes breathe{from{transform:scale(.78)}to{transform:scale(1)}}
.walker .sweat{position:absolute;right:-4px;top:4px;font-style:normal;font-size:20px;transform:scale(0);transition:transform .3s}
.sampo-scene2.hurry .walker .sweat{transform:scale(1)}
.sampo-scene2.tired .walker .gaki{transform:translateY(6px) rotate(0deg)!important}
.mg-sampo .feet .foot{height:96px}
.nade-area.slowish .nade-gaki{transform:scale(.99)}
.mg-nade .nade-area{max-width:320px}
.rule-note{font-size:11px;color:#6d5b7a;background:#f3eef8;border-radius:8px;padding:4px 8px;margin-top:6px;width:100%;text-align:center}
/* ---------- v0.6 S2 深呼吸 ---------- */
.br-scene{position:relative;width:100%;height:300px;border-radius:16px;overflow:hidden;background:#1d2550}
.br-sky{position:absolute;inset:0;opacity:0;transition:opacity 2.5s ease}
.br-sky0{opacity:1;background:linear-gradient(#141a3f,#3b3f7a)}
.br-sky1{background:linear-gradient(#4b3f86,#f29b7c)}
.br-sky2{background:linear-gradient(#7fb0e6,#ffd59a)}
.br-sky3{background:linear-gradient(#3fa9ef,#c4ebff)}
.br-scene.sky1 .br-sky1,.br-scene.sky2 .br-sky1,.br-scene.sky2 .br-sky2,.br-scene.sky3 .br-sky1,.br-scene.sky3 .br-sky2,.br-scene.sky3 .br-sky3{opacity:1}
.br-sun{position:absolute;left:68%;bottom:40px;width:56px;height:56px;border-radius:50%;background:radial-gradient(#fff6c8,#ffb347);transform:translateY(120px);transition:transform 2.5s ease}
.br-scene.sky1 .br-sun{transform:translateY(40px)}.br-scene.sky2 .br-sun{transform:translateY(-40px)}.br-scene.sky3 .br-sun{transform:translateY(-170px)}
.br-hill{position:absolute;left:-10%;right:-10%;bottom:-60px;height:120px;border-radius:50%;background:#4f7f5a}
.br-circle{position:absolute;left:50%;top:30px;width:200px;height:200px;margin-left:-100px}
.br-circle i{position:absolute;inset:0;border-radius:50%}
.br-guide{border:4px solid rgba(255,255,255,.9);transition:opacity 1.5s}
.br-me{background:rgba(160,220,255,.35);border:2px solid rgba(200,240,255,.6)}
.br-scene.noguide .br-guide{opacity:0}
.br-gaki{position:absolute;left:50%;top:78px;width:96px;margin-left:-48px}
.br-gaki .gaki{width:100%}
.br-phase{position:absolute;left:0;right:0;bottom:10px;text-align:center;font-weight:900;font-size:20px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.br-btn,.kt-btn{width:100%;font:inherit;font-weight:900;font-size:22px;height:120px;border-radius:24px;border:0;background:#4a90d9;color:#fff;box-shadow:0 5px 0 #2f6aa8;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.br-btn.on,.kt-btn.on{transform:translateY(4px);box-shadow:0 1px 0 #2f6aa8;background:#3b7cc2}
.br-btn:disabled,.kt-btn:disabled{opacity:.6}
/* ---------- v0.6 B2 筋トレ ---------- */
.kt-scene{position:relative;width:100%;height:250px;border-radius:16px;overflow:hidden;background:linear-gradient(#fff3e0,#ffe0b2 70%,#d7a86e 70%)}
.kt-coach{position:absolute;left:10px;top:10px;background:#fff;border-radius:14px;padding:6px 12px;font-weight:900;font-size:18px;z-index:3}
.mg-kintore.limit .kt-coach{font-size:24px;color:#d84315}
.kt-fails{position:absolute;right:10px;top:12px;font-size:12px;font-weight:800;background:#fff;border-radius:10px;padding:3px 8px}
.kt-lifter{position:absolute;left:50%;bottom:20px;width:150px;margin-left:-75px}
.kt-gaki{width:100px;margin:0 auto;transition:transform calc(var(--beat) * .8) ease}
.kt-gaki .gaki{width:100%}
.kt-weight{position:relative;height:60px;transition:transform calc(var(--beat) * .8) ease;text-align:center}
.kt-bar{position:absolute;left:0;right:0;top:24px;height:8px;border-radius:4px;background:#555}
.kt-bar::before,.kt-bar::after{content:'';position:absolute;top:-14px;width:16px;height:36px;border-radius:4px;background:#333}
.kt-bar::before{left:4px}.kt-bar::after{right:4px}
.kt-weight b{position:relative;display:inline-block;margin-top:2px;background:#fff;border:2px solid #333;border-radius:8px;padding:2px 8px;font-size:14px}
.kt-lifter.up .kt-weight{transform:translateY(-60px)}
.kt-lifter.up .kt-gaki{transform:translateY(-6px) scaleY(1.04)}
.kt-beat{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800}
.kt-track{position:relative;width:220px;height:14px;border-radius:7px;background:#e8dccc}
.kt-track i{position:absolute;left:0;top:-3px;width:20px;height:20px;border-radius:50%;background:#4a90d9}
.kt-tremor{position:relative;width:300px;height:34px;border-radius:10px;background:linear-gradient(90deg,#f4b0a0,#fff 25%,#fff 75%,#f4b0a0);opacity:.3;transition:opacity .4s}
.kt-tremor.on{opacity:1}
.kt-zone{position:absolute;left:35%;width:30%;top:0;bottom:0;background:#c8efd7;border-radius:6px}
.kt-needle{position:absolute;left:50%;top:2px;width:6px;height:22px;margin-left:-3px;border-radius:3px;background:#333}
.kt-tremor small{position:absolute;left:0;right:0;bottom:-1px;text-align:center;font-size:10px;color:#666}
/* ---------- v0.6 2周目 ---------- */
.select-body{padding-bottom:8px}
.round-head{margin:12px 14px -4px;font-size:15px;font-weight:900;color:#6d4c41;border-left:5px solid #ffb300;padding-left:8px}
.gcard.prep{background:repeating-linear-gradient(45deg,#fafafa 0 10px,#f0ece6 10px 20px);border-style:dashed;align-items:center;justify-content:center;text-align:center;cursor:default;box-shadow:none;opacity:.85}
.gcard.prep .gc-sil{font-size:40px;color:#bbb;font-weight:900}.gcard.prep .gc-name{color:#999}
.ci-note{font-size:14px;font-weight:700;text-align:center;max-width:300px;line-height:1.5;background:rgba(255,255,255,.9);border-radius:12px;padding:6px 10px}
.ci-round{font-size:56px}
.ci-grow .ci-title{font-size:24px}
.z-detail.two{width:280px;display:flex;gap:8px}.z-detail.two figure{flex:1;margin:0;text-align:center}.z-detail.two figcaption{font-size:12px;font-weight:800}
.welcome2 h2{font-size:26px}
.gcard.prep{min-height:0;padding:10px 8px;gap:2px}.gcard.prep .gc-sil{font-size:28px;line-height:1}.gcard.prep .gc-name{font-size:15px}.gcard.prep small{font-size:10.5px}
.kt-weight{height:64px}.kt-weight b{margin-top:0}.kt-bar{top:44px}
.kt-lifter.up .kt-weight{transform:translateY(-56px)}
/* ---------- v0.7 D2 通知の雨（作中の架空SNS。暖色の自作配色。黒白基調・水色は使わない） ---------- */
.ts-wrap{position:relative;width:100%;height:470px;border-radius:16px;overflow:hidden}
.ts-bg{position:absolute;inset:0;opacity:0;transition:opacity 1.5s}
.ts-bg0{opacity:1;background:linear-gradient(#fdebd3,#f3d2a8)}
.ts-bg1{background:linear-gradient(#c9a7d6,#f0b48a)}
.ts-bg2{background:linear-gradient(#a8d5a2,#f6e39a)}
.ts-bg3{background:linear-gradient(#4b3f7a,#8a6bb0)}
.ts-wrap.st1 .ts-bg1,.ts-wrap.st2 .ts-bg1,.ts-wrap.st2 .ts-bg2,.ts-wrap.st3 .ts-bg1,.ts-wrap.st3 .ts-bg2,.ts-wrap.st3 .ts-bg3{opacity:1}
.ts-phone{position:absolute;left:50%;top:10px;bottom:10px;width:270px;margin-left:-120px;border:8px solid #ff8a50;border-radius:28px;background:#fff8ec;overflow:hidden;display:flex;flex-direction:column;transition:background-color 1s}
.ts-phone.rush{background:#ffe1c9}
.ts-head{display:flex;align-items:center;gap:6px;padding:6px 8px;background:#ffd6b8;font-size:14px;color:#6d3b1f}
.ts-logo{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#ff8a50;color:#fff8ec;font-weight:900;font-size:14px}
.ts-unread{margin-left:auto;font-size:11px;background:#fff;border-radius:10px;padding:2px 6px;color:#8d4a26}
.ts-pick{display:flex;flex-direction:column;gap:8px;padding:12px}
.ts-q{margin:0;font-weight:800;font-size:13px;color:#6d3b1f}
.ts-post{font:inherit;font-size:15px;text-align:left;border:2px solid #f3c9a8;background:#fff;border-radius:12px;padding:10px}
.ts-post.on{border-color:#ff8a50;background:#fff1e4;font-weight:800}
.ts-go{margin-top:6px}
.ts-mine{padding:6px 8px;font-size:12px;border-bottom:1px dashed #f3c9a8;color:#6d3b1f}
.ts-field{position:relative;flex:1;overflow:hidden}
.ts-card{position:absolute;top:0;height:40px;font:inherit;font-size:12px;font-weight:800;border:2px solid #e8b48f;border-radius:12px;background:#fff;color:#6d3b1f;display:flex;align-items:center;gap:4px;padding:0 6px;touch-action:none;will-change:transform}
.ts-card span{font-size:15px}
.ts-card.k-like{background:#ffe6ea;border-color:#f4a7b5}.ts-card.k-letter{background:#fff3c4;border-color:#e8cf6c}.ts-card.k-join{background:#dff3dc;border-color:#9fd197}
.ts-card.k-oshi{background:#ffd76a;border-color:#d9a520;font-size:11px}
.ts-meter{display:flex;align-items:center;gap:6px;padding:4px 8px 6px;font-size:10px;font-weight:800;color:#8d4a26}
.ts-meter i{flex:1;height:8px;border-radius:4px;background:#f3dccb;overflow:hidden}.ts-meter b{display:block;height:100%;width:0;background:#ff9f6e;transition:width .3s}
.ts-gaki{position:absolute;left:4px;bottom:6px;width:74px;z-index:2}.ts-gaki .gaki{width:100%}
.ts-bubble{position:absolute;left:8px;top:-26px;background:#fff;border-radius:10px;padding:2px 8px;font-size:12px;font-weight:900;white-space:nowrap}
/* ---------- v0.7 O2 褒められシャワー ---------- */
.hm-field{position:relative;width:100%;height:440px;border-radius:16px;overflow:hidden;touch-action:none}
.hm-bg{position:absolute;inset:0;opacity:0;transition:opacity 1.5s}
.hm-bg small{position:absolute;right:10px;top:8px;font-size:11px;font-weight:800;background:rgba(255,255,255,.8);border-radius:8px;padding:2px 8px}
.hm-bg0{opacity:1;background:linear-gradient(#fff1e0,#f8d9b8)}
.hm-bg1{background:linear-gradient(#cfe8cf,#f3e6c4)}
.hm-bg2{background:linear-gradient(#ffd9b3,#f4c58e)}
.hm-bg3{background:linear-gradient(#d6c5ef,#9fd49a 70%)}
.hm-bg4{background:linear-gradient(#e9d4f5,#ffd3e0)}
.hm-field.st1 .hm-bg1,.hm-field.st2 .hm-bg1,.hm-field.st2 .hm-bg2,.hm-field.st3 .hm-bg1,.hm-field.st3 .hm-bg2,.hm-field.st3 .hm-bg3,.hm-field.st4 .hm-bg1,.hm-field.st4 .hm-bg2,.hm-field.st4 .hm-bg3,.hm-field.st4 .hm-bg4{opacity:1}
.hm-field.st1 .hm-bg0 small,.hm-field.st2 .hm-bg1 small,.hm-field.st3 .hm-bg2 small,.hm-field.st4 .hm-bg3 small,.hm-field.st2 .hm-bg0 small,.hm-field.st3 .hm-bg0 small,.hm-field.st3 .hm-bg1 small,.hm-field.st4 .hm-bg0 small,.hm-field.st4 .hm-bg1 small,.hm-field.st4 .hm-bg2 small{display:none}
.hm-words{position:absolute;inset:0}
.hm-word{position:absolute;left:0;top:0;white-space:nowrap;font-size:13px;font-weight:800;background:#fff;border:2px solid var(--c);border-radius:999px;padding:3px 10px;color:#5d4037;transition:opacity .4s;will-change:transform}
.hm-word.gone{opacity:0}
.hm-bowl{position:absolute;left:0;bottom:6px;width:110px;z-index:2;pointer-events:none}
.hm-gaki{width:70px;margin:0 auto -14px;transition:transform .3s}.hm-gaki .gaki{width:100%}
.hm-gaki.melt{transform:scale(1.15,.85)}.hm-gaki.shy{transform:scale(.8)}
.hm-cup{height:34px;border-radius:0 0 60px 60px;background:#c58b5a;border:3px solid #7b4b2a;border-top-width:5px;transition:transform .2s}
.hm-bowl.wobble .hm-cup{animation:hmwob .3s ease-in-out infinite alternate}
@keyframes hmwob{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}
.hm-bowl.spill .hm-cup{transform:rotate(40deg);animation:none}
.hm-start{position:absolute;left:50%;top:40%;transform:translateX(-50%);background:rgba(255,255,255,.92);border-radius:999px;padding:8px 18px;font-weight:900;z-index:3}
.hm-legend{display:flex;gap:12px;font-size:11px;font-weight:700}.hm-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:3px;vertical-align:-1px}
.hm-end{top:30%}

/* v0.7: 浮かぶ文字を折り返さない（こぼれた表示が縦にならないように） */
.floattext.nowrap { white-space: nowrap; }

/* v0.8 D2: 良い＝丸い・暖色・丸いしるし、悪い＝角を落とした八角形・灰むらさきのしま模様・四角いしるし（色覚に頼らない） */
.ts-card{height:44px;padding:0 4px;gap:2px;line-height:1.1;text-align:left}
.ts-card em{font-style:normal;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:11px}
.ts-card span{font-size:14px}
.ts-mark{font-style:normal;display:inline-grid;place-items:center;width:15px;height:15px;font-size:11px;font-weight:900;flex:none}
.ts-card.good{border-radius:22px}
.ts-card.good .ts-mark{border-radius:50%;background:#ff8a50;color:#fff}
.ts-card.k-goodC{background:#fff3c4;border-color:#e8cf6c}
.ts-card.bad{border:none;border-radius:0;color:#3d3046;background:repeating-linear-gradient(135deg,#d8d0e0 0 6px,#c6bad2 6px 12px);clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px)}
.ts-card.bad .ts-mark{border-radius:2px;background:#5d4b6b;color:#fff}
.ts-card.k-block{background:repeating-linear-gradient(135deg,#bfb2cc 0 6px,#a998b8 6px 12px)}
.ts-legend{display:flex;justify-content:center;gap:12px;font-size:12px;font-weight:800;margin-top:4px}
.ts-legend .lg{padding:2px 10px}
.ts-legend .good{border-radius:12px;background:#ffe6ea;border:2px solid #f4a7b5}
.ts-legend .bad{background:repeating-linear-gradient(135deg,#d8d0e0 0 6px,#c6bad2 6px 12px);color:#3d3046}

/* v0.8 O2: 送り主のしるし（○☆♥）、石と前ぶれの影（光らない。影は大きくなるだけ） */
.hm-word i{font-style:normal;margin-right:3px;color:var(--c)}
.hm-word.snd-fam{border-width:3px;font-weight:900}
.hm-word.snd-str{border-style:dashed}
.hm-legend i{font-style:normal;display:inline-block;width:auto;height:auto;background:none!important;color:var(--c,#555);margin-right:2px}
.hm-legend .snd-stone i{color:#7a6e66}
.hm-stone{position:absolute;left:0;top:0;width:30px;height:24px;border-radius:45% 55% 50% 40%;background:#9b8f86;border:3px solid #6f645c}
.hm-shadows{position:absolute;inset:0;pointer-events:none}
.hm-shadow{position:absolute;bottom:22px;width:44px;height:12px;border-radius:50%;background:rgba(70,55,45,.28);transform:translateX(-50%) scale(.4)}
.ts-mark{width:18px;height:18px;font-size:12px}
.ts-card em{font-size:11.5px}
.hm-shadow{bottom:6px;width:52px;height:14px;background:rgba(70,55,45,.38)}
/* v0.8 S2: 押したまま／離したまま の表示、次の操作、誘う言葉、ガキもいっしょに呼吸（大きさだけ。点滅なし） */
.br-status{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0 4px}
.br-hand{font-weight:900;font-size:16px;padding:6px 12px;border-radius:14px;border:3px solid #4a90d9}
.br-hand.press{background:#4a90d9;color:#fff}
.br-hand.release{background:#fff;color:#2f6aa8;border-style:dashed}
.br-next{font-size:13px;font-weight:800;color:#5d4a3a;text-align:right}
.br-say{position:absolute;left:0;right:0;top:8px;text-align:center;font-weight:800;font-size:14px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.br-gaki{transform-origin:50% 90%}
.br-sky4{background:linear-gradient(#2f9ee8,#e2f5ff)}
.br-scene.sky4 .br-sky1,.br-scene.sky4 .br-sky2,.br-scene.sky4 .br-sky3,.br-scene.sky4 .br-sky4{opacity:1}
.br-scene.sky4 .br-sun{transform:translateY(-180px)}
.br-skip{display:block;margin:6px auto 0;font-size:13px}
.br-skip{background:none;border:0;color:#7a5a44;text-decoration:underline;font:inherit;font-size:13px;padding:6px}

/* v0.8 B2: 持ち上げる物の絵・腕・持ち上げゲージ。切り替えは大きさだけの1回きりの動き（点滅なし） */
.kt-lifter{width:180px;margin-left:-90px;bottom:6px;height:220px}
.kt-rig{position:absolute;left:0;top:0;width:180px;height:200px;z-index:2;overflow:visible}
.kt-arm{stroke:#222;stroke-width:9;stroke-linecap:round}
.kt-lifter .kt-gaki{position:absolute;left:40px;top:96px;width:100px;transition:none}
.kt-lifter.up .kt-gaki{transform:translateY(-4px) scaleY(1.03)}
.kt-weight{display:none}
.kt-wname{position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);background:#fff;border:2px solid #333;border-radius:8px;padding:1px 8px;font-size:13px;white-space:nowrap;z-index:3}
.kt-objin{transform-box:fill-box;transform-origin:50% 100%}
.kt-objin.swap{animation:ktswap .6s ease-out 1}
@keyframes ktswap{0%{transform:scale(.5)}70%{transform:scale(1.08)}100%{transform:scale(1)}}
.kt-gauge{position:absolute;right:14px;bottom:24px;width:16px;height:150px;border-radius:8px;background:#efe3d3;border:2px solid #b08b66;overflow:hidden;z-index:3}
.kt-gauge i{position:absolute;left:0;right:0;bottom:0;height:0;background:#ff9f6e}
.kt-gauge small{position:absolute;top:-2px;left:-2px;right:-2px;font-size:8px;text-align:center;color:#7a5a44}
.kt-gauge.top{border-color:#e65100}
.kt-arm-o{stroke:#222;stroke-width:13;stroke-linecap:round}
.kt-arm{stroke:var(--arm,#f3d9b1);stroke-width:7;stroke-linecap:round}
.prev-best{font-size:11px;font-weight:600;color:#9a8574}
.gc-best .prev-best,.prev-best{font-weight:500}

/* v0.9 D2 ペースの帯（段が上がると少し濃くなるだけ。点滅なし） */
.ts-pace{position:absolute;right:8px;top:40px;z-index:3;font-size:11px;color:#8a5a3c;background:#fff6ec;border:1px solid #f0d6bf;border-radius:10px;padding:1px 8px;pointer-events:none}
.ts-pace b{letter-spacing:1px;color:#e0803f}
.ts-pace.p1{background:#ffeedd}.ts-pace.p2{background:#ffe2c6;color:#7a4320}
/* v0.9 O2 届く場所の札（友だち☆・家族♥）。石の影（灰色の楕円）と色・形で区別。だんだん濃くなるだけ（点滅なし） */
.hm-mark{position:absolute;bottom:26px;transform:translateX(-50%);width:22px;height:18px;border-radius:5px 5px 11px 11px;border:2px solid var(--c);background:#fff;color:var(--c);font-size:12px;line-height:14px;text-align:center;font-weight:900;opacity:.45;pointer-events:none}
.hm-mark::after{content:'';position:absolute;left:50%;bottom:-7px;margin-left:-4px;border:4px solid transparent;border-top-color:var(--c)}
.hm-pace{position:absolute;left:50%;top:42px;transform:translateX(-50%);z-index:4;font-size:12px;color:#5d4037;background:rgba(255,255,255,.85);border-radius:10px;padding:2px 10px;pointer-events:none;white-space:nowrap}
.area-banner small{font-weight:600;font-size:11px;margin-left:4px}
/* v0.10 O2 場所の背景（上部だけ。うすい1色。段が上がると hm-bg の opacity が1.5秒でゆっくり変わる＝フェード、点滅なし） */
.hm-sky{position:absolute;left:0;top:0;width:100%;height:150px;pointer-events:none}