/* 運命の日：五十年転生と同じ「漆黒・金・朱」に、夜明け前の藍を足す。一つの見た目（暗い画面）に決めている */
:root{
  --bg:#0F0E0C; --bg2:#17150F; --panel:#1C1A15; --line:#3A3326; --ink:#ECE4D2; --sub:#A99D84;
  --gold:#C9A452; --gold2:#E6C878; --shu:#B83A26; --shu2:#e7a091; --ai:#2B4A7A; --dawn:#2a3550; --good:#7FB38A; --sea:#121a26;
  --f-brush:"Yuji Syuku","Shippori Mincho B1",serif;
  --f-body:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  color-scheme:dark;
}
[hidden]{display:none!important}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
html.bigtext{font-size:112%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.8;
  background-image:radial-gradient(ellipse at 50% -10%,color-mix(in srgb,var(--dawn) 70%,transparent),transparent 55%),radial-gradient(ellipse at 50% 120%,color-mix(in srgb,var(--shu) 14%,transparent),transparent 60%);
  background-attachment:fixed;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
html[data-fx="fire"] body{background-image:radial-gradient(ellipse at 50% 120%,color-mix(in srgb,var(--shu) 45%,transparent),transparent 65%),radial-gradient(ellipse at 50% -10%,#1d1a26,transparent 55%)}
html[data-fx="rain"] body,html[data-fx="storm"] body{background-image:radial-gradient(ellipse at 50% -10%,#1f2a38,transparent 60%)}
html[data-fx="snow"] body{background-image:radial-gradient(ellipse at 50% -10%,#2b3340,transparent 60%)}
html[data-fx="leaves"] body,html[data-fx="petals"] body{background-image:radial-gradient(ellipse at 50% -10%,#2e2420,transparent 60%)}
#fxbg{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.wrap{position:relative;z-index:1;max-width:760px;margin:0 auto;padding-block:12px 60px;display:flex;flex-direction:column;gap:16px}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
.brush{font-family:var(--f-brush)}
a{color:var(--gold)}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.lbl{font-size:13px;letter-spacing:.2em;color:var(--sub);margin:0 0 4px}
.muted{color:var(--sub);font-size:14px}
.c{text-align:center;justify-content:center}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:8px 0}
.btn{display:inline-block;border:1px solid var(--gold);background:color-mix(in srgb,var(--bg) 70%,transparent);color:var(--gold2);padding:9px 18px;border-radius:2px;letter-spacing:.08em;text-decoration:none;transition:background .2s,transform .1s}
.btn:hover{background:color-mix(in srgb,var(--gold) 14%,var(--bg))}
.btn:active{transform:translateY(1px)}
.btn.pri{background:linear-gradient(180deg,#D6B262,#A88534);color:#1A140A;border-color:#E6C878;font-weight:700;animation:ctaGlow 2.6s ease-in-out infinite}
.btn.shu{background:var(--shu);border-color:var(--shu);color:#F7EBDD}
.btn.big{font-size:20px;padding:14px 40px;font-family:var(--f-brush);letter-spacing:.2em}
.btn.sm{padding:3px 10px;font-size:14px}
.btn[aria-pressed="true"]{background:var(--gold);color:#16120A}
.btn:disabled{opacity:.5;animation:none}
@keyframes ctaGlow{0%,100%{box-shadow:0 0 0 0 rgba(230,200,120,0)}50%{box-shadow:0 0 22px 2px rgba(230,200,120,.35)}}
.panel{background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--line);padding:16px;margin:10px 0}
.panel.gold{border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
.panel h3{font-size:20px;color:var(--gold2);margin-bottom:8px}
.ttl{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:10px}
.ttl h3{font-size:22px;color:var(--gold2)}
.jinmaku{height:52px;background:repeating-linear-gradient(90deg,#141210 0 70px,#1b1813 70px 72px);border-block:3px solid var(--gold);display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px}
.jinmaku .brandt{font-family:var(--f-brush);font-size:24px;color:var(--gold2);letter-spacing:.15em;text-decoration:none;white-space:nowrap}
.topnav{display:flex;gap:6px;align-items:center}
.topnav a{font-size:13px;white-space:nowrap}

/* はじめ */
.hero{text-align:center;padding:24px 0 4px}
.hero h1{display:flex;flex-direction:column;align-items:center;gap:6px;margin:6px 0 18px}
.hero h1 .s{font-size:22px;color:var(--gold2);letter-spacing:.5em;padding-left:.5em;animation:fadeUp 1.2s ease both}
.hero h1 .d{font-size:clamp(50px,14vw,100px);line-height:1.05;color:var(--ink);text-shadow:0 0 40px color-mix(in srgb,var(--shu) 45%,transparent);animation:inkIn 1.8s ease both .2s}
.hero .lead{max-width:30em;margin:0 auto 18px;animation:fadeUp 1.2s ease both .8s}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes inkIn{from{opacity:0;filter:blur(10px);letter-spacing:.3em}to{opacity:1;filter:none}}
.daily{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:linear-gradient(120deg,color-mix(in srgb,var(--shu) 18%,var(--panel)),var(--panel))}
.dl-l{min-width:0;flex:1}
.dl-n{font-size:28px;margin:0;line-height:1.3}
.tstats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center;font-size:13px;color:var(--sub)}
.tstats span{border:1px solid var(--line);padding:6px 2px;background:var(--panel)}
.tstats b{display:block;font-size:20px;color:var(--gold2);font-family:var(--f-brush);font-weight:400}
.menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.menu button{background:linear-gradient(180deg,var(--bg2),var(--panel));border:1px solid var(--line);padding:12px 10px;text-align:left;transition:border-color .2s,transform .2s}
.menu button:hover{border-color:var(--gold);transform:translateY(-2px)}
.menu b{display:block;font-size:19px;color:var(--gold2);font-weight:400}
.menu small{color:var(--sub);font-size:13px}
@media (max-width:480px){.tstats{grid-template-columns:repeat(2,1fr)}}
.odds-t table{width:100%;border-collapse:collapse;font-size:15px}
.odds-t td{border-bottom:1px solid var(--line);padding:6px 4px;vertical-align:top}
.odds-t td:last-child{white-space:nowrap;text-align:right;color:var(--gold2)}
.tier{display:inline-block;font-size:13px;padding:1px 8px;border:1px solid var(--gold);color:var(--gold2);letter-spacing:.05em;white-space:nowrap}
.tier.ur{background:var(--shu);border-color:#e0705c;color:#fff;animation:urPulse 1.6s ease-in-out infinite}
.tier.ssr{background:linear-gradient(90deg,#A88534,#E6C878,#A88534);background-size:200% 100%;color:#1A140A;border-color:#E6C878;animation:shine 3s linear infinite}
.tier.sr{border-color:var(--gold2)}
@keyframes urPulse{50%{box-shadow:0 0 12px 2px rgba(214,90,60,.7)}}
@keyframes shine{to{background-position:-200% 0}}
.new{display:inline-block;font-size:12px;color:var(--good);border:1px solid var(--good);padding:0 6px;margin-left:4px;animation:pop .6s ease both 1.2s}
@keyframes pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.15)}100%{transform:none;opacity:1}}

/* 人物画像 */
.pt{position:relative;margin:0;background:#0b0a08;border:1px solid var(--line);overflow:hidden;aspect-ratio:2/3;max-width:100%}
.pt .pn{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;color:color-mix(in srgb,var(--gold) 55%,transparent);font-size:1.6em;letter-spacing:.2em}
.pt img{position:relative;width:100%;height:100%;object-fit:cover;display:block}
.pt.big{width:min(220px,46vw);border-color:var(--gold)}
.pt.mid{width:min(220px,56vw);margin:10px auto;border-color:var(--gold)}
.pt.sm{width:46px;flex:none}.pt.sm .pn{font-size:11px;letter-spacing:0}
.pt.zp .pn{font-size:13px}
.pt.mono img{filter:grayscale(1) contrast(1.1) brightness(.8);animation:fadeMono 3s ease both}
@keyframes fadeMono{from{filter:none}to{filter:grayscale(1) contrast(1.1) brightness(.8)}}

/* 目覚め */
.wake{text-align:center;padding-top:16px}
.wk-stage{min-height:62vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.wk-date{font-size:clamp(22px,6.4vw,32px);white-space:nowrap;color:var(--gold2);margin:0 0 6px;min-height:1.4em}
.wk-fuda{width:min(220px,56vw);aspect-ratio:2/3;perspective:900px;opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s;cursor:pointer;position:relative}
.wk-fuda.ready{opacity:1;transform:none}
.wk-back{position:absolute;inset:0;border:2px solid var(--gold);background:repeating-linear-gradient(45deg,#1b1812 0 10px,#15130e 10px 20px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--gold2);font-size:22px;letter-spacing:.3em;backface-visibility:hidden;transition:transform .7s ease}
.wk-back .mon{width:70px;height:70px;border:2px solid var(--gold);border-radius:50%;position:relative}
.wk-back .mon::before,.wk-back .mon::after{content:"";position:absolute;inset:12px;border:2px solid var(--gold);transform:rotate(45deg)}
.wk-back .mon::after{inset:24px;border-radius:50%;transform:none}
.wk-fuda.ready:hover .wk-back{transform:rotateY(8deg)}
.wk-fuda.glow-ssr .wk-back{box-shadow:0 0 30px rgba(230,200,120,.5);animation:fudaGlow 1.4s ease-in-out infinite}
.wk-fuda.glow-ur .wk-back{border-color:#e0705c;box-shadow:0 0 40px rgba(214,90,60,.7);animation:fudaGlowR 1s ease-in-out infinite}
.wk-fuda.glow-sr .wk-back{box-shadow:0 0 18px rgba(200,200,220,.35)}
@keyframes fudaGlow{50%{box-shadow:0 0 50px rgba(230,200,120,.8)}}
@keyframes fudaGlowR{50%{box-shadow:0 0 70px rgba(240,90,50,.95);transform:scale(1.02)}}
.wk-fuda.flip .wk-back{transform:rotateY(180deg) scale(1.1);opacity:0;transition:transform .7s ease,opacity .7s ease .3s}
.wk-hint{animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.3}}
.wk-lead{font-size:20px;margin:6px 0}
.wk-card{display:flex;gap:18px;align-items:flex-start;text-align:left;background:var(--panel);border:1px solid var(--line);padding:16px;margin:8px 0}
.wk-card.ssr{border-color:var(--gold);box-shadow:0 0 30px color-mix(in srgb,var(--gold) 30%,transparent)}
.wk-card.ur{border-color:var(--shu);box-shadow:0 0 40px color-mix(in srgb,var(--shu) 45%,transparent)}
.wk-info{flex:1;min-width:0}
.wk-info h2{font-size:clamp(26px,6vw,38px);line-height:1.25;margin:6px 0 0}
.kv{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:10px 0;font-size:15px}
.kv dt{color:var(--sub)}.kv dd{margin:0}
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.stats span{position:relative;border:1px solid var(--line);padding:0 4px;font-size:13px;text-align:center;overflow:hidden}
.stats i{display:block;font-style:normal;color:var(--sub);font-size:12px}
.stats b{position:relative;z-index:1}
.stats s{position:absolute;left:0;bottom:0;height:3px;background:var(--gold);text-decoration:none;animation:grow 1.2s ease both 1.6s;transform-origin:left}
@keyframes grow{from{transform:scaleX(0)}}
.odds{color:var(--gold2);font-size:15px}
.bio{text-align:left;font-size:15px;color:var(--sub)}
.bio summary{cursor:pointer}
.rev>*{opacity:0;animation:rise .9s ease forwards}
.rev>*:nth-child(1){animation-delay:.1s}.rev>*:nth-child(2){animation-delay:.6s}.rev>*:nth-child(3){animation-delay:1s}
.rev>*:nth-child(4){animation-delay:1.8s}.rev>*:nth-child(5){animation-delay:2.2s}.rev>*:nth-child(6){animation-delay:2.4s}.rev>*:nth-child(7){animation-delay:2.6s}
.rev .wk-card{animation-name:cardIn}
@keyframes rise{from{opacity:0;transform:translateY(10px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes cardIn{0%{opacity:0;transform:scale(.85) rotateX(20deg)}60%{opacity:1;transform:scale(1.03)}100%{opacity:1;transform:none}}
@media (max-width:520px){.wk-card{flex-direction:column;align-items:center;text-align:center}.kv{text-align:left}}

/* 地図 */
.mapbox{margin:10px 0}
.map{width:100%;height:auto;display:block;background:var(--sea);border:1px solid var(--line)}
.map .sea{fill:var(--sea)}
.map .pv{stroke:#0c0b09;stroke-width:.8;transition:fill 1.2s ease}
.map .pv.chg{animation:pvFlash 1.4s ease}
@keyframes pvFlash{30%{filter:brightness(1.8)}}
.map .arw{fill:none;stroke:var(--c);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:6 5;opacity:.95;animation:march 1s linear infinite,arwIn 1.2s ease both}
@keyframes march{to{stroke-dashoffset:-22}}
@keyframes arwIn{from{opacity:0}}
.map .me-pin circle{fill:#fff;stroke:var(--shu);stroke-width:2}
.map .me-pin .pulse{fill:none;stroke:#fff;animation:pinP 1.6s ease-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes pinP{from{transform:scale(.6);opacity:1}to{transform:scale(2.4);opacity:0}}
.map .cap{fill:#fff;font-size:14px;text-anchor:middle;paint-order:stroke;stroke:#000;stroke-width:3px;font-family:var(--f-body)}
.lgd{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px;color:var(--sub);margin-top:4px}
.lg-i i{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:middle}
.lg-i b{color:var(--ink);margin-left:3px;font-weight:400}
.mini{margin:10px 0;border:1px solid var(--line)}
.mini .map{border:0}

/* 段階 */
.tl{list-style:none;display:flex;gap:3px;padding:0;margin:4px 0 10px}
.tl li{flex:1;height:6px;background:var(--line);position:relative}
.tl li.sp-m{flex:1.4}.tl li.sp-y{flex:1.8}
.tl li.done{background:var(--gold)}
.tl li.now{background:var(--shu);animation:nowP 1.4s ease-in-out infinite}
@keyframes nowP{50%{opacity:.5}}
.tl li span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hud{display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between;background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--line);padding:8px;font-size:15px}
.hud .me{display:flex;gap:10px;align-items:center;background:none;border:0;text-align:left;padding:0}
.hud .me small{display:block;color:var(--sub);font-size:13px}
.meters{display:flex;gap:12px;font-size:14px;color:var(--sub)}.meters b{color:var(--gold2)}
.pw{min-width:170px;flex:1;max-width:280px;background:none;border:0;text-align:left;padding:0}
.bar{position:relative;height:18px;margin:2px 0;background:color-mix(in srgb,var(--line) 50%,transparent);font-size:13px}
.bar i{position:absolute;inset:0 auto 0 0;opacity:.75;transition:width 1s ease}
.bar span{position:relative;padding-left:6px;text-shadow:0 0 3px #000}
.sh{text-align:center;margin:16px 0 6px}
.sh .span{display:inline-block;font-size:13px;border:1px solid var(--shu);color:var(--shu2);padding:0 10px;margin:0}
.sh h2{font-size:clamp(26px,7vw,40px);color:var(--gold2);line-height:1.3;margin:4px 0}
.date-in{animation:dateIn 1s ease both}
@keyframes dateIn{from{opacity:0;letter-spacing:.4em;filter:blur(6px)}to{opacity:1;filter:none}}
.sh .st{margin:0;color:var(--sub);letter-spacing:.3em}
.scene{background:color-mix(in srgb,var(--panel) 90%,transparent);border-left:3px solid var(--gold);padding:12px 16px;font-size:17px;animation:fadeUp .8s ease both .3s}
.scene p{margin:0}
.sc-fire{border-left-color:var(--shu);box-shadow:inset 40px 0 60px -40px rgba(184,58,38,.5)}
.sc-storm,.sc-rain{border-left-color:#6f8bb3}
.choices{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.ch{text-align:left;background:color-mix(in srgb,var(--bg2) 92%,transparent);border:1px solid var(--gold);padding:12px 16px;border-radius:2px;transition:background .15s,transform .15s;animation:chIn .5s ease both}
.ch:hover{background:color-mix(in srgb,var(--gold) 14%,var(--bg2));transform:translateX(4px)}
.ch:disabled{opacity:.5}
.ch b{display:block;font-size:17px;color:var(--ink)}
.ch small{display:block;color:var(--sub);font-size:14px;margin-top:2px}
@keyframes chIn{from{opacity:0;transform:translateX(-12px)}}
.res{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.said{font-style:italic;color:var(--gold2);margin:0;animation:fadeUp .5s ease both}
.news{background:color-mix(in srgb,var(--ai) 22%,var(--panel));border:1px solid color-mix(in srgb,var(--ai) 60%,var(--line));padding:10px 14px;animation:fadeUp .6s ease both}
.news p{margin:4px 0;animation:fadeUp .6s ease both}
.news b{color:#ffd8a8;font-weight:700;background:linear-gradient(transparent 60%,rgba(184,58,38,.45) 60%)}
.mine{border-left:3px solid var(--good);padding:4px 12px;animation:fadeUp .6s ease both}
.mine p{margin:2px 0}
#nextBtn{display:block;margin:8px auto 0}

/* 合戦 */
.bt{border:1px solid var(--gold);background:linear-gradient(180deg,#1a1610,#120f0b);padding:12px;text-align:center;overflow:hidden;position:relative}
.bt-n{font-size:24px;color:var(--gold2);margin:0 0 8px;animation:dateIn .8s ease both}
.bt-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.bt-s{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;transition:transform .6s ease,opacity .6s}
.bt-s .flag{width:16px;height:46px;background:var(--c);border:1px solid #000;position:relative;animation:wave 1.2s ease-in-out infinite}
.bt-s .flag::before{content:"";position:absolute;left:-3px;top:-6px;width:2px;height:58px;background:#b8a27a}
@keyframes wave{50%{transform:skewY(6deg)}}
.bt-s b{font-size:16px}.bt-s small{color:var(--sub);font-size:12px}
.bt-vs{font-size:28px;color:var(--shu2)}
.bt.go .bt-s.a{transform:translateX(18%)}.bt.go .bt-s.b{transform:translateX(-18%)}
.bt-bar{position:relative;display:flex;height:14px;margin:12px 0 6px;background:#000;overflow:hidden}
.bt-bar i{height:100%;transition:flex-basis 1s ease}
.bt-bar .ba{flex:0 0 50%}.bt-bar .bb{flex:1}
.bt.go .bt-bar .ba{flex-basis:var(--w)}
.bt.wa .bt-bar .ba{flex-basis:100%}.bt.wb .bt-bar .ba{flex-basis:0}
.bt-bar .clash{position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,#fff 50%,transparent 55%);opacity:0}
.bt.go .clash{animation:clash .5s ease 1.1s 2}
@keyframes clash{50%{opacity:.9}}
.bt.wa .bt-s.b,.bt.wb .bt-s.a{opacity:.35;transform:none}
.bt-r{min-height:1.6em;margin:4px 0 0;font-size:18px}
.stamp{display:inline-block;border:3px solid var(--shu);color:var(--shu2);font-family:var(--f-brush);font-size:26px;padding:0 10px;margin-right:8px;transform:rotate(-8deg);animation:stampIn .5s cubic-bezier(.2,1.6,.4,1) both}
.stamp.sm{font-size:17px;border-width:2px;padding:0 6px}
@keyframes stampIn{from{transform:scale(2.4) rotate(-8deg);opacity:0}to{transform:scale(1) rotate(-8deg);opacity:1}}
.shake{animation:shake .45s ease}
@keyframes shake{20%{transform:translate(-6px,2px)}40%{transform:translate(5px,-3px)}60%{transform:translate(-4px,2px)}80%{transform:translate(3px,-1px)}}
.flash{position:fixed;inset:0;background:rgba(255,255,255,.3);pointer-events:none;z-index:50;animation:flash .7s ease forwards}
@keyframes flash{to{opacity:0}}

/* 死・天下 */
.dth{text-align:center;padding:30px 0;animation:fadeUp 1.4s ease both}
.dth .d1{font-size:24px;color:var(--shu2);margin:8px 0}
.dth .d2{font-size:21px;line-height:1.9;animation:inkIn 2.2s ease both .6s}
.dth .d3{animation:fadeUp 1s ease both 1.8s}
.dth .btn{animation:fadeUp 1s ease both 2.4s}
.tenka{text-align:center}
.tenka .map{animation:fadeUp 1.2s ease both}
.tk1{color:var(--sub);margin:14px 0 0;animation:fadeUp 1s ease both .6s}
.tk2{font-size:clamp(28px,8vw,46px);color:var(--gold2);margin:0;line-height:1.35;text-shadow:0 0 30px rgba(230,200,120,.5);animation:tenkaIn 1.6s cubic-bezier(.2,1.3,.4,1) both 1s}
@keyframes tenkaIn{from{opacity:0;transform:scale(1.8);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.tkp{animation:fadeUp 1s ease both 1.8s}
.tenka .btn{animation:fadeUp 1s ease both 2.2s}

/* 結末 */
.end{text-align:center}
.fuda{background:linear-gradient(180deg,#1b1a22,#0b0a08);border:3px double var(--gold);padding:22px 16px;margin:8px auto;max-width:420px;position:relative;animation:cardIn 1s ease both}
.fuda.f-ur{border-color:#d65a3c;box-shadow:0 0 40px rgba(214,90,60,.4)}
.fuda.f-ssr{box-shadow:0 0 30px rgba(230,200,120,.3)}
.fuda::before,.fuda::after{content:"";position:absolute;width:14px;height:14px;border:2px solid var(--gold);border-radius:50%;top:8px}
.fuda::before{left:8px}.fuda::after{right:8px}
.fuda .f1{font-size:clamp(24px,6.5vw,32px);line-height:1.4;margin:0}
.fuda .f3{font-size:18px;margin:8px 0}
.fuda .f4 b{font-size:38px;color:var(--gold2);display:inline-block;animation:stampIn .6s cubic-bezier(.2,1.6,.4,1) both 1s;font-weight:400}
.fuda .f5{color:var(--sub);margin:8px 0 0;font-size:15px}
.fuda .f6{font-size:clamp(22px,6vw,30px);margin:0;line-height:1.4}
.unl{display:flex;gap:10px;align-items:center;justify-content:center;background:color-mix(in srgb,var(--gold) 10%,var(--panel));border:1px solid var(--gold);padding:8px;margin:6px 0;animation:pop .6s ease both 1.2s;text-align:left}
.unl small{display:block;color:var(--sub);font-size:13px}
.end .panel{text-align:left}
.end ul{margin:0;padding-left:1.2em}
.lg{border-bottom:1px solid var(--line);padding:6px 0}.lg p{margin:2px 0}
.cardimg{width:100%;max-width:360px;display:block;margin:0 auto}

/* 図鑑・記録・称号・列伝帳 */
.prog{height:6px;background:var(--line);margin-bottom:10px}.prog i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));animation:grow 1s ease both;transform-origin:left}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:8px}
.chip{flex:none;border:1px solid var(--line);background:var(--panel);padding:3px 10px;font-size:13px;border-radius:12px}
.chip[aria-pressed="true"]{border-color:var(--gold);color:var(--gold2)}
.zk{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:6px}
.zi{background:var(--panel);border:1px solid var(--line);padding:4px;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:2px;animation:fadeUp .4s ease both;min-width:0}
.zi b{font-weight:400;line-height:1.3;text-align:center;word-break:break-all}
.zi small{color:var(--gold2);font-size:11px}
.zi .pt{width:100%}
.zi.unk{opacity:.55}.zi.unk .pt{background:#000}
.zi.t-ssr{border-color:var(--gold)}.zi.t-ur{border-color:var(--shu)}
.zi:hover{border-color:var(--gold2)}
.pm{display:flex;gap:14px;align-items:flex-start}.pm .pt{flex:none;width:130px;margin:0}
.pm>div{min-width:0}
.bio2{font-size:15px;color:var(--sub)}
@media (max-width:480px){.pm{flex-direction:column;align-items:center}}
.ends{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.ed{border:1px solid var(--gold);background:linear-gradient(180deg,#1f1b12,var(--panel));padding:12px;text-align:center}
.ed p{margin:0;font-size:18px;color:var(--gold2)}.ed small{color:var(--sub);font-size:13px}
.ed.unk{border-color:var(--line);background:var(--panel)}.ed.unk p{color:var(--sub)}
.achs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.ac{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--panel);padding:8px}
.ac .seal{flex:none;width:34px;height:34px;border:2px solid var(--shu);color:var(--shu2);display:flex;align-items:center;justify-content:center;font-size:18px;transform:rotate(-6deg)}
.ac.unk .seal{border-color:var(--line);transform:none}
.ac b{display:block;font-size:16px}.ac small{display:block;color:var(--sub);font-size:13px}
.ac.unk b{color:var(--sub)}
.pl{display:flex;flex-direction:column;gap:6px}
.pr{display:flex;gap:10px;align-items:center;text-align:left;background:var(--panel);border:1px solid var(--line);padding:6px}
.pr>div{flex:1;min-width:0}.pr small{display:block;color:var(--sub);font-size:13px}
.pr .g{font-size:26px;color:var(--gold2);width:40px;text-align:center}
.pr:hover{border-color:var(--gold)}

/* 指名・店 */
.ldrs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.ldr{display:flex;gap:8px;align-items:center;text-align:left;background:var(--bg2);border:1px solid var(--line);padding:6px;transition:border-color .2s}
.ldr:hover{border-color:var(--gold)}
.ldr>div{min-width:0}
.ldr b{display:block;font-size:15px}.ldr small{display:block;color:var(--sub);font-size:12px;line-height:1.4}
.shop{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:10px 0}
.shopi{display:flex;flex-direction:column;gap:2px;align-items:center;border:1px solid var(--gold);background:linear-gradient(180deg,#2a2314,#17130b);padding:12px;text-decoration:none;color:var(--ink)}
.shopi span{font-size:26px;color:var(--gold2)}
.shopi small{color:var(--sub);font-size:12px}
.code{font-family:ui-monospace,monospace;color:var(--gold2)}

/* 窓 */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px;padding-top:max(16px,env(safe-area-inset-top,0px));padding-bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:30;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}}
.mdbox{max-width:480px;width:100%;max-height:100%;overflow-y:auto;margin:0;animation:mdIn .3s ease}
.modal.wide .mdbox{max-width:720px}
@keyframes mdIn{from{transform:translateY(16px) scale(.98);opacity:0}}
.set{display:flex;flex-direction:column;gap:10px}
.set label{display:flex;gap:8px;align-items:center}
.how{padding-left:1.2em}.how li{margin:6px 0}
.toast{position:fixed;left:50%;bottom:max(20px,env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--panel);border:1px solid var(--gold);padding:10px 16px;z-index:40;max-width:calc(100% - 32px);animation:mdIn .3s ease}
.foot{border-top:1px solid var(--line);padding-top:12px;margin-top:20px}
.foot p{margin:4px 0}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* ===== v0.3：采配 ===== */
.sai{border:1px solid var(--shu);background:linear-gradient(180deg,#22130e,#120d0a);padding:12px;margin-top:12px;text-align:center;animation:saiIn .5s ease both}
@keyframes saiIn{from{opacity:0;transform:scale(.96)}}
.sai-t{font-size:22px;color:var(--shu2);margin:0}
.sai-r{margin:2px 0 8px;color:var(--gold2);letter-spacing:.2em;font-size:14px}
.sai-field{display:flex;justify-content:space-around;align-items:center;margin:6px 0}
.sai-field span{padding:4px 10px;border:2px solid var(--c);font-size:15px}
.sai-me{animation:pushR 1.6s ease-in-out infinite}.sai-foe{animation:pushL 1.6s ease-in-out infinite}
@keyframes pushR{50%{transform:translateX(6px)}}@keyframes pushL{50%{transform:translateX(-6px)}}
.sai-x{font-size:20px;color:var(--gold2);animation:spark 1s ease-in-out infinite}
@keyframes spark{50%{transform:scale(1.4);opacity:.6}}
.sai-h{background:color-mix(in srgb,var(--ai) 25%,transparent);padding:6px;font-size:15px;margin:8px 0;animation:fadeUp .5s ease both}
.sai-b{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.sai-b .ch{padding:8px;text-align:center}
.sai-b .ch b{font-size:17px}
.sai-w{background:color-mix(in srgb,var(--gold) 35%,var(--bg2))!important;animation:winPulse .6s ease}
.sai-x2{background:color-mix(in srgb,var(--shu) 40%,var(--bg2))!important}
.sai-d{background:color-mix(in srgb,var(--line) 60%,var(--bg2))!important}
@keyframes winPulse{50%{transform:scale(1.06)}}
.sai-res{font-size:17px;margin:8px 0 0;animation:stampIn .4s ease both}
.sai-res.w{color:var(--gold2)}.sai-res.l{color:var(--shu2)}
.sai-l{margin:6px 0}
.sai-sum{font-size:17px;color:var(--gold2);animation:fadeUp .5s ease both}
.sai-skip{margin-top:6px}
@media (max-width:420px){.sai-b{grid-template-columns:1fr}}

/* 天下の城 */
.castle{width:100%;height:auto;display:block;border:1px solid var(--gold);margin:8px 0;animation:fadeUp 1.2s ease both}
.castle .ctext{fill:#f3e6c0;font-size:26px;font-family:var(--f-brush);paint-order:stroke;stroke:#000;stroke-width:4px}
.castle .cflag{transform-origin:center bottom;transform-box:fill-box;animation:wave 1.4s ease-in-out infinite}
.castle .csun{animation:sunRise 3s ease both}
@keyframes sunRise{from{transform:translateY(60px);opacity:0}}

/* 縁・年表・シリーズ */
.ties .tl2{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px}
.tie{display:flex;gap:8px;align-items:center;border:1px solid var(--line);padding:4px;animation:fadeUp .5s ease both}
.tie>div{min-width:0}.tie b{display:block;font-size:15px}.tie small{display:block;color:var(--sub);font-size:13px}
.chr{list-style:none;padding:0 0 0 14px;margin:0;border-left:2px solid var(--gold)}
.chr li{position:relative;padding:4px 0 10px 10px;animation:fadeUp .4s ease both}
.chr li::before{content:"";position:absolute;left:-21px;top:12px;width:10px;height:10px;border-radius:50%;background:var(--gold);border:2px solid var(--bg)}
.chr li.alt::before{background:var(--shu);box-shadow:0 0 8px var(--shu)}
.chr p{margin:2px 0;font-size:15px}
.chr .chr-d{font-size:17px;color:var(--gold2)}.chr .chr-t{color:var(--sub);font-size:13px;letter-spacing:.2em}
.chr .chr-me{color:var(--good)}
.chr b{color:#ffd8a8}
.series{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.sr-i{border:1px solid var(--line);background:linear-gradient(180deg,var(--bg2),var(--panel));padding:12px;display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden}
.sr-i.on{border-color:var(--gold);box-shadow:0 0 20px rgba(230,200,120,.2)}
.sr-i:not(.on){filter:saturate(.4)}
.sr-y{margin:0;font-size:13px;color:var(--sub);letter-spacing:.2em}
.sr-t{margin:0;font-size:20px;color:var(--gold2);line-height:1.3}
.sr-s{margin:0;font-size:14px}
.sr-d{margin:0;font-size:13px;color:var(--sub)}
.sr-soon{align-self:flex-start;font-size:13px;border:1px dashed var(--sub);padding:0 8px;color:var(--sub)}

/* ===== v0.3：演出を足す ===== */
/* 段階の切り替え：陣幕が左右から閉じて開く */
.curtain{position:fixed;inset:0;z-index:45;pointer-events:none;display:flex}
.curtain i{flex:1;background:repeating-linear-gradient(90deg,#141210 0 60px,#1d1913 60px 62px);border-inline:3px solid var(--gold)}
.curtain i:first-child{animation:curL 1.1s ease forwards}.curtain i:last-child{animation:curR 1.1s ease forwards}
@keyframes curL{0%{transform:translateX(-100%)}40%,55%{transform:none}100%{transform:translateX(-100%)}}
@keyframes curR{0%{transform:translateX(100%)}40%,55%{transform:none}100%{transform:translateX(100%)}}
.curtain b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--f-brush);font-size:clamp(24px,7vw,40px);color:var(--gold2);white-space:nowrap;opacity:0;animation:curT 1.1s ease forwards;text-shadow:0 0 20px #000}
@keyframes curT{35%{opacity:0}45%,60%{opacity:1}75%{opacity:0}}
/* 身代・名の増減 */
.delta{position:fixed;z-index:46;pointer-events:none;font-family:var(--f-brush);font-size:20px;animation:floatUp 1.6s ease forwards}
.delta.up{color:var(--gold2)}.delta.dn{color:var(--shu2)}
@keyframes floatUp{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-50px)}}
.meters b{display:inline-block}.meters b.bump{animation:bump .6s ease}
@keyframes bump{40%{transform:scale(1.5);color:#fff}}
/* はじめの画面 */
.hero h1 .d{animation:inkIn 1.8s ease both .2s,flicker 6s ease-in-out infinite 2.5s}
@keyframes flicker{0%,100%{text-shadow:0 0 40px rgba(184,58,38,.45)}45%{text-shadow:0 0 52px rgba(214,90,60,.65)}50%{text-shadow:0 0 30px rgba(184,58,38,.35)}}
.daily{position:relative;overflow:hidden}
.daily::after{content:"";position:absolute;top:0;bottom:0;width:60px;left:-80px;background:linear-gradient(90deg,transparent,rgba(255,240,200,.12),transparent);animation:ribbon 4s ease-in-out infinite}
@keyframes ribbon{60%,100%{left:110%}}
.menu button:hover b{animation:menuGlow .8s ease}
@keyframes menuGlow{50%{text-shadow:0 0 12px rgba(230,200,120,.8)}}
/* 目覚め */
.wk-lead{animation:tremble 4s ease-in-out infinite 3s}
@keyframes tremble{0%,92%,100%{transform:none}94%{transform:translateX(-1px)}96%{transform:translateX(1px)}}
.odds{animation:rollIn .8s ease both 2.4s}
@keyframes rollIn{from{opacity:0;transform:translateY(-12px) rotateX(90deg)}}
.map .me-pin{animation:pinDrop .8s cubic-bezier(.3,1.6,.5,1) both}
@keyframes pinDrop{from{transform:translateY(-40px);opacity:0}}
/* この世の動き */
.news b{background-size:0 100%;background-repeat:no-repeat;background-image:linear-gradient(transparent 60%,rgba(184,58,38,.55) 60%);animation:hlSweep 1s ease forwards .4s}
@keyframes hlSweep{to{background-size:100% 100%}}
.bt.go .bt-s .flag{animation:wave 1.2s ease-in-out infinite,flagHit .3s ease 1.1s 3}
@keyframes flagHit{50%{transform:translateY(-4px) rotate(-4deg)}}
/* 最期 */
.dth{position:relative}
.dth::before{content:"";position:absolute;left:50%;top:48%;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,rgba(0,0,0,.85),rgba(0,0,0,0) 70%);transform:translate(-50%,-50%);animation:inkDrop 3s ease forwards 1s;z-index:-1}
@keyframes inkDrop{to{width:520px;height:520px}}
/* 天下・札 */
.tk2{background:linear-gradient(90deg,#c9a452,#fff3c4,#c9a452);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:tenkaIn 1.6s cubic-bezier(.2,1.3,.4,1) both 1s,goldShimmer 3s linear infinite 2.6s}
@keyframes goldShimmer{to{background-position:-200% 0}}
.fuda{overflow:hidden}
.fuda .f1::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,240,200,.08),transparent);animation:edgeSweep 5s ease-in-out infinite 2s;pointer-events:none}
@keyframes edgeSweep{50%,100%{left:130%}}
.ac:not(.unk) .seal{animation:sealIn .5s cubic-bezier(.2,1.6,.4,1) both}
@keyframes sealIn{from{transform:scale(2) rotate(-30deg);opacity:0}}
.zi:not(.unk){position:relative;overflow:hidden}
.zi.t-ssr:not(.unk)::after,.zi.t-ur:not(.unk)::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,240,200,.25) 50%,transparent 60%);background-size:250% 100%;animation:cardShine 3.5s linear infinite}
@keyframes cardShine{from{background-position:150% 0}to{background-position:-100% 0}}
.sr-i.on{animation:floaty 4s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-4px)}}
.sai-field{position:relative}
.sai-field::after{content:"";position:absolute;left:50%;top:50%;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,rgba(170,150,110,.5),transparent 70%);transform:translate(-50%,-50%);animation:dustPuff 1.2s ease-out infinite}
@keyframes dustPuff{from{width:10px;height:10px;opacity:1}to{width:90px;height:90px;opacity:0}}

/* ===== v0.5〜0.6：札の装い・お題・連続日数・お知らせ ===== */
.fuda{--sf:var(--gold);--sb0:#1b1a22;--sb1:#0b0a08;--si:var(--ink);--sa:var(--gold2);background:linear-gradient(180deg,var(--sb0),var(--sb1));border-color:var(--sf);color:var(--si)}
.fuda .f0{margin:0 0 4px;font-size:13px;letter-spacing:.4em;color:var(--sa)}
.fuda .f4 b{color:var(--sa)}
.fuda.sk-sakura::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle at 20% 30%,rgba(244,184,200,.35) 0 3px,transparent 4px),radial-gradient(circle at 70% 60%,rgba(244,184,200,.3) 0 2px,transparent 3px),radial-gradient(circle at 40% 85%,rgba(244,184,200,.3) 0 3px,transparent 4px);animation:petalDrift 8s linear infinite}
@keyframes petalDrift{from{background-position:0 -40px}to{background-position:30px 400px}}
.fuda.sk-tenka{box-shadow:0 0 40px rgba(243,210,122,.45)}
.fuda.sk-tenka::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(243,210,122,.35) 1px,transparent 1.5px);background-size:14px 14px;animation:goldFleck 6s ease-in-out infinite}
@keyframes goldFleck{50%{opacity:.4}}
.skins{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.skin{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border:2px solid var(--f);background:linear-gradient(180deg,var(--b0),var(--b1));color:var(--i);text-align:center}
.skin .sk-f{font-size:20px;border:1px solid var(--f);padding:2px 10px;margin-bottom:4px}
.skin small{font-size:12px;opacity:.8}
.skin.on{box-shadow:0 0 0 3px var(--gold2);animation:pop .4s ease}
.skin.lock{filter:grayscale(.8) brightness(.6)}
.week .wk .wt{margin:4px 0;display:flex;gap:8px;align-items:center}
.week .wt span{flex:none;width:26px;height:26px;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;font-family:var(--f-brush)}
.week .wt.ok span{border-color:var(--shu);color:var(--shu2);transform:rotate(-8deg);animation:sealIn .5s ease both}
.week .wt.ok{color:var(--sub);text-decoration:line-through}
.dl-x{flex-basis:100%}
.stk{display:flex;gap:6px;margin-top:6px}
.stk span{flex:1;text-align:center;font-size:13px;border:1px solid var(--line);padding:2px 0;color:var(--sub)}
.stk span.ok{border-color:var(--gold);color:var(--gold2);background:color-mix(in srgb,var(--gold) 15%,transparent)}
.nws{padding-left:1.2em}.nws li{margin:6px 0}.nws b{color:var(--gold2);margin-right:8px}
.mdbox h4{font-weight:400;color:var(--gold2);margin:12px 0 4px;font-size:17px}
/* 移り変わり */
.rp{text-align:center}.rp-d{font-size:24px;color:var(--gold2);margin:0 0 6px;min-height:1.4em;animation:dateIn .6s ease}
.rp-n{min-height:3em;font-size:15px}.rp-n b{color:#ffd8a8}

/* ===== v0.8：段階の一枚絵 ===== */
.art{width:100%;height:auto;display:block;border:1px solid var(--line);margin-top:10px;animation:artIn 1.2s ease both}
@keyframes artIn{from{opacity:0;filter:blur(6px) brightness(.4)}}
.art .alabel{fill:#f3e6c0;font-family:var(--f-brush);font-size:26px;paint-order:stroke;stroke:#000;stroke-width:4px;opacity:.9}
.art .asmall{fill:#d8ccb0;font-family:var(--f-body);font-size:15px;opacity:.8}
.art .aflag{transform-box:fill-box;transform-origin:left top;animation:wave 1.4s ease-in-out infinite}
.art .aflame path{transform-box:fill-box;transform-origin:center bottom;animation:flame .9s ease-in-out infinite alternate}
@keyframes flame{from{transform:scaleY(.8) skewX(-4deg)}to{transform:scaleY(1.15) skewX(4deg)}}
.art .aglow{animation:glowP 2s ease-in-out infinite}
@keyframes glowP{50%{opacity:.7}}
.art .arain{animation:rainS .6s linear infinite}
@keyframes rainS{to{transform:translate(-6px,18px)}}
.art .asnow{animation:snowS 6s linear infinite}
@keyframes snowS{to{transform:translateY(30px)}}
.art .awave{animation:waveS 3s ease-in-out infinite alternate}
@keyframes waveS{to{transform:translateX(-20px)}}
.art .aship{animation:shipS 4s ease-in-out infinite alternate}
@keyframes shipS{to{transform:translate(12px,3px)}}
.art .apath{animation:march 1.2s linear infinite}
.art .alantern circle{animation:blink 2s ease-in-out infinite}
.art .aleaves{animation:snowS 8s linear infinite}
.art .asmoke{transform-box:fill-box;animation:smoke 3s ease-in-out infinite}
@keyframes smoke{50%{transform:translateY(-6px) scale(1.1);opacity:.3}}
.art .amoon{animation:fadeIn 2s ease both}
/* 題名が長くなったので見出しを調整 */
.jinmaku .brandt{font-size:clamp(16px,4.8vw,24px);letter-spacing:.08em}
.topnav .btn{white-space:nowrap}
@media (max-width:440px){.topnav a{display:none}}
.lnk{background:none;border:0;color:var(--gold);text-decoration:underline;font-size:14px;padding:4px}
.newsln{margin:0}
.tenka{overflow:hidden}
html,body{overflow-x:clip}

/* ===================== v1.0 はじめの画面と動き ===================== */
html,body{overflow-x:clip}
/* 一枚絵（画面いっぱいの幅） */
.hv{position:relative;width:100vw;margin-left:calc(50% - 50vw);height:clamp(500px,128vw,700px);overflow:hidden;background:#07060a;isolation:isolate;--mx:0;--my:0;--sy:0;cursor:crosshair}
@media (min-width:760px){.hv{height:min(86vh,720px)}}
.hv-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 30%,#5a160c 0,transparent 55%),radial-gradient(ellipse at 75% 25%,#14254a 0,transparent 55%),linear-gradient(#0b0810,#140a08);z-index:-2}
.hv-p{position:absolute;top:0;bottom:0;margin:0;width:64%;overflow:hidden;will-change:transform}
.hv-p img{width:100%;height:100%;object-fit:cover;object-position:50% 8%;display:block;transform:scale(1.08) translate(calc(var(--mx)*-14px),calc(var(--my)*-10px + var(--sy)*.12px));transition:transform .5s ease-out}
.hv-l{left:0;clip-path:polygon(0 0,95.3% 0,60.9% 100%,0 100%);animation:hvInL 1.2s cubic-bezier(.2,.8,.2,1) both}
.hv-r{right:0;clip-path:polygon(39.1% 0,100% 0,100% 100%,4.7% 100%);animation:hvInR 1.2s cubic-bezier(.2,.8,.2,1) both .15s}
.hv-l img{animation:kbL 22s ease-in-out infinite alternate 1.2s;filter:saturate(1.1) contrast(1.05)}
.hv-r img{animation:kbR 22s ease-in-out infinite alternate 1.4s;filter:saturate(1.05) contrast(1.05) brightness(.95)}
.hv-l::after,.hv-r::after{content:"";position:absolute;inset:0;pointer-events:none}
.hv-l::after{background:linear-gradient(90deg,transparent 50%,rgba(184,58,38,.25)),linear-gradient(180deg,transparent 40%,#07060a 96%)}
.hv-r::after{background:linear-gradient(270deg,transparent 50%,rgba(43,74,122,.3)),linear-gradient(180deg,transparent 40%,#07060a 96%)}
@keyframes hvInL{from{transform:translateX(-30%);opacity:0;filter:brightness(3)}to{transform:none;opacity:1;filter:none}}
@keyframes hvInR{from{transform:translateX(30%);opacity:0;filter:brightness(3)}to{transform:none;opacity:1;filter:none}}
@keyframes kbL{from{transform:scale(1.08) translate(calc(var(--mx)*-14px),calc(var(--sy)*.12px))}to{transform:scale(1.18) translate(calc(var(--mx)*-14px + 8px),calc(var(--sy)*.12px - 6px))}}
@keyframes kbR{from{transform:scale(1.08) translate(calc(var(--mx)*-14px),calc(var(--sy)*.12px))}to{transform:scale(1.18) translate(calc(var(--mx)*-14px - 8px),calc(var(--sy)*.12px - 6px))}}
.hv-slash{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.hv-slash line{stroke:#ffcf8a;stroke-width:7;vector-effect:non-scaling-stroke;stroke-dasharray:120;stroke-dashoffset:120;filter:drop-shadow(0 0 8px #ff7a2a) drop-shadow(0 0 22px #e0452a);opacity:.85;animation:slashIn .5s cubic-bezier(.7,0,.2,1) forwards 1.05s,slashGlow 2.8s ease-in-out infinite 1.6s}
.hv-slash line.core{stroke:#fff;stroke-width:2;filter:none;opacity:1}
@keyframes slashIn{to{stroke-dashoffset:0}}
@keyframes slashGlow{50%{opacity:.45}}
.hv-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#fff,rgba(255,200,140,.4) 40%,transparent 70%);opacity:0;pointer-events:none;z-index:3;animation:hvFlash .9s ease-out 1.25s}
@keyframes hvFlash{0%{opacity:0}12%{opacity:.85}100%{opacity:0}}
.hv-temple{position:absolute;left:0;right:0;bottom:0;width:100%;height:42%;z-index:1;pointer-events:none}
.hv-temple .hv-fl path{transform-box:fill-box;transform-origin:center bottom;animation:hvFlame .7s ease-in-out infinite alternate;opacity:.85;mix-blend-mode:screen}
.hv-temple .hv-glow{animation:glowP 2.2s ease-in-out infinite}
.hv-temple .hv-smk circle{opacity:.55;transform-box:fill-box;transform-origin:center;animation:hvSmoke 6s ease-in-out infinite}
.hv-temple .hv-flag{transform-box:fill-box;transform-origin:left top;animation:wave 1.4s ease-in-out infinite}
@keyframes hvFlame{from{transform:scaleY(.75) skewX(-4deg);fill:#ff8a3a}to{transform:scaleY(1.15) skewX(5deg);fill:#ffc04a}}
@keyframes hvSmoke{0%{transform:translateY(0) scale(1);opacity:.5}50%{transform:translateY(-14px) scale(1.15);opacity:.3}100%{transform:translateY(0) scale(1);opacity:.5}}
.hv-nm{position:absolute;z-index:4;margin:0;display:flex;gap:4px;align-items:flex-start;text-shadow:0 2px 8px #000,0 0 2px #000;animation:nmIn 1s ease both 1.7s}
.hv-nm b,.hv-nm small{writing-mode:vertical-rl;line-height:1.15}
.hv-nr{flex-direction:row-reverse}
.hv-nm b{font-weight:400;font-size:clamp(22px,6.4vw,38px);letter-spacing:.18em;color:#fff}
.hv-nm small{font-size:14px;color:var(--gold2);letter-spacing:.2em}
.hv-nl{left:max(14px,calc(50vw - 560px));top:16px}
.hv-nr{right:max(14px,calc(50vw - 560px));top:16px}
.hv-nl b{color:#ffd9c8}.hv-nr b{color:#d6e4ff}
@keyframes nmIn{from{opacity:0;transform:translateY(-16px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
.hv-seal{position:absolute;z-index:5;left:50%;top:42%;width:64px;height:64px;margin:-32px 0 0 -32px;display:grid;place-items:center;font-size:40px;color:#fff;background:#b8231a;border:3px double #ffd2c4;border-radius:8px;box-shadow:0 0 0 4px rgba(184,35,26,.35),0 6px 22px rgba(0,0,0,.6);transform:rotate(-8deg);animation:sealDrop .6s cubic-bezier(.3,1.6,.5,1) both 2.1s}
@keyframes sealDrop{0%{opacity:0;transform:rotate(-8deg) scale(2.6)}60%{opacity:1;transform:rotate(-8deg) scale(.9)}100%{opacity:1;transform:rotate(-8deg) scale(1)}}
.hv-t{position:absolute;z-index:6;left:0;right:0;bottom:0;padding:0 16px 18px;text-align:center;background:linear-gradient(180deg,transparent,rgba(7,6,10,.85) 40%,#0F0E0C)}
.hv-t .lbl{color:#d8c9a6;text-shadow:0 1px 3px #000;animation:fadeUp 1s ease both 1.9s}
.hv-t h1{display:flex;flex-direction:column;align-items:center;gap:2px;margin:0}
.hv-t h1 .s{font-size:clamp(15px,4.2vw,22px);color:var(--gold2);letter-spacing:.5em;padding-left:.5em;animation:fadeUp 1s ease both 1.6s}
.hv-t h1 .d{display:flex;flex-direction:column;align-items:center;line-height:1}
.hv-t h1 .d1{font-size:clamp(30px,9vw,54px);color:#f3e6c0;letter-spacing:.6em;padding-left:.6em;animation:inkIn 1.4s ease both 1.9s}
.hv-t h1 .d2{font-size:clamp(54px,16.5vw,118px);color:#fff;text-shadow:0 0 28px rgba(224,70,40,.75),0 4px 0 #3a0c06,0 0 2px #000;animation:inkBig 1.6s cubic-bezier(.2,.8,.2,1) both 2.1s;white-space:nowrap}
@keyframes inkBig{0%{opacity:0;transform:scale(1.5);filter:blur(14px);letter-spacing:.3em}60%{opacity:1;filter:blur(0)}100%{opacity:1;transform:none;letter-spacing:0}}
.hv-catch{margin:6px 0 0;font-size:clamp(16px,4.6vw,22px);color:#ffb59f;letter-spacing:.25em;overflow:hidden}
.hv-catch span{display:inline-block;animation:catchIn 1.2s steps(10) both 2.9s;white-space:nowrap;overflow:hidden;border-right:2px solid transparent}
@keyframes catchIn{from{max-width:0}to{max-width:20em}}

/* はじめの「目を覚ます」 */
.cta1{text-align:center;padding:6px 0 4px;position:relative}
.hv-q{font-family:var(--f-brush);font-size:clamp(20px,5.6vw,28px);margin:4px 0 6px;color:var(--ink)}
.hv-q b{color:var(--shu2);font-weight:400;font-size:1.3em}
.cta1 .lead{font-size:15px;max-width:32em;margin:0 auto 14px;color:#d8ceb6}
#wakeBtn{position:relative;overflow:hidden;font-size:24px;padding:16px 56px;min-width:min(320px,100%)}
#wakeBtn::after,.sbar .btn.pri::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:btnShine 3.2s ease-in-out infinite}
@keyframes btnShine{0%,55%{left:-60%}100%{left:130%}}
.cta-meta{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:10px 0 2px}
.cta-meta span{font-size:13px;border:1px solid var(--line);padding:1px 10px;border-radius:99px;color:var(--gold2);background:rgba(201,164,82,.06)}

/* 目覚めの札（くるくる） */
.slot{display:flex;gap:16px;align-items:center;min-height:212px;padding:14px;margin:10px 0;border:1px solid var(--line);background:linear-gradient(120deg,rgba(184,58,38,.14),var(--panel) 50%,rgba(43,74,122,.16));position:relative;overflow:hidden}
.slot::before{content:"";position:absolute;inset:-1px;border:1px solid transparent;background:linear-gradient(90deg,var(--gold),transparent 30%,transparent 70%,var(--gold)) border-box;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.6}
.sl-reel{flex:none;width:118px;aspect-ratio:2/3;position:relative;overflow:hidden;border:2px solid var(--gold);background:#000;padding:0}
.sl-strip{display:flex;flex-direction:column;height:900%;will-change:transform}
.sl-strip img{width:100%;height:calc(100%/9);object-fit:cover;object-position:50% 12%;display:block}
.sl-strip.blur img{filter:blur(2px) brightness(1.2)}
.sl-fr{position:absolute;inset:0;box-shadow:inset 0 0 18px rgba(0,0,0,.8);pointer-events:none}
.slot.hit .sl-reel{animation:reelHit .5s ease}
.slot.hit.ur .sl-reel{border-color:#ff7a5a;box-shadow:0 0 26px rgba(240,90,50,.8)}
.slot.hit.ssr .sl-reel{border-color:#ffe08a;box-shadow:0 0 22px rgba(230,200,120,.7)}
@keyframes reelHit{40%{transform:scale(1.06)}}
.sl-info{min-width:0;flex:1;opacity:.25;transition:opacity .4s,transform .4s;transform:translateX(8px)}
.sl-info.in{opacity:1;transform:none}
.sl-n{font-size:clamp(22px,6.4vw,32px);margin:0;line-height:1.2;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-t{margin:2px 0}
.sl-b{margin:4px 0 8px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* 見出し */
.sec{margin:26px 0 6px}
.sec-h{font-size:clamp(22px,6vw,30px);text-align:center;color:var(--gold2);display:flex;align-items:center;gap:12px;justify-content:center}
.sec-h::before,.sec-h::after{content:"";height:2px;flex:1;max-width:120px;background:linear-gradient(90deg,transparent,var(--gold))}
.sec-h::after{background:linear-gradient(270deg,transparent,var(--gold))}
.sec-s{text-align:center;margin:4px auto 12px;max-width:34em}

/* 71人の帯 */
.mq{width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;display:flex;flex-direction:column;gap:8px;position:relative}
.mq::before,.mq::after{content:"";position:absolute;top:0;bottom:0;width:6%;z-index:2;pointer-events:none;background:linear-gradient(90deg,var(--bg),transparent)}.mq::after{right:0;transform:scaleX(-1)}
.mq-r{overflow:hidden}
.mq-t{display:flex;gap:8px;width:max-content;animation:mqMove var(--d,80s) linear infinite;will-change:transform}
.mq-r.back .mq-t{animation-direction:reverse}
.mq:hover .mq-t{animation-play-state:paused}
@keyframes mqMove{to{transform:translateX(-50%)}}
.mq-i{flex:none;width:88px;padding:0;border:1px solid var(--line);background:#0b0a08;position:relative;overflow:hidden;transition:transform .25s,border-color .25s}
.mq-i img{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:50% 10%;display:block;transition:transform .4s}
.mq-i span{position:absolute;left:0;right:0;bottom:0;font-size:12px;line-height:1.3;padding:14px 2px 3px;background:linear-gradient(transparent,rgba(0,0,0,.9));color:#fff;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mq-i.ssr{border-color:#a88534}.mq-i.ur{border-color:#d65a3c}
.mq-i.met::after{content:"";position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:var(--gold2);box-shadow:0 0 6px var(--gold2)}
.mq-i:hover{transform:translateY(-4px);border-color:var(--gold2)}.mq-i:hover img{transform:scale(1.08)}

/* 主役の札 */
.galw{position:relative}
.gal{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 4px 16px;scrollbar-width:thin;scrollbar-color:var(--gold) transparent;perspective:900px}
.gc{flex:none;width:clamp(150px,42vw,190px);aspect-ratio:2/3;scroll-snap-align:start;position:relative;padding:0;border:2px solid var(--gold);background:#0b0a08;overflow:hidden;text-align:left;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease-out,box-shadow .25s;transform-style:preserve-3d}
.gc.in-v{animation:gcIn .7s cubic-bezier(.2,.8,.2,1) both calc(var(--i)*.06s)}
.gc-im,.gc-im img{position:absolute;inset:0;width:100%;height:100%}
.gc-im img{object-fit:cover;object-position:50% 10%;transition:transform .5s}
.gc:hover .gc-im img{transform:scale(1.06)}
.gc::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.92)),radial-gradient(circle at var(--px,50%) var(--py,30%),rgba(255,255,255,.22),transparent 45%);pointer-events:none}
.gc::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(115deg,transparent 35%,rgba(255,240,200,.45) 50%,transparent 65%);background-size:250% 100%;background-position:150% 0;animation:cardShine 5s ease-in-out infinite calc(var(--i)*.35s);pointer-events:none;mix-blend-mode:overlay}
.gc.ur{border-color:#e0705c;box-shadow:0 0 18px rgba(214,90,60,.5)}
.gc.ur::after{background-image:linear-gradient(115deg,transparent 35%,rgba(255,170,140,.6) 50%,transparent 65%)}
.gc:hover{box-shadow:0 14px 30px rgba(0,0,0,.6),0 0 24px rgba(230,200,120,.35)}
.gc-tier{position:absolute;z-index:3;top:6px;left:6px;font-size:12px;padding:0 6px;background:linear-gradient(90deg,#A88534,#E6C878);color:#1a140a;font-weight:700}
.gc.ur .gc-tier{background:var(--shu);color:#fff}
.gc-n{position:absolute;z-index:3;top:8px;right:6px;writing-mode:vertical-rl;font-size:clamp(20px,5.4vw,26px);color:#fff;text-shadow:0 2px 6px #000,0 0 2px #000;letter-spacing:.12em}
.gc-c{position:absolute;z-index:3;left:8px;right:8px;bottom:22px;font-size:13px;line-height:1.35;color:#f0e6cc}
.gc-c small{color:var(--sub);font-size:12px}
.gc-o{position:absolute;z-index:3;left:8px;bottom:4px;font-size:12px;color:var(--gold2)}
.galnav{display:none;justify-content:flex-end;gap:6px}
@media (hover:hover){.galnav{display:flex}}
@keyframes gcIn{from{opacity:0;transform:translateY(30px) rotateY(-30deg)}to{opacity:1;transform:none}}

/* 勢力図の予告 */
.tz{position:relative;padding:12px;background:radial-gradient(ellipse at 50% 40%,#1a2436,var(--panel) 70%)}
.tz-cap{position:absolute;z-index:2;left:14px;top:12px;display:flex;flex-direction:column;pointer-events:none}
.tz-y{font-size:14px;color:var(--sub);letter-spacing:.2em}
.tz-cap b{font-weight:400;font-size:clamp(18px,5.2vw,26px);color:#fff;text-shadow:0 2px 6px #000}
.tz-cap .swap{animation:tzSwap .7s ease both}
@keyframes tzSwap{from{opacity:0;transform:translateX(-14px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
.tz-m svg{width:100%;height:auto;display:block}
.tz-m path.pv{transition:fill 1.1s ease}
.tz-d{display:flex;gap:8px;justify-content:center;margin-top:6px}
.tz-d button{width:10px;height:10px;border-radius:50%;border:1px solid var(--gold);background:transparent;padding:0}
.tz-d button.on{background:var(--gold2);box-shadow:0 0 8px var(--gold2)}

/* 遊び方三つ */
.how3{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;counter-reset:h}
.how3 li{counter-increment:h;position:relative;text-align:center;border:1px solid var(--line);background:var(--panel);padding:16px 6px 12px;display:flex;flex-direction:column;align-items:center;gap:4px}
.how3 li::before{content:counter(h);position:absolute;top:-1px;left:-1px;width:22px;height:22px;background:var(--shu);color:#fff;font-size:13px;display:grid;place-items:center}
.how3 i{width:48px;height:48px;display:block}
.how3 svg,.mi svg{width:100%;height:100%;fill:none;stroke:var(--gold2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.how3 svg *{stroke-dasharray:200;stroke-dashoffset:200}
.in .how3 svg *,.how3.in svg *,[data-rv].in .how3 svg *{animation:draw 1.6s ease forwards}
.how3 li:nth-child(2) svg *{animation-delay:.3s!important}.how3 li:nth-child(3) svg *{animation-delay:.6s!important}
@keyframes draw{to{stroke-dashoffset:0}}
.how3 b{font-weight:400;font-size:18px;color:var(--gold2)}
.how3 small{font-size:13px;color:var(--sub);line-height:1.5}
@media (max-width:420px){.how3 b{font-size:17px}.how3 small{font-size:12px}}

/* メニューの絵 */
.menu button{display:grid;grid-template-columns:34px 1fr;column-gap:8px;align-items:center;position:relative;overflow:hidden}
.menu button b,.menu button small{grid-column:2}
.menu .mi{grid-row:1/3;width:34px;height:34px;display:block;transition:transform .3s}
.menu button:hover .mi{transform:rotate(-8deg) scale(1.12)}
.menu button::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,rgba(230,200,120,.12) 50%,transparent 60%);background-size:250% 100%;background-position:150% 0;transition:background-position .7s}
.menu button:hover::after{background-position:-50% 0}

/* お知らせ（タグ） */
.nwl{list-style:none;padding:0;margin:0}
.nwl li{display:grid;grid-template-columns:auto auto 1fr;gap:4px 10px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line)}
.nwl li p{grid-column:1/-1;margin:0;font-size:15px}
.nwl time{font-size:13px;color:var(--sub)}
.ntag{font-size:12px;padding:0 8px;color:#fff;background:#555}
.ntag.t-new{background:var(--shu)}.ntag.t-ev{background:#3E8A5E}.ntag.t-next{background:var(--ai)}.ntag.t-fix{background:#7a6a46}

/* 数（繰り上がる） */
.tstats span{position:relative;overflow:hidden}
.tstats span::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:edgeSweep 3s linear infinite}

/* 下に貼りつく帯 */
.sbar{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,rgba(15,14,12,.6),rgba(15,14,12,.97) 35%);border-top:1px solid color-mix(in srgb,var(--gold) 50%,transparent);backdrop-filter:blur(6px);transform:translateY(110%);transition:transform .4s cubic-bezier(.2,.8,.2,1);text-align:center}
.sbar.show{transform:none}
.sbar-in{display:flex;gap:8px;max-width:560px;margin:0 auto}
.sbar-in .btn{flex:1;padding:12px 8px;font-size:17px;position:relative;overflow:hidden}
.sbar-in .btn.pri{flex:2;font-family:var(--f-brush);letter-spacing:.2em;font-size:20px}
.sbar-in .btn small{display:block;font-size:12px;line-height:1.2;color:var(--sub)}
.sbar p{margin:4px 0 0;font-size:12px;color:var(--sub)}
body[data-cur="title"] .wrap{padding-bottom:110px}

/* 見えたら出る */
[data-rv]{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
[data-rv].in{opacity:1;transform:none}
[data-rv].in .gc{animation:gcIn .7s cubic-bezier(.2,.8,.2,1) backwards calc(var(--i)*.06s)}

/* 波紋 */
.rpl-host{overflow:hidden}
.rpl{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,230,170,.45),rgba(255,230,170,0) 60%);transform:scale(0);animation:rpGo .6s ease-out forwards;pointer-events:none;z-index:5}
@keyframes rpGo{to{transform:scale(1);opacity:0}}

/* 画面の切り替え */
.scr-in{animation:scrIn .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes scrIn{from{opacity:0;transform:translateY(14px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}}
[data-scr="title"].scr-in{animation:fadeIn .5s ease both}
.inkwipe{position:fixed;inset:0;z-index:60;pointer-events:none}
.inkwipe svg{position:absolute;top:0;height:100%;width:160%;left:-160%;fill:#050403;animation:wipeGo .75s cubic-bezier(.7,0,.3,1) forwards;filter:drop-shadow(0 0 20px rgba(0,0,0,.8))}
@keyframes wipeGo{to{left:100%}}

/* 段階の絵と顔ぶれ */
.artw{position:relative;margin-top:10px;height:clamp(180px,52vw,280px);overflow:hidden;border:1px solid var(--line);animation:artIn 1.2s ease both}
.artw .art{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;animation:artPan 24s ease-in-out infinite alternate}
@keyframes artPan{from{transform:scale(1.05) translateX(-1.5%)}to{transform:scale(1.15) translateX(1.5%)}}
.cst{position:absolute;bottom:0;margin:0;height:100%;width:auto;aspect-ratio:3/4;z-index:2}
.n1 .cst-r{aspect-ratio:2/3}
.cst img{width:100%;height:100%;object-fit:cover;object-position:50% 8%;display:block}
.cst-l{left:0;animation:acInL .9s cubic-bezier(.2,.8,.2,1) both .3s}
.cst-l img{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 98%);mask-image:linear-gradient(90deg,#000 45%,transparent 98%)}
.cst-r{right:0;animation:acInR .9s cubic-bezier(.2,.8,.2,1) both .45s}
.cst-r img{-webkit-mask-image:linear-gradient(270deg,#000 45%,transparent 98%);mask-image:linear-gradient(270deg,#000 45%,transparent 98%)}
.cst figcaption{position:absolute;bottom:8px;left:8px;font-size:clamp(15px,4.2vw,20px);color:#fff;text-shadow:0 2px 4px #000,0 0 2px #000;writing-mode:vertical-rl;top:8px;display:flex;gap:4px;align-items:flex-start}
.cst-r figcaption{left:auto;right:8px}
.cst figcaption small{font-family:var(--f-body);font-size:12px;background:var(--shu);color:#fff;padding:2px 1px}
.cst.me img{filter:drop-shadow(0 0 10px rgba(230,200,120,.6))}
.cst-vs{position:absolute;z-index:3;left:50%;top:18%;transform:translateX(-50%);font-size:clamp(34px,10vw,54px);color:#fff;text-shadow:0 0 18px rgba(224,70,40,.9),0 2px 0 #000;animation:vsIn .6s cubic-bezier(.3,1.6,.5,1) both .9s}
@keyframes acInL{from{opacity:0;transform:translateX(-40%)}to{opacity:1;transform:none}}
@keyframes acInR{from{opacity:0;transform:translateX(40%)}to{opacity:1;transform:none}}
@keyframes vsIn{from{opacity:0;transform:translateX(-50%) scale(2.4) rotate(-12deg)}to{opacity:1;transform:translateX(-50%) scale(1)}}
.artw .alabel{font-size:30px}

/* 目覚め：主役・超激レアの後光 */
.wk-card{position:relative;overflow:hidden;isolation:isolate}
.wk-card .rays{position:absolute;left:50%;top:40%;width:900px;height:900px;margin:-450px 0 0 -450px;z-index:-1;background:repeating-conic-gradient(from 0deg,rgba(230,200,120,.18) 0 6deg,transparent 6deg 18deg);animation:raysSpin 18s linear infinite;-webkit-mask:radial-gradient(circle,#000,transparent 60%);mask:radial-gradient(circle,#000,transparent 60%)}
.wk-card.ur .rays{background:repeating-conic-gradient(from 0deg,rgba(240,110,70,.25) 0 6deg,transparent 6deg 18deg)}
@keyframes raysSpin{to{transform:rotate(360deg)}}
.wk-card .pt.big::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,240,200,.5) 50%,transparent 65%);background-size:250% 100%;background-position:150% 0;animation:cardShine 3.5s ease-in-out infinite 1s;pointer-events:none}

/* 選ぶ札：光が走る */
.ch{position:relative;overflow:hidden}
.ch::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,rgba(230,200,120,.18) 50%,transparent 60%);background-size:250% 100%;background-position:150% 0;transition:background-position .6s;pointer-events:none}
.ch:hover::after{background-position:-50% 0}
.ch:hover{transform:translateX(4px)}

/* 窓：開くときに下から */
.modal .mdbox{animation:mdUp .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes mdUp{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:none}}
.toast:not([hidden]){animation:toastIn .4s cubic-bezier(.3,1.4,.5,1) both}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}

@media (prefers-reduced-motion:reduce){.hv *,.hv-t *,.mq-t,.gc,.gc::after,[data-rv],.artw .art,.ac,.wk-card .rays,#wakeBtn::after{animation:none!important;transition:none!important}[data-rv]{opacity:1;transform:none}.hv-slash line{stroke-dashoffset:0}}
html[data-calm] .mq-t{animation:none}

/* 今日の運命：顔（まだ会っていない人は影だけ） */
.daily{display:grid;grid-template-columns:92px 1fr;gap:10px 14px;align-items:center}
.daily .dl-p{grid-row:1;margin:0;width:92px;aspect-ratio:2/3;position:relative;overflow:hidden;border:2px solid var(--shu);background:#000;box-shadow:0 0 16px rgba(184,58,38,.45)}
.daily .dl-p img{width:100%;height:100%;object-fit:cover;object-position:50% 10%;display:block}
.daily .dl-p.q img{filter:brightness(0) drop-shadow(0 0 0 #000);opacity:.9}
.daily .dl-p.q{background:radial-gradient(circle at 50% 35%,#6a2a1a,#140605)}
.daily .dl-p b{position:absolute;inset:0;display:grid;place-items:center;font-size:40px;font-weight:400;color:var(--gold2);text-shadow:0 0 12px var(--gold);animation:qPulse 1.8s ease-in-out infinite}
@keyframes qPulse{50%{transform:scale(1.15);opacity:.7}}
.daily .dl-n{font-size:clamp(18px,5vw,26px)}
.daily #dailyBtn{grid-column:1/-1;width:100%;padding:12px;font-size:17px;position:relative;overflow:hidden}
.daily .dl-x{grid-column:1/-1}

/* ===================== v2.0 本編（国取り） ===================== */
.cp-intro{text-align:center;padding:10px 0}
.cp-t{font-size:clamp(34px,10vw,52px);color:#fff;text-shadow:0 0 22px rgba(224,70,40,.6);animation:inkBig 1.2s cubic-bezier(.2,.8,.2,1) both}
.cp-goal-big{margin:10px auto 14px;padding:12px;border:2px solid var(--shu);background:linear-gradient(90deg,rgba(184,58,38,.25),rgba(184,58,38,.05));max-width:520px;animation:fadeUp .8s ease both .4s}
.cp-goal-big span{display:block;font-size:clamp(20px,5.6vw,28px);color:#ffd6c8}
.cp-goal-big small{color:var(--sub);font-size:13px}
.cp-grp{display:flex;gap:10px;align-items:center;text-align:left;margin:8px 0;animation:fadeUp .8s ease both .6s}.cp-grp p{margin:0;font-size:15px}
.cp-trait{text-align:left;border-left:3px solid var(--gold);padding:6px 12px;margin:10px 0;background:rgba(201,164,82,.07);animation:fadeUp .8s ease both .8s}.cp-trait b{color:var(--gold2)}.cp-trait p{margin:2px 0 0;font-size:15px}
.cp-foe{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--panel);padding:10px;margin:10px 0;animation:acInL .8s cubic-bezier(.2,.8,.2,1) both 1s}
.cp-foe.boss{border-color:var(--shu);box-shadow:0 0 24px rgba(184,58,38,.35);animation:acInR .8s cubic-bezier(.2,.8,.2,1) both 1.3s}
.cp-foe .pt.mid{width:110px;margin:0}
.cp-foe b{font-size:24px;font-weight:400;color:#fff}.cp-foe p{margin:2px 0;font-size:15px}
.cp-foe.boss .lbl{color:#ff9a86;letter-spacing:.4em}
.cp-howto{font-size:14px;color:#d8ceb6;text-align:left;border-top:1px solid var(--line);padding-top:8px;margin:12px 0}
.cp-hd{text-align:center;margin-top:6px}
.cp-bar{position:relative;height:22px;border:1px solid var(--gold);background:#120f0b;margin:14px 4px 22px}
.cp-bar-i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#8c1f16,#E8434F,#ffb08a);transition:width 1s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 14px rgba(232,67,79,.6)}
.cp-bar i{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--gold2)}
.cp-bar i span{position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:12px;color:var(--gold2);font-style:normal;margin-top:2px}
.cp-bar b{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:14px;color:#fff;text-shadow:0 1px 2px #000}.cp-bar b small{font-size:11px;color:var(--sub)}
.cp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.cp-chips span{font-size:13px;border:1px solid var(--line);background:var(--panel);padding:2px 8px}.cp-chips b{color:var(--gold2);font-weight:700}
.cp-chips .bad{border-color:#8c2a1f}.cp-chips .bad b{color:#ff8a76}.cp-chips .good{border-color:#3E8A5E}.cp-chips .good b{color:#9fe0b3}
.cp-map svg path.pv.o-me{stroke:#fff;stroke-width:1.2;animation:meGlow 2.4s ease-in-out infinite}
.cp-map svg path.pv.o-vas{stroke:#f3b3b9;stroke-width:.8}
@keyframes meGlow{50%{filter:brightness(1.35)}}
#tkMap svg path.pv.o-me{stroke:#fff;stroke-width:1.2}
.cp-ens{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:8px 0}
.cp-en{display:flex;gap:8px;align-items:center;border:1px solid var(--line);background:var(--panel);padding:4px;animation:chIn .5s ease both}
.cp-en img{width:40px;height:52px;object-fit:cover;object-position:50% 10%;flex:none}
.cp-en div{display:flex;flex-direction:column;line-height:1.3;min-width:0}.cp-en small{font-size:11px;color:#ff9a86}.cp-en b{font-size:15px;font-weight:400}.cp-en span{font-size:12px;color:var(--sub)}
.cp-en.boss{border-color:var(--shu);animation:bossP 2s ease-in-out infinite}.cp-en.vas{border-color:#3E8A5E;opacity:.85}
@keyframes bossP{50%{box-shadow:0 0 14px rgba(184,58,38,.6)}}
.cp-act{border:1px solid var(--gold);background:linear-gradient(180deg,var(--bg2),var(--panel));padding:12px;margin:12px 0}
.cp-left{font-size:20px;color:#fff;font-family:var(--f-brush)}
.cp-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:6px 0 10px}
.cp-cat{border:1px solid var(--line);background:var(--bg);padding:6px 2px;font-size:13px;display:flex;flex-direction:column;align-items:center;gap:2px;transition:all .2s;position:relative;overflow:hidden}
.cp-cat span{font-size:18px;color:var(--gold2)}
.cp-cat.on{border-color:var(--gold2);background:linear-gradient(180deg,rgba(201,164,82,.25),rgba(201,164,82,.05));color:#fff;transform:translateY(-2px)}
.cp-cat.off{opacity:.4}
.cp-o small{color:var(--sub)}
.cp-r{border-left:3px solid var(--line);padding-left:10px;animation:fadeUp .5s ease both}.cp-r.ok{border-left-color:#3E8A5E}.cp-r.ng{border-left-color:#8c2a1f}
.cp-ks{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.cp-k{display:flex;flex-direction:column;align-items:center;gap:2px;border:1px solid var(--line);background:var(--panel);padding:6px;transition:transform .2s}.cp-k:hover{transform:translateY(-3px);border-color:var(--gold2)}
.cp-k .pt.sm{width:60px}.cp-k b{font-size:14px;font-weight:400}.cp-k small{font-size:11px;color:var(--sub)}
.cp-end{text-align:center}
.cp-ek{display:inline-block;margin:6px 0;padding:2px 16px;border:1px solid var(--gold);color:var(--gold2);letter-spacing:.3em;animation:fadeUp .6s ease both}
.k-ten .cp-ek,.k-hide .cp-ek{background:linear-gradient(90deg,#A88534,#E6C878,#A88534);background-size:200% 100%;color:#1a140a;animation:shine 3s linear infinite}
.k-die .cp-ek{border-color:#666;color:#aaa}
.cp-lv{display:inline-block;margin-left:8px;padding:0 6px;background:var(--shu);color:#fff;letter-spacing:0}
.cp-en-t{font-size:clamp(30px,9vw,48px);color:#fff;margin:6px 0 10px;text-shadow:0 0 24px rgba(230,200,120,.5);animation:inkBig 1.4s cubic-bezier(.2,.8,.2,1) both .3s}
.k-die .cp-en-t{text-shadow:0 0 18px rgba(120,120,140,.5)}
.cp-en-x{max-width:30em;margin:12px auto;font-size:16px;line-height:2;animation:fadeUp 1s ease both 1s}
.cp-seen{margin:14px 0;animation:fadeUp 1s ease both 1.4s}
.cp-seen div{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px}
.cp-seen span{font-size:13px;border:1px dashed var(--line);padding:6px 4px;color:var(--sub)}
.cp-seen span.on{border-style:solid;border-color:var(--gold);color:var(--gold2)}
.cp-seen span.now{background:rgba(232,67,79,.2);border-color:#E8434F;color:#fff;animation:pop .6s ease both 1.8s}
@media (max-width:420px){.cp-cat{font-size:12px}.cp-foe{grid-template-columns:84px 1fr}.cp-foe .pt.mid{width:84px}}

body:not([data-cur="title"]) .sbar{display:none}

/* 本編：対の一枚と大きな知らせ */
.cp-vs{height:clamp(170px,48vw,240px);margin-bottom:6px}
.cst-kuni{position:absolute;inset:auto 8px 8px auto;writing-mode:vertical-rl;font-size:22px;color:#ddd;text-shadow:0 2px 4px #000}
.cp-place{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);z-index:3;font-size:clamp(18px,5vw,26px);color:#fff;text-shadow:0 2px 6px #000;letter-spacing:.2em;animation:fadeUp .6s ease both 1.1s}
.cutin{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(ellipse at center,rgba(0,0,0,.55),rgba(0,0,0,.85));animation:fadeIn .25s ease both}
.cutin.out{animation:ciOut .5s ease forwards}
.cutin .ci-band{position:absolute;left:0;right:0;top:50%;height:150px;margin-top:-75px;background:linear-gradient(90deg,transparent,rgba(201,164,82,.35),transparent);transform:scaleX(0);animation:ciBand .6s cubic-bezier(.2,.8,.2,1) forwards}
.cutin.ci-red .ci-band{background:linear-gradient(90deg,transparent,rgba(184,58,38,.5),transparent)}
.cutin b{position:relative;font-weight:400;font-size:clamp(56px,18vw,120px);color:#fff;letter-spacing:.15em;text-shadow:0 0 30px rgba(230,200,120,.8),0 4px 0 #000;animation:ciBig .7s cubic-bezier(.3,1.5,.5,1) both .1s}
.cutin.ci-red b{text-shadow:0 0 30px rgba(224,70,40,.9),0 4px 0 #000}
.cutin small{position:relative;margin-top:8px;font-size:16px;color:#f3e6c0;animation:fadeUp .6s ease both .5s;text-align:center;padding:0 16px}
@keyframes ciBand{to{transform:scaleX(1)}}
@keyframes ciBig{0%{opacity:0;transform:scale(2.6) rotate(-6deg);filter:blur(8px)}100%{opacity:1;transform:none;filter:none}}
@keyframes ciOut{to{opacity:0;transform:scale(1.06)}}

/* エンディング図鑑 */
.le-g{font-size:22px;color:var(--gold2);margin-top:18px;border-bottom:1px solid var(--line)}
.le-r{display:grid;grid-template-columns:86px 1fr;gap:8px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line)}
.le-p{display:flex;flex-direction:column;align-items:center;background:none;border:0;padding:0;gap:2px}.le-p .pt.sm{width:56px}.le-p b{font-size:14px;font-weight:400}.le-p small{font-size:11px;color:var(--sub)}
.le-cs{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:4px}
.le-c{font-size:12px;border:1px dashed var(--line);padding:4px;color:#6f6656;display:flex;flex-direction:column;line-height:1.35;min-height:44px}
.le-c small{font-size:11px;letter-spacing:.1em;color:#5d5547}
.le-c.on{border-style:solid;color:#f3e6c0;background:rgba(201,164,82,.08);animation:pop .5s ease both}
.le-c.on.k-ten{border-color:var(--gold2)}.le-c.on.k-hide{border-color:#d65a3c;background:rgba(184,58,38,.12)}.le-c.on.k-die{border-color:#666}
.le-c.on small{color:var(--gold)}
.le-bar{margin-bottom:10px}
.tstats{grid-template-columns:repeat(5,1fr)}
@media (max-width:480px){.tstats{grid-template-columns:repeat(3,1fr)}}
.cp-ym{margin:4px 0 8px;border-left:2px solid var(--line);padding-left:8px}
.cp-ym p{margin:2px 0;font-size:14px;animation:fadeUp .4s ease both}.cp-ym p.ok{color:#bfe8c9}.cp-ym p.ng{color:#e9b2a8}

/* 本編：その人だけの評定 */
.cp-ev{border:2px solid var(--shu);background:linear-gradient(160deg,rgba(184,58,38,.22),var(--panel) 60%);padding:14px;margin:12px 0;animation:evIn .7s cubic-bezier(.2,.8,.2,1) both;position:relative;overflow:hidden}
.cp-ev::before{content:"評";position:absolute;right:-6px;top:-18px;font-family:var(--f-brush);font-size:110px;color:rgba(255,255,255,.05);pointer-events:none}
.cp-ev h3{font-size:24px;color:#fff;margin:2px 0 6px}.cp-ev p{font-size:15px}
@keyframes evIn{from{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:none}}
.cp-act.wait{opacity:.45;filter:grayscale(.4)}

/* 目覚めの前の「本能寺の変」 */
.intro{position:fixed;inset:0;z-index:80;background:#000;overflow:hidden;cursor:pointer;animation:fadeIn .4s ease both}
.intro.out{animation:ciOut .45s ease forwards}
.io-stage,.io-sc{position:absolute;inset:0}
.io-sc{opacity:0;transition:opacity .6s ease}.io-sc.in{opacity:1}
.io-bg{position:absolute;inset:0;width:100%;height:100%;animation:ioZoom 4s ease-out both}
@keyframes ioZoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.io-march{animation:ioMarch 3.6s linear both}.io-march2{animation:ioMarch 3s linear both}
@keyframes ioMarch{from{transform:translateX(-120px)}to{transform:translateX(60px)}}
.io-siege{animation:ioSiege 3.6s ease-out both}
@keyframes ioSiege{from{transform:translateY(40px);opacity:.3}to{transform:none;opacity:1}}
.io-flag{transform-box:fill-box;transform-origin:left top;animation:wave 1.2s ease-in-out infinite}
.io-torch{animation:blink .8s ease-in-out infinite alternate}
.io-flames path{fill:#ff8a3a;transform-box:fill-box;transform-origin:center bottom;animation:ioFlame .55s ease-in-out infinite alternate,ioRise 3.4s ease-out both;mix-blend-mode:screen}
@keyframes ioFlame{from{transform:scaleY(.7) skewX(-5deg);fill:#ff7a2a}to{transform:scaleY(1.25) skewX(6deg);fill:#ffd05a}}
@keyframes ioRise{from{opacity:0}to{opacity:1}}
.io-glow{animation:ioGlow 3.6s ease-in both}@keyframes ioGlow{from{opacity:0}to{opacity:1}}
.io-temple{animation:ioTemple 3.6s ease both}@keyframes ioTemple{0%{filter:none}100%{filter:drop-shadow(0 0 12px #ff6a2a)}}
.io-arrow{stroke:#f3e6c0;stroke-width:1.5;opacity:0;stroke-dasharray:44;stroke-dashoffset:44;animation:ioArrow .7s ease-out infinite}
@keyframes ioArrow{0%{opacity:0;stroke-dashoffset:44}20%{opacity:1}100%{opacity:0;stroke-dashoffset:-44}}
.io-face{position:absolute;right:-4%;bottom:0;height:78%;opacity:0;-webkit-mask-image:linear-gradient(270deg,#000 40%,transparent);mask-image:linear-gradient(270deg,#000 40%,transparent);animation:ioFace 2.6s ease both .3s;filter:saturate(1.1) contrast(1.1)}
.io-face.io-nobu{right:auto;left:-4%;-webkit-mask-image:linear-gradient(90deg,#000 40%,transparent);mask-image:linear-gradient(90deg,#000 40%,transparent);filter:sepia(.3) saturate(1.4) brightness(.9);animation:ioFace 3.4s ease both .6s}
@keyframes ioFace{from{opacity:0;transform:translateY(14px) scale(1.04)}to{opacity:.92;transform:none}}
.io-txt{position:absolute;left:0;right:0;bottom:12%;text-align:center;padding:0 18px;z-index:2;text-shadow:0 2px 8px #000,0 0 2px #000}
.io-txt>*{opacity:0}.io-txt.in>*{animation:fadeUp .8s ease both}.io-txt.in>*:nth-child(2){animation-delay:.5s}.io-txt.in>*:nth-child(3){animation-delay:1s}
.io-d{color:var(--gold2);font-size:clamp(18px,5vw,26px);letter-spacing:.3em;margin:0 0 8px}
.io-t{color:#f0e6cc;font-size:clamp(14px,3.8vw,18px);line-height:1.9;margin:0}
.io-big{color:#fff;font-size:clamp(40px,12vw,84px);margin:0;letter-spacing:.12em;text-shadow:0 0 30px rgba(126,91,181,.9),0 4px 0 #000}
.io-txt.in .io-big{animation:inkBig 1.1s cubic-bezier(.2,.8,.2,1) both .3s}
.io-big.red{text-shadow:0 0 34px rgba(255,90,40,.95),0 4px 0 #000}
.io-n{color:var(--sub);font-size:13px}
.io-white{position:absolute;inset:0;background:radial-gradient(circle,#fff,#f3e6c0 40%,#000 90%);animation:ioWhite 2s ease both}
@keyframes ioWhite{0%{opacity:1}100%{opacity:.15}}
.io-skip{position:absolute;right:12px;top:calc(12px + env(safe-area-inset-top,0px));z-index:3;background:rgba(0,0,0,.5)}
.io-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.1);z-index:3}.io-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b8231a,#ffb347)}

/* 目覚め：居場所と配置図 */
.wk-loc{margin:14px 0 6px;padding:12px;border:1px solid var(--gold);background:linear-gradient(90deg,rgba(184,58,38,.25),rgba(0,0,0,0));text-align:left;animation:fadeUp .8s ease both}
.wk-loc b{display:block;font-weight:400;font-size:clamp(26px,8vw,40px);color:#fff;line-height:1.2;text-shadow:0 0 16px rgba(224,70,40,.5)}
.wk-loc span{color:var(--gold2);font-size:16px;letter-spacing:.2em}
.map .pl{fill:#f3e6c0;text-anchor:middle;paint-order:stroke;stroke:rgba(0,0,0,.85);stroke-width:2.5px;font-family:var(--f-body);pointer-events:none;opacity:.9}
.map .pl-me{fill:#fff;font-weight:700}
.wk-map .map{border-color:var(--gold)}
.wk-pp{margin:16px 0}
.wk-pp .lbl{text-align:left}
.ppl{animation:pplIn .6s cubic-bezier(.3,1.5,.5,1) both}
@keyframes pplIn{from{opacity:0;transform-origin:center;transform:scale(.3)}to{opacity:1}}
.ppl image{transform-box:fill-box}
.ppl-ring{fill:#111;stroke:var(--gold2);stroke-width:1.4}
.ppl.me .ppl-ring{stroke:#ff6a4a;stroke-width:2.4;filter:drop-shadow(0 0 4px #ff6a4a)}
.ppl-n{fill:#fff;text-anchor:middle;paint-order:stroke;stroke:#000;stroke-width:2.4px;font-family:var(--f-body);font-weight:700}
.ppl-p{fill:var(--gold2);text-anchor:middle;paint-order:stroke;stroke:#000;stroke-width:2px;font-family:var(--f-body)}
.ppl{transform-box:fill-box;transform-origin:center}
.io-bg{top:auto;bottom:0;height:64%}
@media (min-aspect-ratio:1/1){.io-bg{height:100%}}
.io-sc::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#000 0,transparent 45%)}
.io-face{height:50%;top:3%;bottom:auto;right:0}
.io-face.io-nobu{left:0;opacity:.8}

.co{animation:fadeIn .6s ease both}
.co-l{fill:none;stroke-width:1.3;opacity:.85;stroke-dasharray:3 2}
.co-d{stroke:#fff;stroke-width:1}
.co-r{fill:#111;stroke-width:2}
.co.me .co-r{stroke-width:3.4;filter:drop-shadow(0 0 5px #ff5a3a)}
.co-n{fill:#fff;font-size:14px;font-weight:700;paint-order:stroke;stroke:#000;stroke-width:3px;font-family:var(--f-body)}
.co-p{fill:var(--gold2);font-size:11px;paint-order:stroke;stroke:#000;stroke-width:2.5px;font-family:var(--f-body)}
.co.me .co-n{fill:#ffb59f}
.wk-pp .map{width:100vw;margin-left:calc(50% - 50vw);max-width:900px;border-left:0;border-right:0}
@media (min-width:900px){.wk-pp .map{margin-left:auto;width:100%}}
.co-n{font-size:16px}.co-p{font-size:12px}
.wk-pp .map{width:100%!important;margin-left:0!important;border:1px solid var(--line)!important}

/* 布陣図（本編の合戦） */
.bj{margin:8px 0;border:1px solid var(--gold);background:#0c0b08}
.bj-h{margin:0;padding:6px 10px;display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.bj-h b{font-weight:400;font-size:20px;color:#fff}.bj-h small{font-size:12px;color:var(--sub)}
.bj-svg{width:100%;height:auto;display:block}
.bj-t{fill:#d8ccb0;font-size:16px;text-anchor:middle;font-family:var(--f-body);opacity:.85;paint-order:stroke;stroke:#000;stroke-width:2px}
.bj-u{opacity:0;animation:bjIn .5s ease forwards var(--d)}
.bj-ui rect{stroke:#000;stroke-width:1.5}.bj-a .bj-ui rect,.bj-u.bj-a rect{fill:#c8323c}.bj-u.bj-b rect{fill:#3b6db4}
.bj-u.bj-a .bj-flag{fill:#ffd2c4}.bj-u.bj-b .bj-flag{fill:#cfe0ff}
@keyframes bjIn{from{opacity:0;transform:scale(.4)}to{opacity:1}}
.bj-u .bj-ui{transform-box:fill-box;transform-origin:center}
.bj-a.ph2,.bj-a.ph3{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400}
path.bj-a{stroke:#e8434f}path.bj-b{stroke:#5a8ad6}
path.ph2{animation:bjDraw .9s ease forwards calc(1s + var(--d))}
path.ph3{stroke-width:7;animation:bjDraw .9s ease forwards calc(2.2s + var(--d))}
path.bj-b.ph2,path.bj-b.ph3{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400}
@keyframes bjDraw{to{stroke-dashoffset:0}}
.bj-clash{opacity:0;animation:bjClash .6s ease forwards 1.8s}.bj-clash circle{fill:rgba(255,200,120,.25);stroke:#ffd08a;stroke-width:2}.bj-clash path{stroke:#fff;stroke-width:3}
@keyframes bjClash{0%{opacity:0;transform:scale(.2)}60%{opacity:1;transform:scale(1.3)}100%{opacity:.8;transform:scale(1)}}
.win-a .bj-u.bj-b,.win-b .bj-u.bj-a{animation:bjIn .5s ease forwards var(--d),bjLose 1s ease forwards calc(2.6s + var(--d))}
@keyframes bjLose{to{opacity:.15;transform:translate(0,14px)}}
.bj-la{fill:#ff8a8f;font-size:18px;font-family:var(--f-body);font-weight:700;paint-order:stroke;stroke:#000;stroke-width:3px}
.bj-lb{fill:#9fc1ff;font-size:18px;font-family:var(--f-body);font-weight:700;text-anchor:end;paint-order:stroke;stroke:#000;stroke-width:3px}
.bj-ph text{fill:#fff;font-size:20px;text-anchor:middle;font-family:var(--f-brush);opacity:0;paint-order:stroke;stroke:#000;stroke-width:3px}
.bj-p1{animation:bjPh 1s ease forwards 0s}.bj-p2{animation:bjPh 1.2s ease forwards 1s}.bj-p3{animation:bjPhEnd .8s ease forwards 2.2s}
@keyframes bjPh{0%,100%{opacity:0}20%,80%{opacity:1}}@keyframes bjPhEnd{to{opacity:1}}
.bj-u{opacity:0;animation:fadeIn .5s ease forwards var(--d)}
.bj-u .bj-ui{animation:bjIn .5s ease both var(--d)}
.win-a .bj-u.bj-b,.win-b .bj-u.bj-a{animation:fadeIn .5s ease forwards var(--d)}
.win-a .bj-u.bj-b .bj-ui,.win-b .bj-u.bj-a .bj-ui{animation:bjIn .5s ease both var(--d),bjLose 1s ease forwards calc(2.6s + var(--d))}
.bj-clash circle,.bj-clash path{transform-box:fill-box}

@keyframes bjFade{from{opacity:0}to{opacity:1}}
.bj-u,.win-a .bj-u.bj-b,.win-b .bj-u.bj-a{animation:bjFade .5s ease forwards var(--d)}
.bj-clash{transform-box:fill-box;transform-origin:center}

/* エンディングの一枚絵 */
.ea{position:relative;margin:10px auto;max-width:640px;aspect-ratio:16/10;overflow:hidden;border:2px solid var(--gold);box-shadow:0 10px 40px rgba(0,0,0,.6);animation:fadeIn 1s ease both}
.ea.k-die{border-color:#555}.ea.k-hide{border-color:#c9a0ff;box-shadow:0 0 40px rgba(150,110,230,.5)}.ea.k-ten{box-shadow:0 0 40px rgba(230,200,120,.5)}
.ea-svg{position:absolute;inset:0;width:100%;height:100%;animation:artPan 20s ease-in-out infinite alternate}
.ea-p{position:absolute;right:0;bottom:0;height:96%;-webkit-mask-image:linear-gradient(270deg,#000 55%,transparent),linear-gradient(0deg,transparent,#000 12%);mask-image:linear-gradient(270deg,#000 55%,transparent);animation:acInR 1.2s cubic-bezier(.2,.8,.2,1) both .4s}
.ea-p.mono{filter:grayscale(1) brightness(.75) contrast(1.1)}
.ea-sun{animation:sunRise 2.4s ease-out both}.ea-ray{stroke:#fff2c0;stroke-width:3;opacity:.25;animation:fadeIn 2s ease both 1s}
.ea-moon{animation:fadeIn 2s ease both}
.ea-split{stroke:#fff;stroke-width:2;stroke-dasharray:8 6;opacity:.6}
.ea-seal{transform-box:fill-box;transform-origin:center;animation:raysSpin 30s linear infinite}
.ea-wave{animation:waveS 3s ease-in-out infinite alternate}
.ea-fire path{fill:#ff7a2a;transform-box:fill-box;transform-origin:center bottom;animation:ioFlame .5s ease-in-out infinite alternate;mix-blend-mode:screen}
.ea-flag{transform-box:fill-box;transform-origin:left top;animation:wave 1.4s ease-in-out infinite}
.ea-ash{animation:snowS 9s linear infinite}.ea-leaf{animation:snowS 12s linear infinite}.ea-gold{animation:goldFleck 4s ease-in-out infinite alternate}
button.le-c{cursor:pointer;text-align:left;font:inherit;font-size:12px}
button.le-c:hover{transform:translateY(-2px)}
.ea{width:100%}

/* ===== v3 一生の画面（五十年転生の画面を移す） ===== */
body[data-cur="life"] .wrap{max-width:1180px}
#lifeBody{position:relative}
#lifeBody .hud{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 14px;align-items:center;padding:8px 12px;position:sticky;top:0;z-index:15;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(4px)}
.hudFace .pt{width:58px}
.hudL1{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.hudNameW{display:flex;flex-direction:column;line-height:1.1}.hudNameW .yomi{font-size:11px;color:var(--sub);letter-spacing:.2em}
.hudName{font-size:26px;font-weight:400;color:var(--gold2)}
.ageW{display:flex;flex-direction:column;gap:3px;min-width:70px}.age{font-size:26px;font-family:var(--f-brush);line-height:1}
.ybar{display:block;width:100%;height:4px;background:color-mix(in srgb,var(--gold) 18%,transparent);overflow:hidden;border-radius:2px}.ybar i{display:block;height:100%;width:0;background:var(--gold2);transition:width .4s}
.hudMon{font-size:15px;color:var(--shu2);border:1px solid var(--shu);padding:0 8px}
.hudL2{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;font-size:14px}
.eraTag{font-size:17px;color:var(--ink)}
.hudRank{color:var(--gold2);font-weight:700}
.hudCtl{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:360px}
.hudCtl .btn{padding:4px 9px;font-size:13px}.hudCtl .btn.on{background:var(--gold);color:#16120A}
.spd{display:inline-flex;gap:2px}.spd .btn{padding:4px 6px}
.lifeGrid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px;align-items:start;margin-top:10px}
.lmain,.lside{display:flex;flex-direction:column;gap:12px;min-width:0}
.lmain .panel,.lside .panel{margin:0}
.lpair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lpair>.panel{margin:0}
.stage{position:relative;aspect-ratio:3.2/1;padding:0;overflow:hidden}
.stgScn{position:absolute;inset:0}.stgScn svg{width:100%;height:100%;display:block;animation:kenb 18s ease-out both}
@keyframes kenb{from{transform:scale(1.08)}to{transform:scale(1)}}
.stgVig{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,transparent 45%,#000b);pointer-events:none}
.stgSea{position:absolute;top:8px;right:10px;font-family:var(--f-brush);font-size:24px;color:#fff;text-shadow:0 1px 4px #000}
.stgBot{position:absolute;left:10px;bottom:8px;display:flex;align-items:center;gap:10px;color:#fff;text-shadow:0 1px 3px #000;font-size:16px}
.stgFace .pt{width:44px}
.stgYou{position:absolute;left:12px;top:8px;font-size:12px;color:#fff;background:var(--shu);padding:0 6px;letter-spacing:.2em}
.pstrip{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:10px 14px}
.hudStats{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px;color:var(--sub);flex:1 1 380px}
.hudStats span{display:inline-flex;flex-direction:column;line-height:1.2;min-width:36px}
.hudStats span b{font-size:19px;color:var(--ink);font-variant-numeric:tabular-nums;font-weight:800}
.hudStats .srk{font-size:11px;font-style:normal;color:var(--sub)}
.hudStats i{width:1px;background:var(--line);align-self:stretch}
.hudStats span.fup b{color:#7EE08A;animation:fupA 1.4s ease}
@keyframes fupA{0%{transform:scale(1.5)}100%{transform:none}}
.hudMoney{display:flex;gap:16px;align-items:baseline}
.hudMoney div{display:flex;align-items:baseline;gap:5px}.hudMoney span{font-size:13px;color:var(--sub)}
.hudMoney b{font-size:21px;color:var(--gold2);font-variant-numeric:tabular-nums;font-weight:800}
.psBtns{display:flex;gap:6px}
.psb{border:1px solid var(--line);background:none;color:var(--ink);padding:5px 10px;font-size:14px}.psb b{color:var(--gold2)}
.psb.pm{border-color:var(--gold);color:var(--gold2)}
.psFocusBox{flex-basis:100%}
.focus{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.focus button{text-align:left;border:1px solid var(--line);background:color-mix(in srgb,var(--ink) 4%,transparent);color:var(--ink);padding:7px 10px;font-size:14px;line-height:1.4}
.focus button small{display:block;color:var(--sub);font-size:12px}
.focus button[aria-pressed="true"]{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 22%,transparent)}
.fdPeers{margin:0 0 6px;font-size:15px;color:#7FB7A6}.fdPeers b{color:var(--ink)}
.feedL{list-style:none;margin:0;padding:0}
.feedL li{display:grid;grid-template-columns:3.4em 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:17px;line-height:1.6;cursor:pointer}
.feedL li:last-child{border-bottom:0}
.feedL .fa{color:var(--sub);font-size:14px;padding-top:2px;font-variant-numeric:tabular-nums}
.feedL li.big .fdx{font-weight:800;color:var(--gold2)}
.feedL li.dark .fdx{color:#F08A70;font-weight:700}
.feedL li.hon .fdx{font-family:var(--f-brush);color:var(--gold2);font-size:19px}
.feedL li.tenka .fdx{color:var(--gold2);font-weight:700;border-left:3px solid var(--gold);padding-left:8px}
.feedL li.realm .fdx,.feedL li.q .fdx{color:var(--sub);font-size:15px}
.feedL li.star .fdx::after{content:" ☆";color:#E9C46A;font-weight:800}
.feedL li.nw{animation:feedIn .6s ease both}
@keyframes feedIn{from{opacity:0;transform:translateY(-8px);background:color-mix(in srgb,var(--gold) 20%,transparent)}to{opacity:1;transform:none}}
.feedL.all li{font-size:15px}
#feedMore{margin-top:8px;width:100%}
.col{display:flex;flex-direction:column;gap:8px}
.ladder{display:flex;flex-wrap:wrap;gap:4px}
.ladder span{font-size:13px;padding:1px 7px;border:1px solid var(--line);color:var(--sub)}
.ladder span.on{border-color:var(--gold);color:#16120A;background:var(--gold)}
.bars{display:flex;flex-direction:column;gap:4px}
.br{display:grid;grid-template-columns:5.2em 1fr 2.4em;gap:8px;align-items:center;font-size:14px}
.br i{height:8px;background:color-mix(in srgb,var(--line) 60%,transparent);display:block}
.br i b{display:block;height:100%;background:var(--gold);transition:width .7s}
.br.g i b{background:#7FB38A}.br.b i b{background:#6E8FC9}.br.r i b{background:var(--shu)}
.br em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums}
.home svg{width:100%;height:auto;display:block;border:1px solid var(--line)}
.ksh{display:flex;flex-wrap:wrap;gap:8px}.ksh span{display:flex;flex-direction:column;align-items:center;font-size:12px}.ksh .pt{width:40px}
.good{color:var(--good)}
.makimono summary{cursor:pointer;list-style:none}
.log{list-style:none;padding:0;margin:0;max-height:300px;overflow:auto;font-size:14px}.log li{padding:3px 0;border-bottom:1px dotted var(--line)}
.sugoroku{display:flex;flex-wrap:wrap;gap:3px}
.sugoroku i{width:14px;height:14px;display:block;border:1px solid var(--line)}
.sugoroku i.up{background:var(--gold)}.sugoroku i.dn{background:var(--shu)}.sugoroku i.war{background:#6E8FC9}
.sugoroku i.now{border-color:var(--gold2);animation:fl 1.2s ease infinite alternate}
@keyframes fl{from{box-shadow:0 0 0 var(--gold2)}to{box-shadow:0 0 8px var(--gold2)}}
.smap{padding:10px 12px}
.tkhead{display:flex;justify-content:space-between;align-items:baseline}
.tkyear{font-size:14px}.tkyear b{font-size:20px;color:var(--gold2)}
.tkmap svg{width:100%;height:auto;display:block}
.rank{display:flex;flex-direction:column;gap:5px;margin-top:6px}
.rk{display:grid;grid-template-columns:1.4em 1fr;gap:6px;align-items:center}
.rk .rn{color:var(--gold2);font-weight:800;font-variant-numeric:tabular-nums}
.rk p{margin:0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk p i{display:inline-block;width:9px;height:9px;margin-right:4px;border-radius:2px}
.rk .rb{height:7px;background:color-mix(in srgb,var(--line) 50%,transparent)}.rk .rb b{display:block;height:100%;transition:width .7s}
.rk small{font-size:12px;color:var(--sub)}
.rk.me{background:color-mix(in srgb,var(--shu) 18%,transparent);outline:1px solid var(--shu);padding:2px 4px}
.hon1{display:flex;justify-content:space-between;gap:8px;font-size:14px;margin:0 0 4px}.hon1 em{font-style:normal;color:var(--gold2)}
.honbar{position:relative;height:10px;background:color-mix(in srgb,var(--line) 60%,transparent);margin:4px 0}
.honbar b{display:block;height:100%;background:linear-gradient(90deg,var(--shu),var(--gold));transition:width .8s}
.honbar i{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink)}
.honlv{display:flex;justify-content:space-between;font-size:12px;color:var(--sub);margin-bottom:8px}.honlv .ok{color:var(--gold2);font-weight:800}
.figgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.figgrid button{padding:0;border:0;background:none;text-align:center;color:var(--ink);display:flex;flex-direction:column;align-items:center;font-size:13px}
.figgrid .pt{width:100%}.figgrid small{color:var(--sub);font-size:11px}
.figgrid .dead .pt img{filter:grayscale(1) brightness(.6)}
/* 決断の窓 */
.dec{position:fixed;inset:0;z-index:50;background:#000b;display:flex;align-items:center;justify-content:center;padding:14px;animation:mdIn .25s ease;overflow-y:auto}
.dec.out{animation:decOut .3s ease forwards}
@keyframes decOut{to{opacity:0}}
.mdlg{max-width:620px;width:100%;margin:auto;max-height:100%;overflow-y:auto;box-shadow:0 10px 50px #000}
.mdlg.wide{max-width:780px}
.dhd{display:flex;flex-direction:column;border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:8px}
.dhd b{font-size:28px;color:var(--gold2);font-weight:400;line-height:1.3}
.dfigs{display:flex;gap:8px;margin:6px 0}.dfigs span{display:flex;flex-direction:column;align-items:center;font-size:12px;width:64px}.dfigs .pt{width:64px}
.dx{font-size:17px;line-height:1.7;margin:8px 0}
.dnote{font-size:14px;color:var(--sub);border-left:2px solid var(--gold);padding-left:8px}
.dopt .ch{position:relative}
.dauto{position:absolute;right:8px;top:6px;font-size:11px;font-style:normal;color:#16120A;background:var(--gold);padding:0 5px}
.dopt .ch.pick{background:color-mix(in srgb,var(--gold) 35%,var(--bg2));transform:scale(1.02)}
.dcd{position:relative;height:16px;margin-top:10px;background:color-mix(in srgb,var(--line) 50%,transparent)}
.dcd i{position:absolute;left:0;top:0;bottom:0;background:color-mix(in srgb,var(--gold) 40%,transparent);transition:width .25s linear}
.dcd span{position:relative;font-size:12px;padding-left:6px;color:var(--ink)}
.spend{display:flex;flex-direction:column;gap:6px}
@media (max-width:900px){
  .lifeGrid{display:flex;flex-direction:column}.lmain,.lside{display:contents}
  .lifeGrid .panel{width:100%;box-sizing:border-box}
  .smap{order:-1}
}
@media (max-width:600px){
  #lifeBody .hud{grid-template-columns:auto minmax(0,1fr);padding:6px}
  .hudCtl{grid-column:1/-1;justify-content:flex-start;max-width:none;flex-wrap:nowrap;overflow-x:auto}
  .hudCtl .btn{white-space:nowrap;flex:none}
  .hudFace .pt{width:44px}.hudName{font-size:20px}.age{font-size:20px}.hudMon{display:none}
  .lpair{display:contents}.focus{grid-template-columns:1fr 1fr}
  .stage{aspect-ratio:2.2/1}
  .feedL li{font-size:16px}
  .dhd b{font-size:22px}
}
/* v3 合戦の一幕 */
.btlD{padding:12px}
.btlHd{display:flex;flex-direction:column;margin-bottom:6px}.btlHd b{font-size:26px;color:var(--gold2);font-weight:400;line-height:1.2}
.btlStage{position:relative;width:100%;overflow:hidden;border:1px solid var(--line);background:#111}
.btlStage canvas{display:block;margin:0 auto;max-width:100%}
.btlTag{position:absolute;top:6px;display:flex;align-items:center;gap:6px;background:#000a;padding:3px 8px;color:#fff;font-size:14px;line-height:1.2}
.btlTag.l{left:6px}.btlTag.r{right:6px;text-align:right}.btlTag img{width:30px;height:40px;object-fit:cover;border:1px solid var(--gold)}
.btlTag small{display:block;color:#ddd;font-size:12px}
.btlPow{position:absolute;left:50%;transform:translateX(-50%);top:8px;width:30%;height:8px;background:var(--cb,#555)}
.btlPow i{display:block;height:100%;width:var(--a);background:var(--ca);transition:width .6s;box-shadow:inset 0 0 0 1px #0006}
.btlPow i{background:var(--ca)}.btlPow{background:none}.btlPow::before{content:"";position:absolute;inset:0;background:var(--cb,#6b4c7a);z-index:-1}
.btlStamp{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:min(30vw,190px);color:#1a1008;text-shadow:0 0 30px #fff8,0 4px 0 #0004;pointer-events:none;opacity:0}
.btlStamp.on{animation:stampIn 1.1s cubic-bezier(.2,1.4,.4,1) both}
.btlStamp.win{color:#B83A26;text-shadow:0 0 30px #fff,0 0 4px #fff}.btlStamp.lose{color:#2a2a44;text-shadow:0 0 30px #fffa}
@keyframes stampIn{0%{opacity:0;transform:scale(2.4) rotate(-8deg)}35%{opacity:1;transform:scale(.95) rotate(-4deg)}70%{opacity:1;transform:scale(1) rotate(-4deg)}100%{opacity:0;transform:scale(1.05) rotate(-4deg)}}
.btlUi{margin-top:8px;min-height:120px}
.btlTx{font-size:17px;margin:0 0 8px}.btlTx .good,.good{color:#9CC28A}.bad{color:#F08A70}
.btlB{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.btlB .ch{padding:8px;text-align:center}.btlB .btlSkip,.btlB #btlOk{grid-column:1/-1;justify-self:center}
.btlB .sai-w{background:color-mix(in srgb,#7FB38A 40%,var(--bg2))}.btlB .sai-x2{background:color-mix(in srgb,var(--shu) 40%,var(--bg2))}
@media (max-width:520px){.btlB{grid-template-columns:1fr}.btlHd b{font-size:20px}.btlTag{font-size:12px}.btlTag img{width:22px;height:30px}}
.decStamp{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);font-size:min(50vw,320px);color:color-mix(in srgb,var(--gold) 30%,transparent);pointer-events:none;z-index:-1;animation:stampIn2 1.2s cubic-bezier(.2,1.4,.4,1) both}
.dec .mdlg{position:relative;z-index:1}.dec{isolation:isolate}
.decStamp.red{color:color-mix(in srgb,var(--shu) 45%,transparent)}
@keyframes stampIn2{0%{opacity:0;transform:translate(-50%,-50%) scale(2.2) rotate(-8deg)}40%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-4deg)}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-4deg)}}
.dec.red .mdlg{border-color:var(--shu)}
.line{font-family:var(--f-brush);font-size:20px;color:var(--ink);border-left:3px solid var(--shu);padding:2px 0 2px 10px;margin:6px 0}
.hist{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.hist p{margin:0;padding:8px 10px;border:1px solid var(--line);font-size:16px;line-height:1.6}.hist span{display:inline-block;font-size:12px;letter-spacing:.2em;margin-right:8px;padding:0 6px}
.hreal{color:var(--sub)}.hreal span{background:#444;color:#ddd}
.halt{color:var(--gold2);font-weight:700;border-color:var(--gold)!important;background:color-mix(in srgb,var(--gold) 10%,transparent)}.halt span{background:var(--shu);color:#fff}
.thmap svg{width:100%;height:auto;max-height:220px;display:block;border:1px solid var(--line)}
.thv{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;font-size:14px;margin-top:6px}.thv b{color:var(--gold2)}
.thv i{height:10px;background:var(--shu);display:block}.thv i b{display:block;height:100%}
.home svg{max-width:320px;margin:0 auto}
.stgScn .alabel{display:none}
.cp-hist{text-align:left;max-width:560px;margin:12px auto}.cp-hist ul{list-style:none;margin:0;padding:0}
.cp-hist li{padding:6px 0;border-bottom:1px dotted var(--line)}.cp-hist li b{display:block;color:var(--gold2)}.cp-hist li small{color:var(--sub);font-size:13px}
/* v3.1 決断の窓（五十年転生の形） */
.dec{background:rgba(5,4,2,.72)}
.dec .mdlg{position:relative;max-width:680px;padding:18px 20px}
.dec.low{visibility:hidden}
.dsub{margin:0 0 2px;font-size:13px;letter-spacing:.12em}
.dttl{font-size:30px;color:var(--gold2);font-weight:400;line-height:1.25;margin:0 0 6px;padding-right:110px}
.dec .dx{font-size:17px;font-weight:700;line-height:1.7;color:var(--ink);margin:8px 0}
.dec .dnote{font-size:14px}
.mLow{position:absolute;top:10px;right:10px;z-index:2;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 85%,transparent);color:var(--sub);font:inherit;font-size:13px;padding:3px 10px;border-radius:999px;cursor:pointer}
.mBack{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:60;background:#B8432E;color:#fff;border:0;font:inherit;font-weight:700;padding:12px 22px;border-radius:999px;box-shadow:0 6px 20px #000a;cursor:pointer;animation:mbp 1.6s ease-in-out infinite}
@keyframes mbp{50%{box-shadow:0 0 0 6px #B8432E44,0 6px 20px #000a}}
.mcd{position:relative;display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:5px 8px;border:1px solid var(--line);font-size:14px;color:var(--sub);overflow:hidden}
.mcd i{position:absolute;left:0;top:0;bottom:0;background:color-mix(in srgb,var(--gold) 22%,transparent);width:0;transition:width .25s linear;pointer-events:none}
.mcd span{position:relative;flex:1}
.mcd button{position:relative;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:13px;padding:2px 10px;cursor:pointer}
.mcd.hold i{background:color-mix(in srgb,var(--sub) 18%,transparent)}
.dec .opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.dec .opts.one{grid-template-columns:1fr}
.dec .opts .ch{text-align:left;border:1px solid var(--line);border-left:4px solid var(--gold);background:linear-gradient(90deg,color-mix(in srgb,#8a6a33 20%,transparent),transparent);padding:10px 12px;min-height:58px;margin:0;animation:none;transform:none}
.dec .opts .ch:hover{border-color:var(--gold);transform:none;background:linear-gradient(90deg,color-mix(in srgb,#8a6a33 34%,transparent),transparent)}
.dec .opts .ch b{font-size:18px;font-weight:700;line-height:1.4}
.dec .opts .ch small{font-size:14px;color:var(--sub);margin-top:3px}
.dec .opts .ch:disabled{opacity:.45}
.dec .opts .ch.pick{border-color:var(--gold2);background:color-mix(in srgb,var(--gold) 30%,var(--bg2))}
.dec.has-fig .mdlg{max-width:min(1100px,94vw);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:22px;align-items:start}
.dec.has-fig .dfig{grid-column:1}.dec.has-fig .dmain{grid-column:2}
.dec .dfigs{display:flex;gap:8px;margin:4px 0 8px}
@media (max-width:820px){.dec.has-fig .mdlg{display:block}.dec .dfig{margin-top:28px}}
@media (max-width:560px){.dec .opts{grid-template-columns:1fr}.dttl{font-size:24px}.dec .dx{font-size:17px}.dec .mdlg{padding:14px}}
.otag{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.1em;padding:0 7px;margin:0 0 4px;border-radius:2px;color:#fff;background:#6b5a3a}
.tg-gun{background:#B8432E}.tg-gai{background:#2F6FA6}.tg-cho{background:#6E4E9A}.tg-nai{background:#3F8A57}.tg-kin{background:#A8862F}.tg-sei{background:#555}
.dmap{position:relative;margin:-2px 0 10px;border:1px solid var(--line);height:120px;overflow:hidden}
.dmap svg{width:100%;height:120px;display:block}
.dmap span{position:absolute;left:8px;bottom:6px;font-size:13px;background:#000b;color:#fff;padding:1px 8px}
.feedL .eff{display:block;font-size:13px;color:#9CC28A;font-weight:700;margin-top:2px}
/* v3.1 合戦（五十年転生の合戦の画面） */
.vsbig{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;text-align:center}
.vsbig .sd{display:flex;flex-direction:column;align-items:center;gap:4px}
.vsbig .sd .pt{width:min(150px,32vw);margin:0}
.vsbig .sd b{font-family:var(--f-brush);font-size:22px;font-weight:400}
.vsbig .sd small{color:var(--sub)}
.vsbig .mid{display:flex;flex-direction:column;align-items:center}
.vsbig .x{font-size:64px;color:var(--shu);line-height:1}
.vsbig .kei{font-size:24px;color:var(--gold2);background:#000;padding:2px 12px}
.force2{display:flex;height:16px;margin-top:10px;border:1px solid var(--line)}
.force2 i{background:linear-gradient(90deg,#8E2A1E,#C0392B)}
.force2 s{background:linear-gradient(90deg,#2C5AA0,#1d3c6e)}
.vsn b{font-size:18px}
.fujin{width:100%;height:auto;display:block;border:1px solid var(--line);max-height:60vh}
.fujin .tgi{transform:scale(1.5)}
.fujin .fph text{font-size:18px}
.fujin .fjDate text{font-family:var(--f-brush);fill:#2b2418;paint-order:stroke;stroke:#F7F1E1;stroke-width:4px;font-weight:700}
.fjLeg{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:14px;margin-bottom:4px}
.fjLeg span{display:inline-flex;align-items:center;gap:5px;font-weight:700}
.fjLeg i{width:12px;height:9px;display:inline-block}
.fjLeg .a i{background:#C0392B}.fjLeg .b i{background:#2C5AA0}
.fjLeg small{color:var(--sub);flex-basis:100%}
.tbar{margin:0 0 8px}
.tbn{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.tbn span{display:flex;flex-direction:column;line-height:1.15}
.tbn span.b{align-items:flex-end;text-align:right}
.tbn b{font-family:var(--f-brush);font-weight:400;font-size:20px}
.tbn em{font-style:normal;font-weight:800;font-size:22px;font-variant-numeric:tabular-nums}
.tbn .a em{color:#E0604E}.tbn .b em{color:#6F9BE0}
.tbk{display:flex;height:16px;background:#2C5AA0;border:1px solid #1d1a14;overflow:hidden}
.tbk i{display:block;background:#C0392B;transition:width 1.1s cubic-bezier(.4,0,.2,1)}
.tbk s{flex:1}
.resw{position:relative}
.resw .stamp{position:absolute;right:14px;top:60px;width:96px;height:96px;display:grid;place-items:center;font-size:58px;border:6px solid currentColor;border-radius:50%;transform:rotate(-12deg);background:#F7F1E1cc}
.stamp.win{color:#C0392B}.stamp.lose{color:#2C5AA0}
.stamp.pop{animation:stampin .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes stampin{from{transform:rotate(-12deg) scale(2.4);opacity:0}to{transform:rotate(-12deg) scale(1);opacity:1}}
.dec .hint{display:block;margin-top:6px;font-size:15px;font-weight:400;color:#E9C46A}
.dec.war .opts{grid-template-columns:1fr 1fr}
@media (max-width:560px){.vsbig .x{font-size:44px}.resw .stamp{width:70px;height:70px;font-size:40px;top:40px}}
.resw .stamp{right:auto;left:42%;top:42%}
/* v3.1 配置図の線を地図と見分けやすく */
.co-l{stroke:#fff!important;stroke-width:1.8;opacity:1;stroke-dasharray:none;filter:drop-shadow(0 0 1.5px #000) drop-shadow(0 0 1.5px #000)}
.co.me .co-l{stroke:#ff5a3a!important;stroke-width:3}
.co-d{fill:#fff!important;stroke:#000;stroke-width:1.5}
.co.me .co-d{fill:#ff5a3a!important}
.wk-me{margin:12px 0;padding:10px 12px;border-left:3px solid var(--shu);background:#0006;text-align:left}.wk-me p{margin:0}.wk-me p:not(.lbl){font-size:17px;font-weight:700}
/* v3.1 TOP：情報を絞り、強弱をつける */
body[data-cur="title"] .wrap{max-width:1040px}
.cta1 .hv-q{font-size:clamp(24px,4vw,34px)}
.cta1 .lead{font-size:17px;color:#e8dfca}
#wakeBtn{font-size:26px;padding:16px 64px;letter-spacing:.3em}
.cta-meta span{font-size:13px}
.sec{margin-top:28px}
.sec-h{font-size:clamp(26px,4.4vw,38px)!important}
.sec-s{font-size:16px;color:#d9cfb8}.sec-s small{display:block;font-size:13px;color:var(--sub)}
.sub-h{font-size:20px;color:var(--gold2);text-align:center;margin:22px 0 6px}
.lg15{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.lg15 .gc{width:auto;flex:initial}
.lg15 .gc-n{font-size:clamp(16px,2.2vw,24px)}
.gc-c b{display:block;font-size:13px;color:var(--gold2);font-weight:700}.gc-c small{font-size:12px;color:#ddd}
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.shot{position:relative;margin:0;border:1px solid var(--line);background:var(--panel)}
.shot img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:50% 20%;border-bottom:1px solid var(--line)}
.shot figcaption{padding:8px 12px 12px}.shot figcaption b{display:block;font-size:20px;color:var(--gold2);font-weight:400}.shot figcaption small{font-size:14px;color:#cfc5ae;line-height:1.5;display:block}
.shot-n{position:absolute;left:8px;top:8px;z-index:1;background:var(--shu);color:#fff;font-size:17px;padding:0 8px}
.tz{max-width:760px;margin:0 auto}
.col75{padding:14px}
.c75h{display:grid;grid-template-columns:auto auto 1fr;gap:12px;align-items:center;margin-bottom:10px}.c75h b{font-size:22px;color:var(--gold2);font-weight:400}.c75h em{font-style:normal;font-size:28px;font-weight:800;color:var(--gold2)}
.c75g{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.c75{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:6px;align-items:center;border:1px solid var(--line);background:#0005;padding:4px;color:var(--ink);text-align:left;cursor:pointer}
.c75 img{grid-row:span 2;width:34px;height:42px;object-fit:cover}.c75 b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c75 span{display:flex;gap:3px}.c75 i{width:12px;height:12px;border:1px solid var(--line);background:#222}
.c75 i.on.k-ten{background:#C9A452}.c75 i.on.k-alt{background:#B8432E}.c75 i.on.k-live{background:#7FB38A}.c75 i.on.k-die{background:#888}.c75 i.on.k-hide{background:#8a5fc0}
details.more{margin-top:20px}details.more summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none;font-size:18px}details.more summary b{color:var(--gold2);font-weight:400}
details.more .menu{margin-top:12px}
.daily{max-width:760px;margin-left:auto;margin-right:auto}
@media (max-width:800px){.lg15{grid-template-columns:repeat(3,1fr)}.shots{grid-template-columns:1fr 1fr}.c75g{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){.shots{grid-template-columns:1fr}.c75g{grid-template-columns:1fr 1fr}#wakeBtn{padding:14px 40px;font-size:22px}}
/* 人物札：見出しと数値を強く、ラベルを弱く */
.wk-info h2{font-size:clamp(36px,6vw,52px)}
.kv dt{font-size:13px;color:var(--sub);font-weight:400}
.kv dd{font-size:18px;font-weight:800;color:#fff}
.stats{gap:6px}.stats span,.stats div{font-size:12px}
.stats b{font-size:26px!important;color:#fff;font-weight:800}
.dec .mdlg{background:#18150f!important;opacity:1}
.dec{background:rgba(5,4,2,.86)}
@media (max-width:560px){.dec{padding:6px;align-items:flex-start}.dec .mdlg{max-height:none}.dmap{height:90px}.dmap svg{height:90px}.dttl{padding-right:0;margin-top:22px}}
.chl{list-style:none;margin:2px 0 10px;padding:0;display:flex;flex-direction:column;gap:2px;font-size:14px}
.chl li{display:flex;gap:8px;align-items:center;color:var(--sub)}.chl li span{width:18px;height:18px;display:grid;place-items:center;border:1px solid var(--line);font-size:12px}
.chl li.ok{color:var(--gold2)}.chl li.ok span{background:var(--gold);color:#16120A;border-color:var(--gold)}
.chl li.now{color:#fff;font-weight:700}.chl li.now span{border-color:var(--shu);background:var(--shu);color:#fff}
.chap{display:flex;flex-direction:column;gap:6px}.chn{font-size:44px;color:var(--gold2);margin:0;line-height:1}
/* ===== 主役えらび（難易度別） ===== */
.pk-h{display:flex;align-items:center;gap:10px;margin:18px 0 8px;font-size:22px}
.pk-h::after{content:"";flex:1;height:1px;background:var(--line)}
.pk-h span{display:inline-block;min-width:3.2em;text-align:center;padding:0 10px;border:1px solid currentColor;border-radius:3px}
.d-易{color:var(--good)} .d-中{color:var(--gold2)} .d-難{color:var(--shu2)} .d-最難{color:#ff6b55}
.pks{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.pk{display:grid;grid-template-columns:64px 1fr;gap:10px;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:8px;align-items:start}
.pk:hover{border-color:var(--gold)}
.pk .pt{width:64px}
.pk b{display:block;font-size:17px;line-height:1.3}
.pk-sc{display:block;color:var(--gold);font-size:12px;letter-spacing:.1em}
.pk span{display:block;font-size:14px;color:var(--sub);line-height:1.5;margin-top:2px}
.pk em{display:block;font-style:normal;font-size:13px;color:var(--shu2);margin-top:4px}
.pk.lock{opacity:.62}
.pk.lock .pt img{filter:grayscale(1) brightness(.6)}
@media (max-width:560px){.pks{grid-template-columns:1fr}}
.gd .pk-h small{font-size:13px;color:var(--sub);font-family:var(--f-body)}
.gc.lock .gc-im img{filter:grayscale(1) brightness(.55)}
.gc-lk{position:absolute;top:6px;right:6px;font-size:17px;z-index:2}
.gc .gc-c small{display:block;font-size:12px;line-height:1.4;color:var(--sub)}
.pk-b{display:block;font-style:normal;font-size:12px;color:var(--gold2);margin-top:3px}
.goal{margin:10px 0}
.goal ul{margin:0;padding-left:1.2em}
.goal li{margin:4px 0;font-size:15px}
.goal .btn.sm{font-size:13px;padding:2px 10px;margin-left:6px}
.fnav{display:flex;flex-wrap:wrap;gap:4px 14px}
.fnav .lk{background:none;border:0;padding:0;color:var(--gold);text-decoration:underline;font-size:14px}
@media (max-width:420px){.topnav .btn.sm{padding:3px 7px;font-size:13px}}
.gd .lg15{grid-template-columns:repeat(4,1fr)}
.gc-lk{left:6px;right:auto}
@media (max-width:800px){.gd .lg15{grid-template-columns:repeat(2,1fr)}}
.cp-unl>div{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.cp-unl span{display:flex;flex-direction:column;align-items:center;width:72px;font-size:13px}
.cp-unl .pt{width:56px}
.cp-unl b{font-weight:400;margin-top:2px}
.goal{text-align:left}
.cfoot{display:flex;flex-wrap:wrap;gap:8px 14px}
.cfoot a{display:inline-block;border:1px solid var(--line);padding:6px 12px;border-radius:3px;text-decoration:none}
.near{color:var(--shu2);font-size:18px;margin:4px 0}
.near b{font-size:26px;color:#fff;margin:0 2px}
.shl{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.shi{border:1px solid var(--line);border-radius:4px;padding:8px 10px;background:var(--bg2)}
.shi p{margin:0 0 6px;font-size:15px;line-height:1.6}
#topGoal .goal{max-width:520px;margin:10px auto 0}
/* ===== TOP 主役十五人：選べる／鍵をはっきり ===== */
.g-st{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 0 6px}
.g-cnt{font-size:16px}.g-cnt b{font-size:24px;color:var(--gold2);margin:0 2px}
.g-lg{display:flex;gap:8px}
.g-lg i{font-style:normal;font-size:13px;display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:2px}
.g-lg .ok{background:linear-gradient(90deg,#A88534,#E6C878);color:#1a140a;font-weight:700}
.g-lg .ng{border:1px solid #6a6458;color:#c9c1ae}
.g-lg .lk-i{width:12px;height:12px}
.lk-i{fill:currentColor;stroke:currentColor}
.gd .pk-h{flex-wrap:wrap}
.gd .pk-h small{font-family:var(--f-body);font-size:13px;color:var(--sub);letter-spacing:0}
.gc .gc-im::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(to top,rgba(0,0,0,.92),transparent);z-index:1}
.gc-im{position:relative;display:block;width:100%;height:100%}
.gc-ok{position:absolute;z-index:3;top:6px;left:6px;font-size:12px;font-weight:700;padding:1px 7px;background:linear-gradient(90deg,#A88534,#E6C878);color:#1a140a;border-radius:2px}
.gc.lock{border-color:#4a453b}
.gc.lock .gc-im img{filter:grayscale(1) brightness(.4)}
.gc-veil{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;background:rgba(10,9,7,.35)}
.gc-veil .lk-i{width:44%;max-width:72px;color:#d9d2c2;opacity:.9;filter:drop-shadow(0 2px 6px #000)}
.gc.lock .gc-n{color:#bdb6a6}
.gc-c em{display:inline-block;font-style:normal;font-size:13px;font-weight:700;color:#fff;background:var(--shu);padding:2px 8px;border-radius:2px}
.gc.lock:hover{border-color:var(--shu2)}
.g-note{font-size:14px;color:var(--sub);text-align:center;margin:10px 0 0}
.g-note b{color:var(--ink)}
.gc-lk{display:none}
.pk{position:relative}
.pk-lk{position:absolute;left:8px;top:8px;width:64px;aspect-ratio:2/3;display:flex;align-items:center;justify-content:center;background:rgba(10,9,7,.45);z-index:2}
.pk-lk .lk-i{width:28px;height:28px;color:#e2dccd}
.pk.lock{opacity:1;border-color:#3a362e;background:#141310}
.pk.lock b{color:#a59e8e}
.pk em{display:inline-block;font-style:normal;font-size:13px;color:#fff;background:var(--shu);padding:1px 8px;border-radius:2px;margin-top:6px}
.pk.lock .pt img{filter:grayscale(1) brightness(.45)}
.lead-s{display:block;font-size:14px;color:var(--sub);margin-top:4px}
/* 鍵の主役：小さくまとめる */
.lks{margin:18px 0 0;padding:10px 12px;border:1px dashed #4a453b;border-radius:6px;background:#12110e}
.lks-h{display:flex;align-items:center;gap:6px;margin:0 0 4px;font-size:15px;color:#c9c1ae}
.lks-h .lk-i{width:14px;height:14px}
.lks-c{margin:8px 0 4px;font-size:13px;color:var(--shu2)}
.lkg{display:flex;flex-wrap:wrap;gap:6px}
.lkm{display:flex;align-items:center;gap:6px;padding:3px 8px 3px 3px;border:1px solid #3a362e;border-radius:4px;background:#1a1814;font-size:14px;color:#a59e8e}
.lkm:hover{border-color:var(--shu2)}
.lkm-p{position:relative;width:28px;height:28px;flex:none;overflow:hidden;border-radius:2px;background:#000}
.lkm-p img{width:100%;height:100%;object-fit:cover;object-position:50% 10%;filter:grayscale(1) brightness(.4)}
.lkm-p .lk-i{position:absolute;inset:6px;width:16px;height:16px;color:#e2dccd}
.lkm b{font-weight:400}
.lkm small{font-size:12px;border:1px solid currentColor;padding:0 4px;border-radius:2px}

/* ===== 国取りの開幕 ===== */
.gbar{margin:4px 0 10px}
.gbar-t{display:flex;justify-content:space-between;font-size:15px}.gbar-t b{font-size:26px;color:var(--gold2);margin:0 3px}
.gbar-b{position:relative;height:12px;background:#2a261e;border:1px solid var(--line);border-radius:6px;overflow:visible}
.gbar-b i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#A88534,#E6C878);border-radius:6px;animation:gbIn 1.2s cubic-bezier(.2,.8,.2,1) both}
.gbar-b em{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--shu2)}
.gbar-s{position:relative;height:18px;font-size:12px;color:var(--shu2)}.gbar-s span{position:absolute;transform:translateX(-50%)}
@keyframes gbIn{from{width:0}}
.sc1{font-size:17px;margin:6px 0}.sc2{font-size:15px;color:var(--sub)}
.tut3{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:6px;counter-reset:t}
.tut3 li{counter-increment:t;display:grid;grid-template-columns:32px 1fr;column-gap:8px;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:4px;padding:6px 8px;animation:fadeUp .5s ease both}
.tut3 li:nth-child(2){animation-delay:.25s}.tut3 li:nth-child(3){animation-delay:.5s}
.tut3 li::before{content:counter(t);grid-row:span 2;width:28px;height:28px;border-radius:50%;background:var(--shu);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.tut3 b{font-size:17px;color:var(--gold2)}.tut3 span{font-size:14px;color:var(--sub)}
/* 結末の国数 */
.cp-tot{font-size:16px;margin:6px 0}.cp-tot b{font-size:44px;color:var(--gold2);font-family:var(--f-brush);margin:0 4px;vertical-align:-4px}.cp-tot small{font-size:16px;color:var(--sub)}
/* おすすめ・選んだ手ごたえ */
.pk-rec{position:absolute;right:8px;top:-9px;z-index:3;font-style:normal;font-size:12px;font-weight:700;background:var(--shu);color:#fff;padding:1px 8px;border-radius:2px}
.pk.rec{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 0 18px rgba(230,200,120,.25)}
.pk.go,.gc.go{animation:pkGo .52s ease forwards}
@keyframes pkGo{0%{transform:scale(1)}40%{transform:scale(1.04);box-shadow:0 0 0 2px var(--gold2),0 0 40px rgba(230,200,120,.7)}100%{transform:scale(.98);opacity:.6;box-shadow:0 0 0 2px var(--gold2),0 0 60px rgba(230,200,120,.9)}}
.gc-ok{background:var(--shu)!important;color:#fff!important}
/* 文字の大きさ：大事なものを大きく */
.pk b{font-size:19px}.pk span{font-size:14px}
.muted{font-size:14px}
@media (max-width:759px){.hv{height:clamp(400px,106vw,640px)}}
.cta1 .lead{margin-top:14px}
/* ===== 決断の窓：読みやすく（v3.6） ===== */
.dec .mdlg{padding:14px 18px 18px}
.dhead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px}
.dhead .dsub{margin:0;font-size:14px;color:var(--sub);letter-spacing:.04em}
.dhead .dsub b{margin-left:8px;color:var(--gold2);font-weight:700}
.dec .mLow{position:static;flex:none;font-size:13px;padding:3px 10px;border:1px solid var(--line);background:transparent;color:var(--sub);border-radius:2px}
.dec .dmap{height:120px;border:1px solid var(--line);border-radius:4px;overflow:hidden;position:relative;margin:0 0 10px}
.dec .dmap svg{width:100%;height:120px;display:block}
.dec .dmap span{position:absolute;left:6px;bottom:6px;font-size:13px;background:rgba(0,0,0,.72);color:#fff;padding:1px 8px;border-radius:2px}
.dec .dttl{font-size:clamp(24px,6vw,30px);color:var(--gold2);margin:4px 0 6px;line-height:1.35}
.dec .dx{font-size:18px;line-height:1.75;color:#efe7d4;margin:0 0 12px}
.dec .dnote{font-size:15px;color:var(--sub)}
.dec .opts{gap:10px}
.dec .dopt .ch{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px;border:1px solid #4a4334;border-left:1px solid #4a4334;background:#221e16;border-radius:6px;text-align:left;min-height:64px}
.dec .dopt .ch:hover,.dec .dopt .ch:focus-visible{border-color:var(--gold);background:#2b261b}
.dec .ch-t{display:flex;align-items:flex-start;gap:8px}
.dec .ch-t .otag{flex:none;margin:3px 0 0;font-size:12px;padding:1px 6px}
.dec .ch-t b{font-size:18px;line-height:1.45;color:#fff}
.dec .dopt .ch small{font-size:14px;color:#c7bca5;padding-left:2px}
@media (max-width:560px){.dec .dopt{grid-template-columns:1fr}.dec .dmap,.dec .dmap svg{height:100px}.dec .dttl{margin-top:2px}}
/* 冒頭の演出：文字は上の空に、ゆっくり（v3.6） */
.io-txt{bottom:auto;top:16%;padding:16px 18px;background:radial-gradient(ellipse at center,rgba(0,0,0,.62) 0%,rgba(0,0,0,.35) 55%,transparent 75%)}
.io-txt .io-d{font-size:clamp(20px,5vw,30px)}
.io-txt .io-t{font-size:clamp(17px,4.4vw,22px);line-height:1.9}
.io-txt.in .io-big{animation:inkBig 1.4s cubic-bezier(.2,.8,.2,1) both .9s}
.io-txt.in>*{animation:fadeUp 1.2s ease both}.io-txt.in>*:nth-child(2){animation-delay:1s}.io-txt.in>*:nth-child(3){animation-delay:2.2s}
.io-bg{animation-duration:7s}.io-march{animation-duration:6.4s}.io-march2{animation-duration:5.4s}.io-siege{animation-duration:6.4s}
.io-glow,.io-temple{animation-duration:6.4s}.io-flames path{animation-duration:.55s,6s}
.io-face{animation-duration:4.4s}.io-face.io-nobu{animation-duration:5.6s}
/* ===== 初回：明智光秀だけを大きく ===== */
.fst{text-align:center;margin:8px 0 6px}
.fst-k{font-size:14px;letter-spacing:.3em;color:var(--shu2);margin:0 0 6px}
.fst-c{display:flex!important;flex-direction:column;align-items:center;gap:6px;width:100%;max-width:440px;margin:0 auto;padding:16px!important;border:1px solid var(--gold)!important;background:linear-gradient(180deg,#221d14,#15120d)!important;grid-template-columns:none!important;text-align:center!important}
.fst-c .pt{width:min(200px,52vw)!important;border-color:var(--gold)}
.fst-c b{font-size:32px!important;color:var(--gold2)}
.fst-s{font-size:15px!important;color:#e6dcc6!important}
.fst-q{font-size:15px!important;color:var(--sub)!important;line-height:1.8!important}
.fst-c .btn{margin-top:6px;pointer-events:none}
.fst-top{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:16px;align-items:center}
.fst-top .gc{width:auto;flex:initial}
.fst-h{font-size:clamp(26px,6vw,36px);color:var(--gold2);margin:0 0 6px}
.fst-x p{margin:0 0 6px;font-size:16px}
@media (max-width:560px){.fst-top{grid-template-columns:1fr 1fr;gap:10px}.fst-x p{font-size:14px}.fst-h{font-size:22px}}
/* ===== 主役の札（目覚め） v3.6 ===== */
.wk2{position:relative;overflow:hidden;border:2px solid var(--gold);border-radius:6px;padding:16px;background:radial-gradient(ellipse at 30% 0%,#2c2416,#120f0b 70%);box-shadow:0 0 0 1px #000,0 0 40px rgba(230,200,120,.18);animation:wk2In .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes wk2In{from{opacity:0;transform:scale(.94) rotateX(12deg)}to{opacity:1;transform:none}}
.wk2 .rays{opacity:.35}
.wk2-top{position:relative;display:grid;grid-template-columns:minmax(120px,210px) 1fr;gap:16px;align-items:start}
.wk2-p{position:relative}.wk2-p .pt{width:100%;border:2px solid var(--gold);box-shadow:0 0 24px rgba(230,200,120,.35)}
.wk2-seal{position:absolute;left:-6px;top:-8px;font-size:20px;padding:2px 10px;background:linear-gradient(135deg,#7a1d12,#c23b25);color:#fff;border:1px solid #f0c27a;transform:rotate(-8deg);box-shadow:0 2px 8px #000;animation:sealIn .6s cubic-bezier(.3,1.6,.5,1) .5s both}
@keyframes sealIn{from{transform:scale(2.4) rotate(-20deg);opacity:0}to{transform:rotate(-8deg);opacity:1}}
.wk2-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 6px}
.wk2-chips span{font-size:13px;padding:2px 10px;border:1px solid var(--line);border-radius:2px;color:#e6dcc6;background:rgba(0,0,0,.35)}
.wk2-chips .dch{border-color:currentColor;font-weight:700}
.wk2-n{font-size:clamp(36px,9vw,58px);line-height:1.15;margin:0;color:#fff;text-shadow:0 0 18px rgba(230,200,120,.45),0 3px 0 #000;letter-spacing:.06em}
.wk2-k{margin:0 0 8px;font-size:14px;color:var(--sub);letter-spacing:.2em}
.wk2-kv{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 12px;margin:0}
.wk2-kv div{border-top:1px solid var(--line);padding-top:4px}.wk2-kv dt{font-size:12px;color:var(--sub)}.wk2-kv dd{margin:0;font-size:16px;font-weight:700;color:#f3ead6}
.wk2-st{position:relative;margin-top:14px;padding:12px;border:1px solid #5a4a2a;border-radius:6px;background:rgba(0,0,0,.4)}
.wk2-sh{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin:0 0 8px}.wk2-sh .lbl{margin:0;font-size:13px}
.wk2-sh b{font-size:18px;color:var(--gold2)}.wk2-sh b em{font-style:normal;font-family:var(--f-brush);font-size:36px;color:#fff;margin:0 2px;text-shadow:0 0 12px rgba(230,200,120,.6)}
.wk2-sh small{font-size:14px;color:var(--sub)}
.wk2-g{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center}
.rdr{width:100%;overflow:visible}.rdr-g{fill:none;stroke:#4a4030;stroke-width:.6}
.rdr-v{fill:rgba(230,200,120,.35);stroke:#E6C878;stroke-width:1.6;transform-origin:60px 60px;animation:rdrIn 1.1s cubic-bezier(.2,.8,.2,1) .4s both;filter:drop-shadow(0 0 4px rgba(230,200,120,.8))}
@keyframes rdrIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.rdr-t{font-size:9px;fill:#cdbf9f;text-anchor:middle;font-family:var(--f-body)}
.wk2-rows{display:grid;gap:5px}
.wk2-r{position:relative;display:grid;grid-template-columns:3em 2.4em 1.6em 1fr 3.4em;align-items:center;gap:6px}
.wk2-sn{font-size:15px;color:#e6dcc6}
.wk2-v{font-family:var(--f-brush);font-size:30px;line-height:1;color:#fff;text-align:right}
.wk2-v.pop{animation:vPop .35s ease}@keyframes vPop{50%{transform:scale(1.25);color:var(--gold2)}}
.wk2-gr{font-style:normal;font-size:12px;text-align:center;border-radius:2px;padding:0 2px;font-weight:700}
.g-極{background:#c23b25;color:#fff}.g-優{background:#E6C878;color:#1a140a}.g-良{background:#5a7a4a;color:#fff}.g-並{background:#4a4538;color:#ddd}.g-劣{background:#2a2620;color:#999}
.wk2-bar{height:8px;background:#2a2519;border-radius:4px;overflow:hidden}
.wk2-bar s{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#8a6a2a,#E6C878);border-radius:4px;animation:barIn 1s cubic-bezier(.2,.8,.2,1) .5s both}
@keyframes barIn{from{width:0}}
.wk2-r small{font-size:13px;color:var(--sub);text-align:right}
.wk2-r.best .wk2-v{color:var(--gold2);text-shadow:0 0 14px rgba(230,200,120,.8)}
.wk2-tk{position:absolute;left:-6px;top:-6px;font-style:normal;font-size:10px;background:var(--shu);color:#fff;padding:0 4px;border-radius:2px}
.wk2-trait{margin-top:12px;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;font-size:15px}.wk2-trait b{color:var(--gold2);font-size:16px}.wk2-trait span{color:#d8ceb6}
.wk2-fate{margin:4px 0 12px;padding:12px 14px;border-left:4px solid var(--shu);background:linear-gradient(90deg,rgba(184,58,38,.22),rgba(184,58,38,.04));border-radius:0 4px 4px 0}
.wk2-fate p{margin:0 0 6px;font-size:16px;line-height:1.8}
.wk2-cta{font-size:18px!important}.wk2-cta b{color:var(--gold2);font-size:22px;font-family:var(--f-brush);letter-spacing:.1em}
.wk2-goal{font-size:15px!important;color:var(--sub)}.wk2-goal b{color:#fff;font-size:18px}
.btn.shu.big.wk2-go{font-size:22px;padding:14px 36px;letter-spacing:.25em;background:linear-gradient(180deg,#d4513a,#a8321f);color:#fff;border-color:#e88a70;box-shadow:0 6px 24px rgba(184,58,38,.45);animation:goPulse 2.2s ease-in-out infinite}
@keyframes goPulse{50%{box-shadow:0 6px 34px rgba(230,110,80,.75)}}
@media (max-width:560px){.wk2{padding:12px}.wk2-top{grid-template-columns:118px 1fr;gap:10px}.wk2-kv{grid-template-columns:1fr}.wk2-kv dd{font-size:15px}.wk2-g{grid-template-columns:1fr}.rdr{max-width:170px;margin:0 auto}.wk2-r{grid-template-columns:3em 2.2em 1.6em 1fr 3.2em}.wk2-v{font-size:26px}}
.wk2-i,.wk2-st,.wk2-kv,.wk2-trait{text-align:left}
.wk2-n{text-align:left}.wk2-k{text-align:left}
.wk2-tk{position:static;margin-left:4px;font-size:11px;padding:1px 5px}
.wk2-r{grid-template-columns:3em 2.4em 1.6em 1fr 3.2em auto}
@media (max-width:560px){.wk2-kv{grid-template-columns:1fr 1fr}.wk2-r{grid-template-columns:2.8em 2.2em 1.5em 1fr 2.8em auto}.wk2-chips span{font-size:12px}}
/* 明智の場面絵と心の声 */
.ak-art{display:block;width:100%;aspect-ratio:5/3;border:1px solid #5a4a2a;border-radius:4px;background:#000}
.ak-lb{font-size:13px;fill:#e6dcc6;font-family:var(--f-brush)}.ak-lb2{font-size:10px;fill:#1a140a;font-weight:700}
.ak-q{font-size:30px;fill:#e6c878;font-family:var(--f-brush);animation:blink 1.4s ease-in-out infinite alternate}
.ak-fl rect{transform-box:fill-box;transform-origin:left top;animation:wave 1.4s ease-in-out infinite}
.ak-fx{transform-box:fill-box;transform-origin:center bottom;animation:ioFlame .5s ease-in-out infinite alternate}
.ak-rain{animation:akRain .6s linear infinite}@keyframes akRain{to{transform:translate(-6px,14px)}}
.ak-wave{animation:akWave 3s ease-in-out infinite alternate}@keyframes akWave{to{transform:translateX(12px)}}
.ak-lamp{animation:blink 1.8s ease-in-out infinite alternate}
.ak-leaf{animation:akLeaf 6s linear infinite}@keyframes akLeaf{from{transform:translate(0,0) rotate(0)}to{transform:translate(-40px,160px) rotate(220deg)}}
.ak-castle{animation:fadeUp 1.2s ease both}
.ak-voice{margin:8px 0 0;padding:8px 12px;border-left:3px solid #7E5BB5;background:rgba(126,91,181,.14);font-size:16px;line-height:1.7;color:#efe7ff;font-style:italic}
.ak-voice span{display:block;font-style:normal;font-size:12px;color:#b9a6e0;letter-spacing:.2em}
.dec.has-fig .dhead{grid-column:1/-1}@media (max-width:820px){.dec .dfig{margin-top:4px}}
.io-txt .io-t{text-wrap:pretty;word-break:keep-all;overflow-wrap:anywhere}@media (max-width:560px){.io-txt .io-t{font-size:16px}}
@media (max-width:560px){.dec.has-fig .dmap{display:none}}
/* 初回TOP：明智のあとで遊べる4人 */
.t4{margin:18px 0 6px}
.t4-h{font-size:clamp(20px,4.6vw,26px);color:var(--gold2);margin:0 0 8px;text-align:center}
.t4-g{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.t4-c{position:relative;aspect-ratio:2/3;padding:0;border:1px solid #6a5a36;border-radius:4px;overflow:hidden;background:#000;text-align:left;animation:fadeUp .8s ease both calc(var(--i)*.12s)}
.t4-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;filter:saturate(.85) brightness(.85);transition:transform .5s,filter .5s}
.t4-c:hover img{transform:scale(1.06);filter:none}
.t4-c::after{content:"";position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(to top,rgba(0,0,0,.95),transparent)}
.t4-d{position:absolute;z-index:2;top:6px;left:6px;font-size:13px;font-weight:700;padding:1px 8px;background:rgba(0,0,0,.7);border:1px solid currentColor;border-radius:2px}
.t4-c b{position:absolute;z-index:2;left:8px;right:8px;bottom:34px;font-size:clamp(18px,2.6vw,26px);color:#fff;text-shadow:0 2px 6px #000}
.t4-c small{position:absolute;z-index:2;left:8px;right:8px;bottom:6px;font-size:12px;line-height:1.35;color:#d8ceb6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:560px){.t4-g{grid-template-columns:1fr 1fr}.t4-c small{font-size:11px}}
/* 冒頭の演出：文字を大きく、少し下へ */
.io-txt{top:30%}
.io-txt .io-d{font-size:clamp(24px,3.4vw,40px)}
.io-txt .io-t{font-size:clamp(19px,2.6vw,30px);line-height:1.85}
@media (max-width:560px){.io-txt{top:24%}.io-txt .io-t{font-size:18px}}
.hv-r img{scale:-1 1}
@media (max-aspect-ratio:1/1){.io-txt{top:7%;background:none}.io-txt .io-t{font-size:clamp(17px,4.6vw,22px)}.io-txt .io-d{font-size:clamp(22px,6vw,30px)}}
.intro{background:linear-gradient(180deg,#05060d 0%,#0a0912 40%,#000 100%)}
.co-n{font-size:19px}.co-p{font-size:14px}.co.me .co-n{font-size:23px;fill:#ffcdbf}.co.me .co-p{font-size:16px}
.wk-ppt{font-size:clamp(20px,4.8vw,28px);color:var(--gold2);margin:0 0 8px;text-align:left}
#goBtn.wk2-go{margin:14px auto 6px}
/* 一生の画面（スマホ）：操作は折り返す・順位は詰める */
@media (max-width:600px){
  .hudCtl{flex-wrap:wrap;overflow:visible;gap:4px}
  .hudCtl .spd{display:inline-flex;gap:0}.hudCtl .spd .btn{padding:4px 8px;border-radius:0;margin-left:-1px}
  .hudCtl #skipBtn,.hudCtl #autoBtn{flex:1}
  .rk>div{display:grid;grid-template-columns:1fr auto;column-gap:8px;align-items:center}
  .rk .rb{grid-column:1/-1;height:5px}
  .rank{gap:3px}
}
/* ===== 決断の窓 v3.7：上に絵と地図、下に横長の選択肢（五十年転生の並び） ===== */
.dec .mdlg,.dec.has-fig .mdlg{display:block!important;max-width:min(760px,96vw)!important}
.dtop{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 10px}
.dtop.two{grid-template-columns:1.25fr 1fr;align-items:stretch}
.dtop .dfig{margin:0!important}
.dtop .dmap{margin:0;height:100%!important;min-height:120px}
.dtop .dmap svg{height:100%!important;min-height:120px}
.dtop .ak-voice{font-size:15px;margin-top:6px}
.dec.has-fig .dmap{display:block}
.dec .opts,.dec .dopt,.dec.war .opts{display:flex!important;flex-direction:column;gap:8px}
.dec .dopt .ch,.dec #bOpt .ch{display:grid!important;grid-template-columns:auto 1fr;column-gap:10px;row-gap:2px;align-items:center;width:100%;min-height:56px;padding:10px 16px!important;border-radius:12px!important;text-align:left;background:#26221a;border:1px solid #574c34}
.dec .dopt .ch .ch-t{display:contents}
.dec .dopt .ch .otag,.dec #bOpt .ch .otag{grid-row:1/span 2;align-self:center;margin:0}
.dec .dopt .ch b,.dec #bOpt .ch b{font-size:18px;line-height:1.4}
.dec .dopt .ch small,.dec #bOpt .ch small{grid-column:2;padding:0;font-size:14px}
.dec .dopt .ch:hover,.dec #bOpt .ch:hover{background:#332c1f;border-color:var(--gold)}
.dec .dopt .ch.pick,.dec #bOpt .ch.pick{background:linear-gradient(90deg,#8a6a2a,#c9a452);border-color:#e6c878}
.dec .dopt .ch.pick b,.dec .dopt .ch.pick small{color:#16120a}
@media (max-width:560px){.dtop.two{grid-template-columns:1fr}.dtop.two .dmap{min-height:90px;height:90px!important}.dtop.two .dmap svg{min-height:90px}}
@media (max-width:560px){.dec.has-fig .dtop .dmap{display:none}}
/* 決断の窓 v3.8：五十年転生の量（短い本文・2〜3択・一列） */
.dec .mdlg,.dec.has-fig .mdlg{max-width:min(640px,96vw)!important}
.dtop .ak-art{aspect-ratio:3/1;max-height:170px;object-fit:cover}
.dtop .dmap{height:110px!important;min-height:0}.dtop .dmap svg{height:110px!important;min-height:0}
.dec .dx{font-size:20px;line-height:1.7}
.dec .dopt .ch,.dec #bOpt .ch{border-left:4px solid var(--gold)!important;border-radius:4px!important;min-height:64px;background:linear-gradient(90deg,#2c2619,#1c1913)}
.dec .dopt .ch b,.dec #bOpt .ch b{font-size:20px}
.dec .dopt .ch small,.dec #bOpt .ch small{font-size:15px;color:#d8c9a6}
.dec .dopt.one .ch,.dec #bOpt .ch:only-child{justify-content:center;text-align:center;border-left-width:1px!important;background:linear-gradient(180deg,#d4513a,#a8321f);border-color:#e88a70}
.dec #bOpt .ch:only-child b{color:#fff;font-size:22px;letter-spacing:.3em}
.dec #bOpt .ch:only-child .otag{display:none}
.dec #bOpt .ch:only-child{grid-template-columns:1fr}
@media (max-width:560px){.dec.has-fig .dtop .dmap{display:block}.dtop .ak-art{aspect-ratio:2.4/1}}
.shopi.off{opacity:.55;cursor:default}
.flinks{list-style:none;padding:0;margin:8px 0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:14px}
.fcred{font-size:12px}
/* PCのファーストビューに「無料で始める」まで入れる */
@media (min-width:760px){
  .hv{height:clamp(360px,calc(100vh - 300px),640px)!important}
  .cta1{padding-top:0}.cta1 .hv-q{margin:2px 0 6px}
}
@media (min-width:760px){.hv-seal{top:auto;bottom:14%;left:calc(50% + 330px);width:56px;height:56px;font-size:34px}}
#goBtn .gb1{display:block}#goBtn .gb2{display:block;font-size:14px;letter-spacing:.1em;opacity:.85;margin-top:2px}
/* プレイ画面より：大きく */
.shots{grid-template-columns:repeat(2,1fr)!important;gap:18px}
@media (max-width:700px){.shots{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px}.shots .shot{flex:0 0 88%;scroll-snap-align:center}}
.shot img{width:100%;height:auto;display:block}
.shot figcaption b{font-size:20px}.shot figcaption small{font-size:14px}
/* コレクション */
.ctot{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;margin:0 0 12px}
.ctot b{font-size:34px;color:var(--gold2);font-family:var(--f-brush)}.ctot b small{font-size:15px;color:var(--sub)}
.ctb{height:12px;background:#2a2519;border-radius:6px;overflow:hidden}.ctb i{display:block;height:100%;background:linear-gradient(90deg,#8a6a2a,#E6C878)}
.cg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;align-items:start}
.cmap p{margin:6px 0 0;font-size:15px;text-align:center}.cmap p b{font-size:22px;color:var(--gold2)}
.crs{display:grid;gap:10px}
.cl{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.cl b{font-size:16px}.cl span{font-size:20px;color:#fff}.cl span small{font-size:13px;color:var(--sub)}
.cst{font-style:normal;color:var(--gold2);margin-left:6px;font-size:14px}.cst em{font-style:normal;color:#4a4030}
.cb{height:7px;background:#2a2519;border-radius:4px;overflow:hidden;margin-top:3px}.cb i{display:block;height:100%;background:var(--gold)}
.cr p{margin:2px 0 0;font-size:12px}
.cchips{display:flex;flex-wrap:wrap;gap:4px}.cchips span{font-size:12px;padding:1px 7px;border:1px solid #3a352a;border-radius:2px;color:#6d6455}
.cchips span.on{color:#d8ceb6;border-color:#6a5a36}.cchips span.win{color:#1a140a;background:var(--gold2);border-color:var(--gold2)}
#whereBox{padding:8px}
@media (max-width:700px){.cg{grid-template-columns:1fr}}
.sinceH{display:inline-block;margin:0 8px;padding:1px 8px;border:1px solid var(--shu);border-radius:2px;color:#ffcdbf;font-size:13px;background:rgba(184,58,38,.18)}
.sinceH b{font-size:17px;color:#fff;margin:0 2px}
.dhead .sinceH{margin:0 8px 0 0}
.gotL{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 8px}.gotL span{font-size:28px;color:#1a140a;background:linear-gradient(180deg,#f3d27a,#c9a452);padding:2px 14px;border-radius:3px;animation:sealIn .5s cubic-bezier(.3,1.6,.5,1) both}
.gotN{margin:4px 0;font-size:17px}.gotN b{font-size:21px;color:var(--gold2)}
.sc0{font-size:17px;line-height:1.8;margin:0 0 8px}.sc0 b{color:var(--gold2)}
.dec.watch .mdlg{max-width:min(720px,96vw)!important}
.wY{font-size:30px;color:var(--gold2);margin:0 0 6px;text-align:center}
.wRank{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:15px;margin:8px 0}.wRank b{color:var(--gold2);margin-right:4px}
.wTick{max-height:180px;overflow:auto;font-size:14px;border-top:1px solid var(--line);padding-top:6px}.wTick div{margin:3px 0}.wTick .yr{color:var(--gold);margin-right:8px}
.cp-watch{font-size:17px}.cp-watch b{color:var(--gold2)}
.passIn{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}.passIn input{flex:1;min-width:0;font:inherit;font-size:16px;padding:8px 10px;background:#0f0d0a;color:var(--ink);border:1px solid var(--line);border-radius:3px}
.kakunin{width:100%;border-collapse:collapse;font-size:15px}.kakunin th{text-align:left;width:7.5em;color:var(--sub);font-weight:400;padding:4px 8px 4px 0;vertical-align:top}.kakunin td{padding:4px 0}
.hint1{margin:0 0 10px;padding:8px 12px;border:1px dashed var(--gold);border-radius:4px;font-size:15px;line-height:1.7;background:rgba(230,200,120,.08)}.hint1 b{color:var(--gold2)}
.wk-mem{font-size:16px;color:#d8c6ff}.wk-mem b{color:#fff}
.tkAgain{margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:6px}.tkAgain .row{gap:10px;flex-wrap:wrap}
.ak-v{display:block;font-size:16px;color:#d8c6ff;font-style:italic;margin:0 0 6px;line-height:1.6}

/* v4.1 カットインの大文字は1行に収める（文字数で大きさを決める） */
.cutin b{white-space:nowrap;font-size:min(120px,18vw,calc(88vw / (var(--n,4) * 1.15)));letter-spacing:.12em;padding-left:.12em}
/* v4.1 日本語の折り返し：1文字だけ次の行に落ちるのを防ぐ（対応ブラウザのみ） */
h1,h2,h3,h4,.io-d,.io-big,.io-t,.ch b,.ch strong,.dttl,.dec h3,.cutin small,.wk2 h2{text-wrap:balance;word-break:auto-phrase}
@media (max-aspect-ratio:1/1){.io-txt .io-d{letter-spacing:.14em}}
.dsub .dwhen{white-space:nowrap}.dsub b{display:inline-block}
/* v4.1 山崎の勝ち負けの理由 */
.bWhy{margin-top:10px;padding:10px 12px;border:1px solid rgba(201,164,82,.35);border-radius:6px;background:rgba(0,0,0,.35);text-align:left}
.bWhy .bw-h{margin:0 0 6px;color:var(--gold2);font-size:16px}.bWhy .bw-h small{color:#bba;font-size:12px;margin-left:6px}
.bWhy ul{margin:0;padding:0;list-style:none}.bWhy li{font-size:15px;line-height:1.6;padding-left:1.4em;position:relative}
.bWhy li.ng::before{content:"✕";position:absolute;left:0;color:#e46a4a}.bWhy li.ok::before{content:"○";position:absolute;left:0;color:#8fd08f}
.bWhy .bw-n{margin:8px 0 0;font-size:14px;color:#f3e6c0}
/* v4.1 結末の画面：下に「次の転生」を常に出す（3秒後に出てくる） */
.tkBar{position:sticky;bottom:0;z-index:5;display:flex;gap:8px;justify-content:center;padding:10px 12px calc(10px + env(safe-area-inset-bottom));margin:16px -12px 0;background:linear-gradient(transparent,rgba(10,6,4,.92) 30%);animation:fadeUp .5s ease both 3s}
.tkBar .btn{flex:1;max-width:220px;font-size:17px;padding:12px 8px}
/* v4.1 お店 */
.shopi{position:relative}.shopi.rec{border-color:var(--gold2);box-shadow:0 0 0 1px rgba(230,200,120,.35),0 0 18px rgba(230,200,120,.18)}
.shop-rec{position:absolute;top:-10px;right:-6px;font-style:normal;font-size:12px;background:#b83a26;color:#fff;padding:2px 8px;border-radius:10px}
.shopL{margin:10px 0}.shopLg{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.shopLg span{display:flex;flex-direction:column;align-items:center;width:58px;font-size:11px;text-align:center}.shopLg b{font-weight:400;margin-top:2px}
.wb-mem{padding:8px 10px;border-left:3px solid var(--gold2);background:rgba(201,164,82,.08);font-size:15px}
@supports (overflow:clip){.tenka{overflow:clip}}
/* v4.2 TOP：明智の顔が切れない・「変」の印を文字に重ねない */
@media (max-width:759px){.hv-r img{object-position:22% 8%}.hv-seal{top:13%;width:54px;height:54px;margin:-27px 0 0 -27px;font-size:34px}}
/* v4.2 導入：信長の顔を文字と寺に重ねない（スマホ） */
@media (max-aspect-ratio:1/1){
  .io-face.io-nobu{top:30%;height:36%;left:50%;right:auto;translate:-50% 0;opacity:.95;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 45%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 45%,#000 55%,transparent 100%)}
}
/* v4.2 目覚め：「転生」を大きく */
.wk-tensei{margin:4px 0 0;text-align:center;font-size:clamp(56px,17vw,96px);line-height:1.05;letter-spacing:.3em;padding-left:.3em;color:#fff;text-shadow:0 0 28px rgba(230,200,120,.75),0 3px 0 #000;animation:inkBig 1.2s cubic-bezier(.2,.8,.2,1) both}
.wk-done{text-align:center;font-size:clamp(24px,6.6vw,34px);margin:14px 0 6px;color:#f3e6c0}.wk-done b{color:#fff;font-weight:400;font-size:1.2em}
.wk2-seal{display:none}
/* v4.2 地図の家の印（家紋がわりの丸）と、同盟・敵・従う家の輪 */
.map .hm-c{stroke:#fff;stroke-width:1.4px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.map .hm-k{fill:#fff;text-anchor:middle;font-family:var(--f-brush);paint-order:stroke;stroke:rgba(0,0,0,.55);stroke-width:2px}
.map .hm .cap{font-size:12px;stroke-width:3px}
.map .hm-me .hm-c{stroke:#ffd27a;stroke-width:2.6px}
.map .hm-hostile .hm-c{stroke:#ff4a3a;stroke-width:2.6px;stroke-dasharray:3 2}
.map .hm-ally .hm-c{stroke:#7fb2ff;stroke-width:2.6px}
.map .hm-vas .hm-c{stroke:#f2a0a8;stroke-width:2.6px}
.map .hm-hostile .cap{fill:#ffb0a0}.map .hm-ally .cap{fill:#bcd6ff}
/* ===== v4.2 一生の画面：FV（上の帯）を作り直す ===== */
#lifeBody .hud.hud2{display:flex;flex-direction:column;gap:6px;padding:8px 10px}
.h2-top{display:flex;gap:10px;align-items:center}
.h2-top .hudFace .pt{width:52px}
.h2-id{min-width:0;flex:1}
.h2-n{margin:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.h2-n .hudName{font-size:24px;color:var(--gold2);font-weight:400}.h2-n .age{font-size:18px;color:#f3e6c0}
.sinceB{font-size:13px;border:1px solid var(--shu);color:#ffd2c4;padding:1px 8px;background:rgba(184,58,38,.18)}.sinceB b{font-size:16px;margin:0 2px}
.h2-y{margin:2px 0 0;display:flex;gap:10px;align-items:baseline;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
.h2-y .eraTag{color:#f3e6c0}.h2-y .hudRank{color:var(--gold2);font-weight:700}
.h2-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.h2-st span{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);background:rgba(0,0,0,.25);padding:3px 2px;min-width:0}
.h2-st small{font-size:11px;color:var(--sub)}.h2-st b{font-size:16px;color:#fff;font-weight:700;white-space:nowrap}.h2-st b i{font-style:normal;font-size:11px;margin-left:1px}
.h2-ctl{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-start;max-width:none}
.h2-ctl .btn{flex:1 1 auto;padding:6px 8px;font-size:14px;white-space:nowrap}
.h2-ctl .h2-hyo,.h2-ctl .h2-money{border-color:var(--gold2);color:#fff;background:color-mix(in srgb,var(--gold) 22%,transparent);font-weight:700}
@media (max-width:600px){.h2-n .hudName{font-size:21px}.h2-st b{font-size:14px}.h2-ctl .btn{font-size:13px;padding:6px 6px}}
/* 下に出る知らせ：横に広く・読みやすく */
.toast{width:min(640px,calc(100% - 24px));max-width:none;box-sizing:border-box;font-size:16px;line-height:1.65;padding:12px 16px;text-align:left;box-shadow:0 6px 24px rgba(0,0,0,.6)}
.toast small{font-size:13px;color:#d9cdb0}
.tipbar{display:block;height:8px;margin-top:6px;background:#2a241a;border:1px solid var(--line)}.tipbar i{display:block;height:100%;background:linear-gradient(90deg,#c9a452,#E8434F)}
.tipmap{margin-top:6px;max-height:150px;overflow:hidden}.tipmap .map{border:0}
/* 評定の窓 */
.hyo-st{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:10px}.hyo-st span{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);padding:6px 2px}.hyo-st small{color:var(--sub);font-size:12px}.hyo-st b{font-size:22px;color:#fff}.hyo-st em{font-style:normal;font-size:11px;color:var(--gold2)}
.hyo-rel{list-style:none;margin:4px 0 10px;padding:0}.hyo-rel li{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px dashed var(--line);font-size:15px}.hyo-rel i{width:12px;height:12px;display:inline-block}.hyo-rel b{margin-left:auto;font-size:13px}.hyo-rel b.ally{color:#9cc4ff}.hyo-rel small{color:var(--sub);width:3em;text-align:right}
.hyo-ch{font-size:15px;margin:6px 0 12px}
/* 軍議の上の表 */
.situ{width:100%;border-collapse:collapse;margin:8px 0 4px;font-size:13px}.situ th,.situ td{border-bottom:1px solid var(--line);padding:4px 3px;text-align:left;white-space:nowrap}.situ th{color:var(--sub);font-weight:400}.situ td i{display:inline-block;width:10px;height:10px;margin-right:4px}.situ tr.me td{color:#fff;font-weight:700}
.situ2{font-size:13px;margin:4px 0 0;color:#d9cdb0}
@media (max-width:600px){.situ{font-size:12px}.situ th,.situ td{padding:3px 2px}}
#lifeBody .hud2 .h2-st{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));width:100%}
#lifeBody .hud2 .h2-ctl{display:grid;grid-template-columns:1fr 1.35fr 1.15fr 1.6fr 1.05fr;gap:4px;overflow:visible;width:100%}
#lifeBody .hud2 .h2-ctl .btn{min-width:0;padding:7px 2px;font-size:13px;text-align:center;letter-spacing:0;line-height:1.2}
#lifeBody .hud2 .h2-ctl #autoBtn:not([hidden]),#lifeBody .hud2 .h2-ctl #endBtn:not([hidden]){grid-column:1/-1}
#lifeBody .hud.hud2{max-width:100%;box-sizing:border-box;overflow:hidden;min-width:0}
#lifeBody .hud2>*{min-width:0;max-width:100%}
#lifeBody .hud2 .h2-st{grid-template-columns:repeat(4,minmax(0,1fr))}
#lifeBody .hud2 .h2-st span{overflow:hidden}
#lifeBody .hud2 .h2-ctl{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) minmax(0,1.15fr) minmax(0,1.6fr) minmax(0,1.05fr)}
#lifeBody .hud2 .h2-ctl .btn{white-space:normal;overflow:hidden}
.toast{left:0;right:0;margin:0 auto;transform:none}
#lifeBody .hud2 .h2-st{display:flex;gap:4px}#lifeBody .hud2 .h2-st span{flex:1 1 0}
#lifeBody .hud2 .h2-top{width:100%;justify-content:flex-start}
#lifeBody .hud2 .h2-ctl{grid-template-columns:minmax(0,.9fr) minmax(0,1.45fr) minmax(0,1.15fr) minmax(0,1.25fr) minmax(0,1fr)}
@media (min-width:901px){#lifeBody .hud2 .h2-st,#lifeBody .hud2 .h2-ctl{max-width:760px}.stage{aspect-ratio:5/1}}
@keyframes toastIn{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
.toast{animation:toastIn .3s ease both}
/* v4.2b 「無料で始める」：漆の黒に金の縁・金の文字（安っぽい金一色をやめる） */
#wakeBtn{display:inline-flex;flex-direction:column;align-items:center;gap:4px;background:linear-gradient(180deg,#2b0d09 0%,#150706 100%);border:1px solid #d8b465;border-radius:3px;color:#f6dc92;padding:18px 76px 14px;
  box-shadow:inset 0 0 0 4px #150706,inset 0 0 0 5px rgba(216,180,101,.6),0 0 0 1px rgba(0,0,0,.6),0 8px 28px rgba(184,35,26,.35),0 0 42px rgba(230,190,110,.12);transition:transform .2s,box-shadow .2s}
#wakeBtn .cta-m{font-family:var(--f-brush);font-size:30px;letter-spacing:.32em;padding-left:.32em;line-height:1.1;background:linear-gradient(180deg,#fff3c8 0%,#e8c470 55%,#b98a35 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 rgba(0,0,0,.6))}
#wakeBtn .cta-s{font-size:13px;letter-spacing:.2em;color:#e7b9a6;opacity:.9}
#wakeBtn::before{content:"";position:absolute;left:10px;right:10px;top:50%;height:1px;background:none}
#wakeBtn::after{opacity:.22}
#wakeBtn:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 4px #150706,inset 0 0 0 5px rgba(216,180,101,.9),0 0 0 1px rgba(0,0,0,.6),0 12px 34px rgba(184,35,26,.5),0 0 60px rgba(230,190,110,.22)}
@media (max-width:480px){#wakeBtn{padding:16px 40px 12px}#wakeBtn .cta-m{font-size:26px}}
/* PC：顔が切れない高さで見せる */
/* v4.3c PC：絵を縮めずに丸ごと見せる（頭から胸まで）。左右の端に二人、内側はぼかす */
@media (min-width:760px){
  .hv{--fw:calc(clamp(360px, 100vh - 300px, 640px) * .72)}
  .hv-p{width:var(--fw);clip-path:none!important}
  /* 二人は題字のすぐ外側に寄せる（画面の端に貼りつけない） */
  .hv-l{left:max(0px, calc(50% - 250px - var(--fw)))}.hv-r{right:max(0px, calc(50% - 250px - var(--fw)))}
  .hv-p img{object-fit:cover;object-position:50% 0;transform:none!important;animation:none!important}
  .hv-r img{object-position:50% 0}
  .hv-l{-webkit-mask-image:linear-gradient(90deg,#000 68%,transparent 100%);mask-image:linear-gradient(90deg,#000 68%,transparent 100%)}
  .hv-r{-webkit-mask-image:linear-gradient(270deg,#000 68%,transparent 100%);mask-image:linear-gradient(270deg,#000 68%,transparent 100%)}
}

/* v4.3 星（i.cst）が合戦の札（figure.cst）の指定を受けて、ページ全体に透明な大きな板が乗り、ボタンが押せない所があった */
i.cst{position:static;height:auto;aspect-ratio:auto;z-index:auto;bottom:auto}
/* ===== v4.3 ボタン：五十年転生と同じ作り（朱の「始める」・黒の「続きから」・中に小さな説明） ===== */
.sbar{background:none;border-top:0;padding:0 10px calc(10px + env(safe-area-inset-bottom,0px))}
.sbar-in{max-width:620px;background:#141210;border:1px solid #c9a452;border-radius:10px;padding:10px;gap:10px;box-shadow:0 -6px 24px rgba(0,0,0,.6)}
.sbar-in .sb-go,.sbar-in .sb-cont{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:6px;cursor:pointer;min-height:58px;line-height:1.2;padding:6px 10px;-webkit-tap-highlight-color:transparent}
.sbar-in .sb-go{flex:2;background:#b83a26;border:0;color:#fff;font-family:var(--f-brush);font-size:22px;letter-spacing:.14em;text-indent:.14em;position:relative;overflow:hidden}
.sbar-in .sb-go small{display:block;font:500 11px var(--f-body);letter-spacing:0;text-indent:0;margin-top:4px;opacity:.92}
.sbar-in .sb-cont{flex:1;background:#1c1914;border:1px solid #3a3326;color:#f3eee3;font-size:15px}
.sbar-in .sb-cont small{display:block;font-size:11px;color:#c8bfae;margin-top:3px}
.sbar-in .sb-go:active,.sbar-in .sb-cont:active{transform:scale(.98)}
.sbar .sb-go::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:btnShine 3.2s ease-in-out infinite}
#wakeBtn{background:#b83a26;border:0;border-radius:6px;color:#fff;padding:16px 70px 12px;box-shadow:0 0 0 1px rgba(255,210,180,.25),0 10px 30px rgba(184,58,38,.45)}
#wakeBtn .cta-m{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#fff;filter:none;font-size:30px;letter-spacing:.24em;padding-left:.24em}
#wakeBtn .cta-s{font:500 13px var(--f-body);letter-spacing:.04em;color:#ffe9df}
#wakeBtn:hover{background:#c8442d;transform:translateY(-1px);box-shadow:0 0 0 1px rgba(255,210,180,.4),0 14px 36px rgba(184,58,38,.6)}
#wakeBtn::after{opacity:.35}
/* v4.3 地図の「あなた」 */
.map .me-box{fill:#c8321e;stroke:#fff;stroke-width:1.2px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.map .me-tip{fill:#c8321e;stroke:#fff;stroke-width:1px}
.map .me-t{fill:#fff;text-anchor:middle;font-family:var(--f-brush);letter-spacing:.08em}
.map .me-tag{animation:meBob 1.6s ease-in-out infinite}
@keyframes meBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
/* v4.3 合戦：はじめから選択肢がすべて見えるよう、顔の札を小さく・選択肢を詰める */
.dec.war .vsbig .pt{width:min(92px,21vw)!important}
.dec.war .vsbig b{font-size:17px}.dec.war .vsbig small{font-size:12px}
.dec.war .vsbig .mid .x{font-size:34px}.dec.war .vsbig .mid .kei{font-size:15px;padding:2px 8px}
.dec.war .dttl{font-size:24px;margin:4px 0}.dec.war .dx{margin:2px 0 8px}
.dec.war .dopt{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:6px}
.dec.war .dopt .ch{padding:8px 10px;margin:0}.dec.war .dopt .ch small{font-size:13px}
@media (min-width:900px){.dec.war .mdlg{max-width:860px}}
/* ===== v4.3 一生の画面のFV：重複をなくし、詰める ===== */
#lifeBody #lfStage,#lifeBody .pstrip{display:none}
#lifeBody .fdPeers:empty{display:none}
#lifeBody .hud2 .h2-ab{display:flex;gap:4px}
#lifeBody .hud2 .h2-ab span{flex:1 1 0;display:flex;align-items:baseline;justify-content:center;gap:4px;border:1px solid var(--line);padding:2px 2px;background:rgba(0,0,0,.18);min-width:0}
#lifeBody .hud2 .h2-ab small{font-size:11px;color:var(--sub)}#lifeBody .hud2 .h2-ab b{font-size:15px;color:#f3e6c0}#lifeBody .hud2 .h2-ab .fup b{color:#8fd08f}
.h2-feed{display:flex;gap:8px;align-items:flex-start;border-top:1px dashed var(--line);padding-top:6px;min-width:0}
.h2-fl{flex:none;font-size:11px;color:var(--gold2);border:1px solid var(--gold);padding:1px 6px;margin-top:2px;white-space:nowrap}
.h2-feed ul{list-style:none;margin:0;padding:0;min-width:0;flex:1}
.h2-feed li{font-size:14px;line-height:1.5;color:#e9dfc6;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.h2-feed li+li{color:#b9ae96;font-size:13px;-webkit-line-clamp:1}
.h2-feed li .eff{color:#8fd08f;font-size:12px;margin-left:4px}
/* PC：左に名前、右に数字とボタン（何もない所をなくす） */
@media (min-width:901px){
  #lifeBody .hud.hud2{display:grid;grid-template-columns:minmax(300px,auto) minmax(0,1fr);grid-template-areas:"top st" "top ab" "ctl ctl" "feed feed";column-gap:16px;row-gap:6px;padding:10px 14px}
  #lifeBody .hud2 .h2-top{grid-area:top}#lifeBody .hud2 .h2-st{grid-area:st;max-width:none}#lifeBody .hud2 .h2-ab{grid-area:ab}
  #lifeBody .hud2 .h2-ctl{grid-area:ctl;max-width:none}#lifeBody .hud2 .h2-feed{grid-area:feed}
  #lifeBody .hud2 .h2-st span{flex-direction:row;justify-content:center;gap:8px;padding:6px 4px}#lifeBody .hud2 .h2-st small{font-size:13px}#lifeBody .hud2 .h2-st b{font-size:20px}
  .h2-feed li{font-size:15px}
}
.fd-real{display:block;font-size:12px;color:#a99f88;font-weight:400}
/* v4.3 心の声：斜体をやめ、読みやすい字に */
.ak-v{font-style:normal;font-family:var(--f-body);font-size:15px;color:#e6c878;margin:0 0 4px;letter-spacing:.02em}
/* v4.3 上の帯：年は出さず「本能寺から◯」だけ（年は地図の上に出る） */
#lifeBody .hud2 .h2-y .eraTag{display:none}
/* v4.3 情勢の一行と、各大名との間柄 */
.h2-situ{margin:0;font-size:14px;line-height:1.6;color:#e9dfc6;background:rgba(201,164,82,.07);border-left:3px solid var(--gold);padding:4px 8px}
.h2-situ b{color:#fff}.h2-situ .sl-war{color:#ff8a70;font-weight:700}
@media (min-width:901px){#lifeBody .hud.hud2{grid-template-areas:"top st" "top ab" "ctl ctl" "situ situ" "feed feed"}#lifeBody .hud2 .h2-situ{grid-area:situ}}
.rk .rs{font-style:normal;font-size:11px;padding:0 6px;margin-left:6px;border:1px solid;border-radius:2px;vertical-align:1px}
.rs-war{color:#ff8a70;border-color:#ff8a70;background:rgba(255,90,60,.12)}.rs-host{color:#e0a080;border-color:#a06a50}.rs-ally{color:#9cc4ff;border-color:#6a90c8}.rs-peace{color:#bde0a0;border-color:#7a9a60}.rs-vas{color:#f2a7ab;border-color:#b86a72}.rs-neu{color:#b9ae96;border-color:#5a5040}
.rk .rf{font-size:11px;color:var(--sub);margin-left:6px}
.rk-v{font-size:12px;color:#f2a7ab;margin:6px 0 0}
/* ===== v4.3 プレイ画面より：五十年転生と同じ作り（写真は枠の中・説明は別の地） ===== */
.shots{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:16px;overflow:visible!important}
.shot{margin:0;background:var(--panel);border:1px solid var(--line);box-shadow:0 6px 18px rgba(0,0,0,.45);position:relative}
.shot-im{padding:8px 8px 0;background:#07060a}
.shot-im img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center top;border:1px solid #3a3326;border-radius:2px}
.shot figcaption{position:relative;padding:10px 12px 12px 52px;min-height:58px;background:linear-gradient(180deg,#1d1914,#15120e);border-top:1px solid #3a3326;font-family:var(--f-body)}
.shot figcaption .shot-n{position:absolute;left:12px;top:12px;width:28px;height:28px;display:grid;place-items:center;background:#b83a26;color:#fff;font-size:16px;border-radius:2px;margin:0}
.shot figcaption b{display:block;font-family:var(--f-body);font-weight:700;font-size:18px!important;color:var(--gold2);margin-bottom:2px;letter-spacing:.02em}
.shot figcaption small{display:block;font-size:14px!important;color:#cfc5ae;line-height:1.6}
@media (max-width:820px){.shots{grid-template-columns:repeat(2,1fr)!important}}
@media (max-width:560px){.shots{grid-template-columns:1fr!important;gap:14px}.shot{flex:none!important}}
/* 外側の端もぼかす（画面の端に届かない幅のときだけ） */
@media (min-width:1300px){.hv-l{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 70%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 70%,transparent 100%)}.hv-r{-webkit-mask-image:linear-gradient(270deg,transparent 0,#000 12%,#000 70%,transparent 100%);mask-image:linear-gradient(270deg,transparent 0,#000 12%,#000 70%,transparent 100%)}}
/* v4.3c 名前は絵の外側の端に（顔に重ねない） */
@media (min-width:760px){.hv-nl{left:max(10px, calc(50% - 250px - var(--fw) + 6px))!important;right:auto!important}.hv-nr{right:max(10px, calc(50% - 250px - var(--fw) + 6px))!important;left:auto!important}}
/* v4.3d PC：二人の絵の下を暗くしすぎない */
@media (min-width:760px){
  .hv-l::after{background:linear-gradient(90deg,transparent 50%,rgba(184,58,38,.18)),linear-gradient(180deg,transparent 70%,rgba(7,6,10,.55) 100%)}
  .hv-r::after{background:linear-gradient(270deg,transparent 50%,rgba(43,74,122,.2)),linear-gradient(180deg,transparent 70%,rgba(7,6,10,.55) 100%)}
  .hv-temple{opacity:.5;height:30%}
}
/* v4.3f 見出しの折り返しと、題字の選択（青く反転する）を防ぐ */
.hv-q .nw{display:inline-block;white-space:nowrap}
.hv,.hv *,.cta1 .hv-q{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* v4.3f 本編（明智）の欄：右を空けず、流れと始めるボタンで埋める */
.fst-top{max-width:980px;margin:0 auto;grid-template-columns:minmax(150px,280px) 1fr;gap:28px;align-items:stretch;background:linear-gradient(90deg,rgba(126,91,181,.12),rgba(0,0,0,.25));border:1px solid rgba(201,164,82,.45);padding:18px;border-radius:4px}
.fst-x{display:flex;flex-direction:column;justify-content:center;min-width:0}
.fst-k{display:inline-block;align-self:flex-start;margin:0 0 4px!important;font-size:12px!important;letter-spacing:.3em;color:#fff;background:#b83a26;padding:2px 10px}
.fst-h{font-size:clamp(26px,3.4vw,40px);margin:0 0 4px}
.fst-p{font-size:17px!important;color:#f3e6c0;margin:0 0 12px!important}
.fst-flow{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;counter-reset:f}
.fst-flow li{counter-increment:f;position:relative;padding:8px 10px 8px 40px;border:1px solid var(--line);background:rgba(0,0,0,.3)}
.fst-flow li::before{content:counter(f);position:absolute;left:10px;top:9px;width:22px;height:22px;display:grid;place-items:center;background:#7E5BB5;color:#fff;font-size:13px;border-radius:2px}
.fst-flow b{display:block;color:var(--gold2);font-size:15px;font-weight:700}.fst-flow span{font-size:13px;color:#cfc5ae;line-height:1.5}
.fst-cta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.fst-go{background:#b83a26;border:0;color:#fff;border-radius:6px;padding:12px 28px;font-size:18px;font-family:var(--f-brush);letter-spacing:.12em}
.fst-n{font-size:14px!important;color:#b9ae96;margin:0!important}.fst-n b{color:var(--gold2)}
@media (max-width:560px){.fst-top{grid-template-columns:1fr;padding:12px;gap:12px}.fst-top .gc{width:min(220px,62vw);margin:0 auto}.fst-flow{grid-template-columns:1fr}.fst-cta{justify-content:center}.fst-x{text-align:left}}
.fst-x p.fst-h{font-size:clamp(28px,3.4vw,42px);color:var(--gold2);line-height:1.2}
.lead .nw{display:inline-block;white-space:nowrap}
/* v4.4 スマホ：「変」の印は顔に重ねず「転生」の右に押す。ボタンの文字は1行に */
@media (max-width:759px){
  .hv-seal{display:none!important}
  #wakeBtn{padding:14px 12px 10px;width:100%;max-width:440px}
  #wakeBtn .cta-m{white-space:nowrap;font-size:clamp(22px,6.8vw,30px);letter-spacing:.14em;padding-left:.14em}
}
.hv-seal2{display:none}
@media (max-width:759px){
  .hv h1 .d1{position:relative;display:inline-block}
  .hv-seal2{display:grid;place-items:center;position:absolute;left:100%;top:50%;margin-left:12px;width:40px;height:40px;font-size:25px;line-height:1;color:#fff;background:#b8231a;border:2px double #ffd2c4;border-radius:6px;transform:translateY(-78%) rotate(8deg);box-shadow:0 0 0 3px rgba(184,35,26,.3),0 4px 10px rgba(0,0,0,.5);letter-spacing:0;text-indent:0;animation:sealIn .6s cubic-bezier(.3,1.6,.5,1) both 1.2s}
  @keyframes sealIn{from{opacity:0;transform:translateY(-78%) rotate(8deg) scale(2.2)}to{opacity:1;transform:translateY(-78%) rotate(8deg) scale(1)}}
}
@media (max-width:759px){.hv-t .lbl,.hv .lbl{white-space:nowrap;font-size:min(12px,3.2vw);letter-spacing:.12em}}

/* v4.5 共有（𝕏で自慢する）：結果画面の主ボタン */
.svBox{text-align:center;margin:16px 0 4px}
.svHook{color:#ff7a5c;font-size:22px;margin:0 0 8px;letter-spacing:.06em}
.svBtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:min(320px,86vw);padding:16px 28px;font-size:22px;letter-spacing:.12em;white-space:nowrap}
.svBtn .xlogo{width:24px;height:24px;fill:currentColor;flex:none}
.svBtn span{pointer-events:none}
.svBtn.nudge{animation:svN 1.1s ease-in-out 1.2s 3}
@keyframes svN{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@media (prefers-reduced-motion:reduce){.svBtn.nudge{animation:none}}
.svSub{font-size:14px;margin:2px 0 10px}.svSub a{color:inherit;text-decoration:underline}

/* v4.6 課金：お店・初心者パック・天正の会・今日の挑戦・修羅と縛り */
.kk-h{margin:18px 0 8px;font-size:18px}
.kk-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.kk-c{position:relative;border:1px solid rgba(201,164,82,.45);border-radius:10px;padding:14px 14px 12px;background:linear-gradient(180deg,rgba(40,32,22,.9),rgba(16,12,9,.95));text-align:left}
.kk-c.big{border:2px solid #d65a3c;background:linear-gradient(180deg,rgba(70,22,14,.92),rgba(22,9,6,.96));box-shadow:0 0 0 1px rgba(255,140,100,.15),0 8px 26px rgba(0,0,0,.45)}
.kk-c.own{opacity:.7}
.kk-b{position:absolute;top:-10px;right:12px;background:#d65a3c;color:#fff;font-style:normal;font-size:12px;padding:2px 10px;border-radius:99px;letter-spacing:.06em}
.kk-n{font-size:20px;margin:0 0 4px;color:#fff}
.kk-p{margin:0 0 8px}.kk-p b{font-size:26px;color:#E6C878}.kk-p small{margin-left:4px;color:#bfb39a}.kk-p .kk-s{display:block;margin:2px 0 0}
.kk-c ul{margin:0 0 10px;padding-left:1.2em;font-size:14px;line-height:1.6}.kk-c li{margin:2px 0}
.kk-c .btn{width:100%}
.kk-own{margin:6px 0 0;color:#bfb39a;font-size:14px;text-align:center}
.kk-note{margin-top:12px}
.kk-trial{color:#E6C878;font-size:14px;margin:4px 0 8px}
.kk-next{margin:10px 0;padding:8px 12px;border-left:3px solid #E6C878;background:rgba(230,200,120,.08);font-size:14px}
.kk-daily{margin:10px 0 14px;text-align:center}.kk-daily p{margin:4px 0}
.kk-mode{margin:10px 0 14px;padding:12px;border:1px dashed rgba(201,164,82,.5);border-radius:10px}.kk-mode p{margin:4px 0}
.kk-mode.lock{opacity:.9}.kk-mode select{width:100%;margin:6px 0;padding:8px;background:#15110d;color:#ece4d2;border:1px solid rgba(201,164,82,.5);border-radius:6px;font-size:14px}
.kk-sw{display:flex;gap:8px;align-items:center;font-size:15px;margin:6px 0}
.kk-club{margin:16px 0;text-align:center}.kk-club .row{justify-content:center;flex-wrap:wrap}
.kk-judge{margin:12px 0;text-align:center}.kk-judge p{margin:4px 0}
.kk-win{color:#ff8a66}
.kk-alt,.kk-path,.kk-let{padding:8px 0;border-top:1px solid rgba(201,164,82,.2)}.kk-alt p,.kk-path p,.kk-let p{margin:3px 0}
.kk-lockp summary{opacity:.85}
.kk-hint{display:block;font-style:normal;font-size:11px;line-height:1.4;color:#E6C878;margin-top:3px}
.pk-tr{display:block;font-style:normal;font-size:12px;line-height:1.45;color:#cdbf9f;margin-top:3px}
#kkOut,#kkIn{width:100%;box-sizing:border-box;background:#15110d;color:#ece4d2;border:1px solid rgba(201,164,82,.4);border-radius:6px;font-size:12px;padding:8px}

.achs.kk-gold .ac:not(.unk){border-color:#ffd86a;box-shadow:inset 0 0 0 1px rgba(255,216,106,.6),0 0 12px rgba(255,216,106,.15)}
.achs.kk-gold .ac:not(.unk) .seal{color:#ffd86a}

/* v4.7 スマホ：TOPのファーストビューに「無料で始める」まで入れる（Safari の下の帯を除いた高さ svh で計算） */
@media (max-width:759px){
  .hv{height:clamp(300px,min(104vw,calc(100vh - 300px)),620px)!important}
  @supports (height:100svh){ .hv{height:clamp(300px,min(104vw,calc(100svh - 300px)),620px)!important} }
  .cta1{padding-top:0!important}
  .cta1 .hv-q{margin:4px 0 8px!important;font-size:clamp(22px,6.4vw,30px)!important;line-height:1.45}
}
/* v4.7 日々の出来事：2つとも中身が読めるように（1行で切らない） */
.h2-feed li{-webkit-line-clamp:3!important}
.h2-feed li+li{-webkit-line-clamp:3!important;font-size:14px}
@media (max-width:759px){.h2-feed li,.h2-feed li+li{font-size:14px;line-height:1.55}}
/* v4.7 決断の窓：スマホで選択肢が2つ見えるように、絵と説明を詰める */
@media (max-width:759px){
  .dec .dtop .dfig,.dec .dfig{max-height:20vh;overflow:hidden}
  .dec .ak-art{aspect-ratio:auto;height:20vh;max-height:150px;object-fit:cover}
  .dec .dttl{font-size:24px!important;margin:6px 0 4px!important}
  .dec .fhint,.dec .dhint{font-size:13px!important;padding:6px 10px!important;margin:4px 0!important}
  .dec .dx{font-size:16px!important;line-height:1.6!important;margin:4px 0 8px!important}
  .dec .ak-v{font-size:15px!important}
  .dec .dopt .ch{padding:10px 12px!important}
  .dec .dopt .ch b{font-size:18px!important}
  .dec .dopt .ch small{font-size:13px!important;line-height:1.5}
}
/* v4.7 諸大名の動き（序章の地図の下） */
.mv-list{margin:6px 0 0;padding:0;list-style:none}
.mv-list li{display:flex;gap:8px;align-items:baseline;font-size:14px;line-height:1.5;padding:4px 0;border-top:1px dashed rgba(201,164,82,.25)}
.mv-list li i{flex:none;width:10px;height:10px;border-radius:2px;margin-top:5px}
.mv-list li b{color:#f1e3bd;font-weight:700;white-space:nowrap}
.mv-h{font-size:13px;color:var(--gold2);letter-spacing:.1em;margin:8px 0 0}
/* v4.7 スマホのFV（遊ぶ画面）：能力の列は出さない（評定で見られる）。石高・兵力・蓄えは1行に。居場所は下の1行と重なるので上では出さない */
#lifeBody #lfWhere{display:none}
@media (max-width:759px){
  #lifeBody .hud2 .h2-ab{display:none!important}
  #lifeBody .hud2 .h2-st{display:flex!important;gap:0;border:1px solid var(--line);background:rgba(0,0,0,.25)}
  #lifeBody .hud2 .h2-st span{flex:1 1 auto!important;flex-direction:row!important;align-items:baseline;justify-content:center;gap:4px;border:0!important;background:none!important;padding:5px 2px!important}
  #lifeBody .hud2 .h2-st span+span{border-left:1px solid var(--line)!important}
  #lifeBody .hud2 .h2-st small{font-size:12px!important}#lifeBody .hud2 .h2-st b{font-size:15px!important}
}
/* v4.7b 決断の窓（スマホ）：頭の3行を1行に、絵を低く。選択肢を2つまでFVに */
@media (max-width:759px){
  .dec .mdlg{padding:10px 12px!important}
  .dec .dhead{margin:0 0 4px!important;align-items:center!important}
  .dec .dsub{display:flex!important;flex-wrap:wrap;gap:4px 8px;align-items:center;margin:0!important;font-size:13px!important}
  .dec .dsub > b{display:none!important}
  .dec .sinceH{padding:1px 8px!important;font-size:13px!important;margin:0!important}
  .dec .sinceH b{font-size:15px!important}
  .dec .dwhen{font-size:13px!important}
  .dec .mLow{padding:4px 8px!important;font-size:12px!important}
  .dec .dtop .dfig,.dec .dfig{max-height:13vh!important}
  .dec .ak-art,.dec .dfig svg{height:13vh!important;max-height:96px!important}
  .dec .dttl{font-size:22px!important}
  .dec .dopt .ch{padding:8px 10px!important;margin-bottom:6px!important}
}
@media (max-width:759px) and (max-height:620px){.dec .dtop,.dec .dfig{display:none!important}}
/* v4.8 みんなと比べる */
.mn-end{margin:6px auto 2px;font-size:14px;color:#e8dcc0}.mn-end b{color:#f3c86a;font-size:17px}
.mn-rare{display:inline-block;margin-left:4px;padding:1px 8px;border:1px solid #c9a24a;border-radius:10px;color:#f3c86a;font-size:12px}
.mn-rank{margin:6px 0;font-size:14px}.mn-rank b{color:#f3c86a}
.mn-y{margin:0 0 12px}.mn-y b{color:#f3c86a}
.mn-tmr{margin:14px 0;text-align:left}.mn-tmr ul{margin:6px 0 8px;padding-left:1.2em}.mn-tmr li{margin:4px 0}.mn-tmr li small{display:block;color:#a99;font-size:12px}
.mn-sk{color:#f3c86a;font-size:12px;border:1px solid #c9a24a;border-radius:10px;padding:0 7px;margin-left:4px}
/* v5.0 一年の戦 */
.ic-prep{list-style:none;margin:8px 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;font-size:13px;text-align:left}
.ic-prep li{display:flex;justify-content:space-between;gap:6px;border-bottom:1px dotted #5a4a30;padding:2px 0}.ic-prep li b{font-weight:600;color:#cdbb92}
.ic-prep li.up span{color:#f3c86a}.ic-prep li.dn span{color:#e07a6a}
.ic-odds{margin:8px 0 2px;font-size:15px}.ic-odds b{color:#f3c86a}
.ic-pd{margin-top:8px;font-size:13px}.ic-pd summary{cursor:pointer;color:#cdbb92}
.ic-clear{font-size:clamp(34px,8vw,56px);color:#f3c86a;margin:4px 0;text-shadow:0 0 18px rgba(243,200,106,.5)}
.ic-why{text-align:left;margin:12px 0}.ic-why li{margin:6px 0}.ic-why small{display:block;color:#bba}
@media (max-width:480px){.ic-prep{grid-template-columns:1fr}}
/* v5.1 スマホのFV：上の小さな2行（番外編・天正十年六月二日）は見づらいので出さない（辻村さんFB 11/12） */
@media (max-width:700px){ .hv-t > .lbl, .hv-t h1 > .s{display:none} }

/* v5.2（11/14 辻村さんFB）合戦の上の段が切れて見づらい／陣形の図／決断の結果の札／はじめの数秒 */
.dec.war .dfig{max-height:none!important;overflow:visible!important}
.dec.war .dfig svg.fujin{height:auto!important;max-height:30vh!important;width:100%}
.dec.war .fjLeg{font-size:13px;line-height:1.4}
.dec.war .vsbig .mid .kei{white-space:nowrap}
.ch.has-jin{display:grid!important;grid-template-columns:70px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center}
.ch.has-jin .jinIc{grid-row:1/3;width:70px;height:40px;background:#14110d;border:1px solid #3a3226;border-radius:3px}
.ch.has-jin .otag{display:none}
.rcard{position:fixed;left:50%;top:calc(8px + env(safe-area-inset-top));transform:translateX(-50%);z-index:90;width:min(560px,calc(100% - 24px));display:flex;gap:12px;align-items:center;padding:12px 14px;background:#191510;border:2px solid #6b5a48;border-radius:4px;box-shadow:0 10px 30px rgba(0,0,0,.6);animation:rcIn .35s cubic-bezier(.3,1.4,.5,1) both;cursor:pointer}
.rcard.good{border-color:#5fa36a}.rcard.bad{border-color:#c0392b}.rcard.gold{border-color:#e0b850;box-shadow:0 0 0 3px rgba(224,184,80,.25),0 10px 30px rgba(0,0,0,.6)}
.rcard.out{opacity:0;transform:translate(-50%,-12px);transition:.3s}
.rc-st{flex:0 0 auto;min-width:64px;text-align:center;padding:6px 8px;font-size:18px;font-weight:800;color:#fff;background:#4a4136;border-radius:3px;transform:rotate(-4deg)}
.rcard.good .rc-st{background:#3f7d4a}.rcard.bad .rc-st{background:#a8321f}.rcard.gold .rc-st{background:#b8862b;font-size:15px}
.rc-b b{display:block;font-size:15px;color:var(--gold2,#e8cf8a);line-height:1.35}.rc-b p{margin:3px 0 0;font-size:14px;line-height:1.5}
.rc-ch span{display:inline-block;margin:2px 6px 0 0;padding:0 6px;font-size:12px;border-radius:2px;background:#2a2620}
.rc-ch .up{color:#9fe0a6;background:rgba(95,163,106,.18)}.rc-ch .dn{color:#ffb4a6;background:rgba(192,57,43,.18)}
@keyframes rcIn{from{opacity:0;transform:translate(-50%,-24px) scale(.96)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
.coach{position:fixed;left:50%;top:38%;transform:translateX(-50%);z-index:80;width:min(520px,calc(100% - 24px));padding:14px 16px;background:#191510;border:2px solid #c9a452;border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.55);animation:coachIn .5s both}
.coach b{color:#e8cf8a}.coach p{margin:0 0 6px;font-size:14px;line-height:1.5}
.coach .cbar{height:6px;background:#3a3226;border-radius:3px;overflow:hidden}.coach .cbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b8862b,#ffd77a);animation:cbar var(--d,6s) linear forwards}
@keyframes cbar{to{width:100%}}@keyframes coachIn{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}
.tickPulse{animation:tickP .9s ease}@keyframes tickP{0%{box-shadow:0 0 0 0 rgba(255,140,90,.8);transform:scale(1.08)}100%{box-shadow:0 0 0 14px rgba(255,140,90,0);transform:scale(1)}}
.flowBar{height:3px;background:#2a2620;overflow:hidden;margin:4px 0 0}.flowBar i{display:block;height:100%;width:0;background:#c9a452}
.flowBar.run i{animation:cbar var(--d,4s) linear forwards}
.map .lnk{fill:none;stroke-width:3;stroke-linecap:round;opacity:.9}.map .lnk.ally{stroke:#7fd18b;stroke-dasharray:7 5}.map .lnk.war{stroke:#ff6a55;stroke-dasharray:2 5;stroke-width:3.5}
.map .arwT{font-size:13px;font-weight:800;fill:#fff;paint-order:stroke;stroke:#000;stroke-width:3px}
.mapLeg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--sub,#b9ab90);margin:4px 2px 0}.mapLeg i{display:inline-block;width:18px;height:0;border-top:3px solid;vertical-align:middle;margin-right:4px}
.mapLeg .a i{border-color:#e9d38a}.mapLeg .l i{border-color:#7fd18b;border-top-style:dashed}.mapLeg .w i{border-color:#ff6a55;border-top-style:dotted}

/* v5.2 FVの一行を歴史IFに（11/14） */
@media (max-width:700px){.hv-q{font-size:21px!important;line-height:1.55!important}.hv-q b{font-size:inherit!important}}

/* 11/14 進行中の表示（固まって見えないように） */
.flowRow{display:flex;align-items:center;gap:8px;margin:6px 0 0}
.flowSt{font-size:12px;color:#e6c878;white-space:nowrap;display:flex;align-items:center;gap:6px;letter-spacing:.04em}
.flowDot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e0523a;box-shadow:0 0 8px #e0523a;animation:fdot 1s ease-in-out infinite}
@keyframes fdot{50%{opacity:.2;transform:scale(.7)}}
.flowRow .flowBar{flex:1;height:8px;margin:0;border-radius:4px;background:#2a2620;position:relative}
.flowRow .flowBar i{background:linear-gradient(90deg,#8a6a2a,#e6c878);border-radius:4px;position:relative}
.flowRow .flowBar::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);background-size:40% 100%;background-repeat:no-repeat;animation:fshim 1.4s linear infinite}
@keyframes fshim{from{background-position:-40% 0}to{background-position:140% 0}}
.flowRow.pause .flowDot{animation:none;background:#777;box-shadow:none}.flowRow.pause .flowBar::after{animation:none;display:none}.flowRow.pause .flowBar i{animation-play-state:paused}
.flowRow.wait .flowDot{background:#e6c878;box-shadow:0 0 8px #e6c878;animation:fdot 1.6s ease-in-out infinite}.flowRow.wait .flowSt{color:#fff}