/* 共鳴の庭 試作0.3 ─ 見た目のルールは docs/AIっぽさ対策.md */
:root{
  --ink:#2a1f16;--paper:#efe3c4;--card:#fffaf0;--shade:#e2d2ab;
  --red:#d9482b;--teal:#1f6f68;--gold:#f0b429;--sky:#3d8bd4;--leaf:#4f9a3c;--plum:#8a4fa0;
  --hp:#d9482b;--atk:#e8862a;--def:#4f7f3a;--spd:#3d8bd4;--hit:#8a4fa0;--spi:#c9a227;
  --line:3px solid var(--ink);--drop:0 4px 0 var(--ink);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);background-color:var(--paper);background-image:radial-gradient(#6b4f2a14 1px,transparent 1.2px);background-size:7px 7px;font:500 14px/1.6 "BIZ UDPGothic","Hiragino Kaku Gothic ProN","Yu Gothic UI","Meiryo",sans-serif}
h1,h2,h3,p{margin:0}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:default}
/* 2026-10-26 ユーザー：ちょいちょい赤い点線が出る → キーボードの選択の印。ゲームの画面では出さない */
button:focus,button:focus-visible{outline:none}
button{-webkit-appearance:none;appearance:none}
[hidden]{display:none!important}
small{font-size:11px}
.mon-img{width:100%;height:100%;object-fit:contain;display:block}
.silhouette{filter:brightness(0) opacity(.28)}

/* ---- ボタン：押すと沈む ---- */
.btn,.gchoice{border:var(--line);background:var(--card);box-shadow:var(--drop);font-weight:800;padding:10px 16px;border-radius:0;transition:transform .05s,box-shadow .05s}
.btn:active:not(:disabled),.gchoice:active:not(:disabled),.pick:active:not(:disabled),.train:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 0 var(--ink)}
.btn:disabled{opacity:.45;box-shadow:none;transform:translateY(4px)}
.btn.primary{background:var(--red);color:#fff;text-shadow:0 2px 0 #0004}
.btn.big{font-size:18px;padding:14px 28px;font-weight:900}
.btn.small{padding:5px 10px;font-size:12px;box-shadow:0 3px 0 var(--ink)}
.btn small{display:block;font-weight:500;font-size:11px;opacity:.8}

/* ---- 帯見出し ---- */
.band{display:block;width:fit-content;max-width:100%;margin:22px 0 10px;padding:5px 30px 5px 14px;background:var(--teal);color:#fff;font-weight:900;font-size:16px;letter-spacing:.04em;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,0 100%)}
.band-red{background:var(--red)}.band-gold{background:var(--gold);color:var(--ink)}
.band-sub{font-weight:500;font-size:12px;margin-left:10px;opacity:.9}

/* ---- ヘッダー ---- */
.hud{background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 20px;border-bottom:4px solid var(--gold)}
.logo b{font-size:24px;font-weight:900;color:var(--gold);letter-spacing:.08em;-webkit-text-stroke:5px var(--ink);paint-order:stroke fill}
.logo small{margin-left:8px;color:#bfae8c}
.nav{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.navbtn{background:#3d2f22;color:#fff;border:2px solid #7a6446;padding:6px 10px;font-size:12px;font-weight:700;border-radius:0}
.navbtn:active{transform:translateY(2px)}
.gacha-btn{background:var(--red);border-color:#fff3}
.stone{margin-left:6px;background:#0004;padding:0 6px;font-variant-numeric:tabular-nums}
main{max-width:1280px;margin:auto;padding:14px 18px 50px}
footer{margin-top:40px;font-size:11px;color:#8a7657;text-align:center}
.warning{background:var(--gold);padding:8px;text-align:center;font-weight:700}

/* ---- タイトル・編成 ---- */
.title-card{position:relative;border:var(--line);box-shadow:6px 6px 0 var(--ink);overflow:hidden;height:250px;background:#8fcbe3}
.title-art .scene-bg{position:absolute;inset:0;width:100%;height:100%}
.title-mon{position:absolute;right:12%;bottom:6px;width:210px;height:210px;animation:hop 2.6s ease-in-out infinite}
.title-copy{position:absolute;left:24px;top:24px;right:40%}
.title-copy h1{font-size:54px;font-weight:900;color:var(--gold);letter-spacing:.06em;-webkit-text-stroke:10px var(--ink);paint-order:stroke fill;line-height:1.1}
.title-copy p{margin-top:12px;background:var(--card);border:var(--line);padding:8px 12px;font-weight:700;display:inline-block;max-width:430px}
.resume{display:grid;grid-template-columns:110px 1fr auto;gap:14px;align-items:center;background:#fff1c9;border:var(--line);box-shadow:6px 6px 0 var(--ink);padding:12px 16px;margin-bottom:18px}
.resume-face{width:110px;height:110px}
.resume .band{margin:0 0 6px}
.resume p{font-size:15px;margin-bottom:6px}
.actors{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.supports{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pick{position:relative;display:flex;align-items:center;gap:12px;text-align:left;background:var(--card);border:var(--line);box-shadow:4px 4px 0 var(--ink);padding:10px 12px;border-radius:0}
.pick svg,.pick .mon-img{width:70px;height:70px;flex-shrink:0}
.support svg,.support .mon-img{width:54px;height:54px}
.pick-body b{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:17px;font-weight:900}
.pick-body small{display:block;color:#6d5a40;line-height:1.5}
.pick.on{background:#fff1c9}
.pick:disabled{opacity:.5}
.pick.locked{background:repeating-linear-gradient(45deg,#e9dbb8 0 8px,#e2d2ab 8px 16px);box-shadow:none;color:#8a7657}
.hanko{position:absolute;top:-10px;right:8px;border:3px solid var(--red);color:var(--red);background:#fffaf0;font-weight:900;font-size:13px;padding:0 6px;transform:rotate(-10deg)}
.dupe{color:var(--gold);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;font-size:14px;letter-spacing:-.05em}
.spec{font-size:11px;font-weight:800;color:#fff;padding:0 5px;border:2px solid var(--ink)}
.spec-0{background:var(--atk)}.spec-1{background:var(--hit)}.spec-2{background:var(--hp)}.spec-3{background:var(--spd)}.spec-4{background:var(--def)}.spec-5{background:var(--spi)}
.start-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding-top:16px;border-top:3px dashed #b39b6e}
.start-row p{font-size:12px;color:#6d5a40}

/* ---- ガチャ ---- */
.gacha{background:var(--card);border:var(--line);box-shadow:6px 6px 0 var(--ink);padding:18px}
.gacha-stone{font-size:18px;font-weight:900}.gacha-stone b{font-size:30px;color:var(--red);margin-left:6px}
.gacha-rates{font-size:12px;color:#6d5a40;margin:4px 0 14px}
.gacha-buttons{display:flex;gap:14px;flex-wrap:wrap}
.gacha-result{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:20px 0}
.gcard{position:relative;border:var(--line);background:#fff;text-align:center;padding:8px 4px;animation:pop .35s backwards var(--d)}
.gcard svg,.gcard .mon-img{width:80px;height:80px}
.gcard b{display:block;font-weight:900}
.gcard small{color:#6d5a40}
.gcard.rare{background:repeating-linear-gradient(-45deg,#ffe9a8 0 10px,#ffd76a 10px 20px)}
.new-tag{position:absolute;top:-10px;left:-6px;background:var(--red);color:#fff;font-weight:900;font-size:12px;padding:0 6px;border:2px solid var(--ink)}
.owned-list p{font-size:13px;margin:4px 0}

/* ---- 育成画面 ---- */
.topbar{display:flex;align-items:center;gap:14px;background:var(--ink);color:#fff;padding:8px 12px;margin-bottom:10px}
.daycount{background:#fff;color:var(--ink);border-top:8px solid var(--red);padding:2px 10px;text-align:center;line-height:1}
.daycount b{display:block;font-size:30px;font-weight:900}
.daycount span{font-size:11px;font-weight:700}
.phase{font-size:20px;font-weight:900}
.phase small{display:block;font-size:12px;color:var(--gold);font-weight:700}
.topbar-actions{margin-left:auto;display:flex;gap:8px}
.topbar .btn.small{background:#3d2f22;color:#fff;border-color:#7a6446;box-shadow:0 3px 0 #000}
.alert{border:var(--line);background:var(--card);padding:6px 12px;margin-bottom:8px;font-size:13px}
.alert b{background:var(--ink);color:#fff;padding:0 6px;margin-right:6px}
.alert-fight{background:#ffd9cc}.alert-fight b{background:var(--red)}
.alert-hot{background:#fff0b0;animation:blink 1.2s steps(2) infinite}
.play{display:grid;grid-template-columns:270px minmax(0,1fr) 230px;gap:14px;align-items:start}
.status,.team{background:var(--card);border:var(--line);box-shadow:5px 5px 0 var(--ink);padding:12px}
.status-top{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.portrait{width:96px;height:96px;flex-shrink:0;background:#d8ecd0;border:var(--line)}
.portrait svg{width:100%;height:100%}
.status-id{flex:1;min-width:0}
.mon-name{font-size:22px;font-weight:900;display:block}
.energy{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:800;margin:4px 0}
.energy .gauge{flex:1}
.energy>b{font-size:16px;min-width:28px;text-align:right}
.gauge{height:14px;border:2px solid var(--ink);background:#3a2c20;overflow:hidden}
.gauge>i{display:block;height:100%;background:linear-gradient(#8fd06f,#4f9a3c);transition:width .4s}
.gauge.low>i,.gauge>i.low{background:linear-gradient(#f28b6b,#d9482b)}
.retry{font-size:11px;font-weight:700;display:flex;align-items:center;gap:3px}
.retry i{width:12px;height:12px;border:2px solid var(--ink);background:#fff;transform:rotate(45deg);margin-left:3px}
.retry i.on{background:var(--gold)}
.statboard{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.st{position:relative;background:#fff;border:2px solid var(--ink);border-left-width:7px;padding:2px 6px;line-height:1.25}
.st-name{display:block;font-size:10px;font-weight:800;color:#6d5a40}
.st b{font-size:20px;font-weight:900;font-variant-numeric:tabular-nums}
.st em{position:absolute;right:3px;top:1px;font-style:normal;font-size:10px;font-weight:900;color:var(--leaf)}
.st-hp{border-left-color:var(--hp)}.st-atk{border-left-color:var(--atk)}.st-def{border-left-color:var(--def)}.st-spd{border-left-color:var(--spd)}.st-hit{border-left-color:var(--hit)}.st-spi{border-left-color:var(--spi)}
.skills-owned{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:10px 0 8px;font-size:12px}
.skills-owned span{font-weight:900;margin-right:2px}
.skills-owned i{font-style:normal;font-weight:800;background:var(--ink);color:#fff;padding:1px 6px}
.skills-owned i.empty{background:none;color:#a8916a;border:2px dashed #b39b6e}
.skills-owned sup{color:var(--gold)}
.days{display:flex;gap:2px}
.days i{flex:1;height:8px;background:#e2d2ab}
.days i.done{background:var(--teal)}
.days i.now{background:var(--gold);outline:2px solid var(--ink)}
.days i.fight{background:#f3b5a5;margin-right:5px}
.days i.fight.done{background:var(--red)}
.trainings{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.train{position:relative;display:flex;flex-direction:column;gap:6px;text-align:left;min-height:150px;background:var(--card);border:var(--line);box-shadow:0 5px 0 var(--ink);padding:12px 10px 8px;border-radius:0;overflow:visible}
.train::before{content:'';position:absolute;left:0;right:0;top:0;height:7px;background:var(--c)}
.train.st-hp{--c:var(--hp)}.train.st-atk{--c:var(--atk)}.train.st-def{--c:var(--def)}.train.st-spd{--c:var(--spd)}.train.st-hit{--c:var(--hit)}.train.st-spi{--c:var(--spi)}
.train-name{font-size:20px;font-weight:900}
.train-flag{position:absolute;top:-12px;right:-6px;background:var(--gold);border:3px solid var(--ink);font-weight:900;font-size:13px;padding:0 8px;transform:rotate(6deg)}
.train.boost{background:#fff4cc}
.train.reso{background:repeating-linear-gradient(-45deg,#fff1b5 0 12px,#ffe58a 12px 24px)}
.train.reso .train-flag{background:var(--red);color:#fff;animation:wob .6s ease-in-out infinite alternate}
.train-mates{display:flex;min-height:36px;align-items:center}
.face{position:relative;width:36px;height:36px;border:2px solid var(--ink);border-radius:50%;background:#d8ecd0;margin-right:-4px;overflow:visible}
.face svg,.face .mon-img{width:100%;height:100%;border-radius:50%}
.face.lit{background:var(--gold);box-shadow:0 0 0 3px var(--red)}
.face u{position:absolute;top:-8px;left:-6px;width:16px;height:16px;background:var(--red);color:#fff;border:2px solid var(--ink);font-size:11px;font-weight:900;text-decoration:none;display:flex;align-items:center;justify-content:center;animation:wob .5s ease-in-out infinite alternate}
.alone{font-size:12px;color:#a8916a;font-weight:700}
.train-gain{display:flex;flex-wrap:wrap;gap:3px}
.g{font-size:11px;font-weight:800;color:#fff;padding:0 4px;background:var(--c)}
.g b{font-size:15px;margin-left:1px}
.g-hp{--c:var(--hp)}.g-atk{--c:var(--atk)}.g-def{--c:var(--def)}.g-spd{--c:var(--spd)}.g-hit{--c:var(--hit)}.g-spi{--c:var(--spi)}
.train-cost{margin-top:auto;font-size:11px;font-weight:700;color:#6d5a40;border-top:2px dotted #c7b48c;padding-top:4px}
.train-cost em{font-style:normal;color:#fff;background:var(--red);padding:0 4px;margin-left:6px}
.sub-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.sub-actions .btn{text-align:left;font-size:16px}
.result{margin-top:12px;background:#fff;border:var(--line);border-left:10px solid var(--leaf);padding:8px 12px;display:flex;flex-direction:column;animation:pop .25s}
.result.bad{border-left-color:#8a7657}
.result b{font-size:15px;font-weight:900}
.result span{font-size:13px}
.logbox{margin-top:14px;font-size:12px}
.logbox summary{cursor:pointer;font-weight:700}
.log{max-height:220px;overflow:auto;background:#fff;border:2px solid var(--ink);padding:8px;margin-top:6px;font-size:11px;line-height:1.9}
.team .band{margin-top:0}
.mate{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:2px dotted #c7b48c}
.mate:last-child{border:0}
.mate-face{width:40px;height:40px;border:2px solid var(--ink);border-radius:50%;background:#d8ecd0;flex-shrink:0;overflow:hidden}
.mate.hot .mate-face{background:var(--gold)}
.mate-body{flex:1;min-width:0}
.mate-body b{font-size:13px;font-weight:900}
.pips{display:inline-flex;gap:2px;vertical-align:middle;margin-left:3px}
.pips i{width:8px;height:8px;border:2px solid var(--ink);background:#fff;transform:rotate(45deg)}
.pips i.on{background:var(--plum)}
.bond{position:relative;height:14px;border:2px solid var(--ink);background:#fff;margin:2px 0}
.bond i{display:block;height:100%;background:#e8a2b8}
.mate.hot .bond i{background:var(--red)}
.bond span{position:absolute;right:3px;top:-3px;font-size:10px;font-weight:900}
.mate-body small{display:block;font-size:10px;color:#8a7657;line-height:1.3}
small.ready,.ready{color:var(--red)!important;font-weight:900}

/* ---- 完成 ---- */
.finish{max-width:760px;margin:10px auto;background:var(--card);border:var(--line);box-shadow:8px 8px 0 var(--ink);padding:18px}
.finish .band{margin-top:0}
.finish-body{display:grid;grid-template-columns:230px 1fr;gap:18px;align-items:center}
.finish-art{position:relative;height:230px;background:#d8ecd0;border:var(--line)}
.finish-art svg,.finish-art .mon-img{width:100%;height:100%}
.rank{position:absolute;right:-14px;bottom:-14px;width:78px;height:78px;display:grid;place-items:center;font-size:50px;font-weight:900;color:#fff;border:4px solid var(--ink);transform:rotate(-8deg);-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;animation:stamp .4s .2s backwards}
.rank-S,.rank-mini.rank-S{background:var(--gold)}.rank-A,.rank-mini.rank-A{background:var(--red)}.rank-B,.rank-mini.rank-B{background:var(--sky)}.rank-C,.rank-mini.rank-C{background:var(--leaf)}.rank-D,.rank-E,.rank-mini.rank-D,.rank-mini.rank-E{background:#8a7657}
.finish-data small{color:#6d5a40}
.finish-data .statboard{margin:8px 0}
.battle-marks{display:flex;flex-wrap:wrap;gap:4px}
.battle-marks span{font-size:12px;font-weight:800;padding:1px 6px;border:2px solid var(--ink);background:#d6efd0}
.battle-marks span.lose{background:#ffd9cc}
.finish-skills{margin-top:8px;font-weight:700}
.finish-reward{margin-top:8px;font-weight:900;color:var(--red);font-size:16px}
.finish-actions{display:flex;justify-content:space-between;gap:12px;margin-top:18px;flex-wrap:wrap}

/* ---- モーダル ---- */
.overlay{position:fixed;inset:0;background:#140e08b8;display:flex;align-items:center;justify-content:center;padding:16px;z-index:20}
.modal{position:relative;width:100%;max-width:640px;max-height:92vh;overflow:auto;background:var(--card);border:4px solid var(--ink);box-shadow:8px 8px 0 #000a;padding:18px;animation:pop .2s}
.modal.wide{max-width:900px}
.modal .band{margin-top:0}
.modal .close{position:absolute;top:8px;right:8px;width:34px;height:34px;border:var(--line);background:#fff;font-size:20px;font-weight:900;line-height:1;z-index:2}
.modal-lead{margin:4px 0 12px;font-weight:700}
.modal-stack{display:flex;flex-direction:column;gap:2px}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px;flex-wrap:wrap}
.rule{margin-top:12px;font-size:13px}.rule b{color:var(--red)}
.help p{margin:0 0 10px;line-height:1.8}.help b{background:var(--ink);color:#fff;padding:0 6px;margin-right:4px}
.record{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:2px dotted #c7b48c}
.record svg,.record .mon-img{width:56px;height:56px;flex-shrink:0}
.record-body{flex:1;min-width:0}
.record-body small{display:block;color:#6d5a40;font-size:11px}
.rank-mini{display:inline-block;color:#fff;border:2px solid var(--ink);padding:0 5px;font-size:12px}
.empty{padding:30px;text-align:center;color:#8a7657}
.guide-list{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px}
.guide-list .gchoice{display:flex;gap:8px;align-items:center}
.gl-face{width:44px;height:44px;border:2px solid var(--ink);border-radius:50%;background:#d8ecd0;flex-shrink:0;overflow:hidden}
.gl-face svg{width:100%;height:100%}
.gchoice{display:flex;align-items:center;gap:10px;width:100%;text-align:left;margin-top:8px;padding:9px 12px}
.gchoice b{display:block;font-size:15px;font-weight:900}
.gchoice small{display:block;font-weight:500;color:#6d5a40;line-height:1.5}
.gchoice.danger{background:#ffe3dc}
.gc-key{width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;background:var(--ink);color:var(--gold);font-weight:900;font-size:17px}
.gc-body{flex:1;min-width:0}
.gc-risk{font-style:normal;font-size:11px;background:var(--red);color:#fff;padding:0 5px;margin-left:6px;vertical-align:middle}

/* ---- イベント場面（ADV形式） ---- */
.modal.scene-modal{padding:0;max-width:760px}
.scene-art{position:relative;height:250px;overflow:hidden;border-bottom:4px solid var(--ink)}
.scene-bg{position:absolute;inset:0;width:100%;height:100%;display:block}
.scene-cast{position:absolute;left:0;right:0;bottom:4px;display:flex;justify-content:center;align-items:flex-end;gap:4px}
.cast{width:92px;height:92px;animation:castIn .35s backwards calc(var(--i)*.07s)}
.cast.main{width:170px;height:170px}
.cast svg,.cast .mon-img{width:100%;height:100%}
.scene-plate{position:absolute;left:0;top:12px;background:var(--ink);color:#fff;font-weight:900;padding:4px 16px 4px 12px;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.scene-window{position:relative;background:#1d2635;color:#fff;padding:18px 20px 16px;border-bottom:4px solid var(--ink)}
.scene-window h2{font-size:20px;font-weight:900;color:var(--gold);margin-bottom:4px}
.scene-window p{font-size:15px;line-height:1.8}
.scene-speaker{position:absolute;top:-19px;left:16px;background:var(--red);color:#fff;border:3px solid var(--ink);font-weight:900;padding:1px 14px}
.scene-choices{padding:6px 16px 18px;background:var(--card)}

/* ---- バトル ---- */
.versus{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center}
.fighter{background:#fff;border:var(--line);padding:10px;text-align:center}
.fighter.enemy{background:#ffe9e1}
.fighter svg,.fighter .mon-img{width:96px;height:96px}
.fighter.enemy svg,.fighter.enemy .mon-img{transform:scaleX(-1)}
.fighter>b{display:block;font-size:17px;font-weight:900;margin-bottom:6px}
.fighter>small{display:block;margin-top:6px;font-weight:700}
.fighter .statboard{text-align:left}
.vs{font-size:34px;font-weight:900;color:var(--red);-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;font-style:italic}
.arena{position:relative;height:230px;border:var(--line);overflow:hidden}
.arena .scene-bg{position:absolute;inset:0;width:100%;height:100%}
.arena-side{position:absolute;bottom:8px;left:4%;width:42%;display:flex;flex-direction:column;align-items:center}
.arena-side.enemy{left:auto;right:4%}
.arena-mon{width:140px;height:140px}
.arena-mon svg,.arena-mon .mon-img{width:100%;height:100%}
.arena-side.enemy .arena-mon{transform:scaleX(-1)}
.arena-side.hit .arena-mon{animation:shake .3s}
.hpbar{width:100%;background:var(--card);border:var(--line);padding:3px 6px}
.hpbar b{font-size:12px;font-weight:900}
.hpbar small{font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}
.battle-log{list-style:none;margin:10px 0 0;padding:6px 10px;height:150px;overflow:auto;background:#1d2635;color:#fff;border:var(--line);font-size:13px;line-height:1.9}
.battle-log li.e{color:#ffb4a0}
.battle-log li.skill{font-weight:900;color:var(--gold)}
.battle-log li.latest::before{content:'▶ ';color:var(--gold)}
.outcome{margin-top:10px;border:var(--line);padding:8px 12px;background:#d6efd0;animation:pop .3s}
.outcome.lose{background:#ffd9cc}
.outcome b{display:block;font-size:24px;font-weight:900}
.outcome span{font-size:13px;font-weight:700}

@keyframes pop{from{transform:scale(.85);opacity:0}70%{transform:scale(1.04)}to{transform:scale(1);opacity:1}}
@keyframes hop{0%,100%{transform:translateY(0)}45%{transform:translateY(-12px)}55%{transform:translateY(-12px)}}
@keyframes wob{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
@keyframes blink{50%{background:#ffe07a}}
@keyframes castIn{from{transform:translateY(40px);opacity:0}}
@keyframes stamp{from{transform:rotate(-8deg) scale(2.2);opacity:0}}
@keyframes shake{25%{transform:translateX(-8px)}50%{transform:translateX(7px)}75%{transform:translateX(-4px)}}

/* ---- 画面幅 ---- */
@media(max-width:1100px){.play{grid-template-columns:250px minmax(0,1fr)}.team{grid-column:1/-1}.team{display:grid;grid-template-columns:repeat(3,1fr);gap:0 12px}.team .band{grid-column:1/-1}.supports{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
  main{padding:10px 10px 40px}
  .hud{padding:6px 10px}.logo b{font-size:19px}.logo small{display:none}.navbtn{padding:5px 7px;font-size:11px}
  .title-card{height:230px}.title-copy{right:16px;left:14px;top:14px}.title-copy h1{font-size:40px}.title-copy p{font-size:12px;padding:6px 8px}.title-mon{width:130px;height:130px;right:4%}
  .resume{grid-template-columns:70px 1fr}.resume-face{width:70px;height:70px}.resume .btn{grid-column:1/-1}
  .actors,.supports{grid-template-columns:1fr}
  .pick svg,.pick .mon-img{width:52px;height:52px}
  .start-row{flex-direction:column;align-items:stretch}
  .play{grid-template-columns:1fr;gap:10px}
  .status{padding:8px}.status-top{margin-bottom:6px}.portrait{width:64px;height:64px}.mon-name{font-size:18px}
  .st b{font-size:17px}
  .trainings{grid-template-columns:repeat(3,1fr);gap:6px}
  .train{min-height:128px;padding:10px 5px 6px;gap:4px}.train-name{font-size:15px}.face{width:26px;height:26px}.train-mates{min-height:28px}.g{font-size:10px}.g b{font-size:12px}.train-flag{font-size:11px;padding:0 4px}
  .sub-actions .btn{font-size:14px;padding:8px 10px}
  .team{grid-template-columns:1fr 1fr}
  .topbar{gap:8px;padding:6px 8px}.daycount b{font-size:24px}.phase{font-size:16px}
  .finish-body{grid-template-columns:1fr}.finish-art{height:200px}
  .modal{padding:12px}.guide-list{grid-template-columns:1fr}
  .scene-art{height:200px}.cast{width:64px;height:64px}.cast.main{width:130px;height:130px}.scene-window p{font-size:14px}
  .versus{grid-template-columns:1fr}.vs{text-align:center;font-size:26px}
  .arena{height:190px}.arena-mon{width:96px;height:96px}
  .gacha-result{grid-template-columns:repeat(3,1fr)}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* ガチャ：レア度の★、所持キャラの★上げ（2026-10-06） */
.rstar{display:block;font-size:14px;letter-spacing:-.05em;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;color:#cfc6b0}
.rstar.r2{color:#9fd3e3}.rstar.r3{color:var(--gold)}.rstar.r4{color:#ff9e5e}.rstar.r5{color:#ff6fa0}
.gcard.r2{background:#e6f3f6}.gcard.r3{background:repeating-linear-gradient(-45deg,#ffe9a8 0 10px,#ffd76a 10px 20px)}
.mats{font-size:14px}.mats b{font-size:20px;color:var(--ink)}
.pity-box{border:var(--line);background:#fff1c4;padding:10px;margin:14px 0}
.pity-box div{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.owned-kind{font-weight:900;margin:10px 0 4px}
.owned-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.owned-card{border:var(--line);background:#fff;padding:6px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.owned-card svg,.owned-card .mon-img{width:56px;height:56px}
.owned-card .rstar{display:inline;margin-right:4px}
.owned-card .max{font-weight:900;color:#6d5a40}
.btn.small{padding:4px 10px;font-size:13px}
.gacha-rates .rstar{display:inline;margin-right:2px}

/* ---- ガチャ画面の並び（2026-10-07 直し） ---- */
.gacha-rates{font-size:13px;line-height:1.8}
.gacha-buttons{justify-content:center;margin:6px 0 4px}
.gacha-buttons .btn{min-width:160px}
.gcard{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px 8px}
.gcard .mon-img,.gcard svg{width:76px;height:76px;margin:0 auto}
.gcard .rstar{display:block}
.gcard small{min-height:1.2em;font-size:11px}
.owned-card .mon-img{margin:0 auto}
@media(max-width:760px){.gacha-result{grid-template-columns:repeat(3,1fr);gap:8px}.gcard .mon-img,.gcard svg{width:64px;height:64px}}

/* ---- ガチャの演出：光の玉が割れて、モンスターが飛び出す ---- */
.g-anim{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:radial-gradient(circle at 50% 55%,#2b2350 0,#120d1f 70%);cursor:pointer;overflow:hidden}
/* 玉の色：★1 青、★2 金、★3 虹（★3は番が来るまで金に見せる）。2026-10-08 ユーザー決定 */
.g-back,.g-orb{--f1:#f0fbff;--f2:#6cb8f0;--f3:#1d4f99;--fg:#c8f0ff}
.g-card.r2 .g-back,.g-card.r3 .g-back,.g-cut.gold .g-orb{--f1:#fffbe0;--f2:#ffc93a;--f3:#a86410;--fg:#fff6c0}
.fruit .rb{opacity:0;transition:opacity .5s}
.g-card.wait .fruit .rb,.g-cut.rainbow .fruit .rb{opacity:1}
.g-card.wait .fruit,.g-cut.rainbow .fruit{animation:gHue 1.2s linear infinite}
@keyframes gHue{to{filter:hue-rotate(360deg)}}
.fruit{width:100%;height:100%;overflow:visible}
.fruit stop{transition:stop-color .5s}
.fruit-vein,.fruit-core{animation:gVein 1.6s ease-in-out infinite alternate}
@keyframes gVein{from{opacity:.35}to{opacity:1}}
.g-orb{width:170px;height:170px;position:relative;filter:drop-shadow(0 0 30px #fff6);animation:gFloat 1.2s ease-in-out infinite alternate;transition:filter .5s}
.g-orb{filter:drop-shadow(0 0 40px #6cc4ffcc)}
.g-cut.gold .g-orb{filter:drop-shadow(0 0 50px #ffcf4d)}
.g-cut.rainbow .g-orb{filter:drop-shadow(0 0 60px #fff)}
.g-orb i{position:absolute;left:50%;top:50%;width:4px;height:0;background:#fff;box-shadow:0 0 8px 3px #fff;transform-origin:top center;transition:height .5s ease-out}
.g-orb i:nth-of-type(1){transform:rotate(20deg)}.g-orb i:nth-of-type(2){transform:rotate(150deg)}.g-orb i:nth-of-type(3){transform:rotate(260deg)}
.g-rays{position:absolute;left:50%;top:50%;margin:-80vmax 0 0 -80vmax;width:160vmax;height:160vmax;opacity:0;background:repeating-conic-gradient(from 0deg,#ffd34d33 0 6deg,transparent 6deg 18deg);transition:opacity .6s;pointer-events:none}
/* 並んだ実 */
.g-grid{grid-area:1/1;display:grid;grid-template-columns:repeat(5,minmax(0,120px));gap:14px 12px;padding:16px}
.g-grid.n1{grid-template-columns:minmax(0,180px)}
.g-card{position:relative;aspect-ratio:3/4;display:grid;place-items:center}
.g-back{position:absolute;left:4%;right:4%;top:10%;bottom:16%;filter:drop-shadow(0 0 10px #c8f0a855);transition:transform .3s ease-out,opacity .3s;animation:gBob 1.6s ease-in-out infinite alternate;animation-delay:calc(var(--k)*-.17s)}
.g-back{filter:drop-shadow(0 0 10px #6cc4ff88)}
.g-card.r2 .g-back,.g-card.r3 .g-back{filter:drop-shadow(0 0 12px #ffcf4daa)}
.g-card.wait .g-back{filter:drop-shadow(0 0 22px #fff);animation:gShake .09s linear infinite}
.g-front{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;opacity:0;pointer-events:none}
.g-front .mon-img,.g-front svg{width:min(100%,110px);height:auto;aspect-ratio:1;filter:drop-shadow(0 4px 0 #0006)}
.g-front b{font-size:13px;font-weight:900;line-height:1.2;color:#fff;-webkit-text-stroke:4px #2a1f16;paint-order:stroke fill}
.g-front .rstar{display:block;font-size:13px}
.g-card.on .g-back{transform:scale(1.35);opacity:0}
.g-card.on .g-front{opacity:1;animation:gHop .45s cubic-bezier(.2,1.5,.4,1)}
.g-card.glow.r2 .g-front .mon-img{filter:drop-shadow(0 0 10px #ffcf4d)}
.g-card.glow.r3 .g-front .mon-img{filter:drop-shadow(0 0 8px #ff5a5a) drop-shadow(0 0 8px #5aa8ff) drop-shadow(0 0 6px #5ae07a)}
.g-card .new-tag{position:absolute;top:0;left:0}
@keyframes gBob{to{transform:translateY(-4px)}}
@keyframes gHop{0%{transform:translateY(30%) scale(.4)}60%{transform:translateY(-12%) scale(1.08)}100%{transform:none}}
/* ★3の演出（全面） */
.g-cut{position:fixed;inset:0;display:none;place-items:center;background:radial-gradient(circle at 50% 55%,#2b2350 0,#120d1f 70%)}
.g-cut.on{display:grid}
.g-cut>.g-orb,.g-cut>.g-reveal{grid-area:1/1}
.g-cut.gold .g-rays{opacity:.5;animation:gSpin 6s linear infinite}
.g-cut.rainbow .g-rays{opacity:.8;background:repeating-conic-gradient(from 0deg,#ff5a5a33 0 6deg,transparent 6deg 12deg,#5ae07a33 12deg 18deg,transparent 18deg 24deg,#5aa8ff33 24deg 30deg,transparent 30deg 36deg)}
.g-cut.shake .g-orb{animation:gShake .09s linear infinite}
.g-cut.crack .g-orb i{height:70px}
.g-cut.burst .g-orb{transform:scale(1.6);opacity:0;transition:transform .25s,opacity .25s}
.g-reveal{display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;transform:scale(.6)}
.g-reveal .mon-img,.g-reveal svg{width:min(56vw,260px);height:min(56vw,260px);filter:drop-shadow(0 0 14px #ff5a5a) drop-shadow(0 0 14px #5aa8ff) drop-shadow(0 0 10px #fff35a)}
.g-reveal .rstar{font-size:34px}
.g-reveal b{font-size:30px;font-weight:900;color:#fff;-webkit-text-stroke:6px #2a1f16;paint-order:stroke fill}
.g-cut.show .g-reveal{opacity:1;transform:scale(1);transition:opacity .4s,transform .5s cubic-bezier(.2,1.6,.4,1)}
.g-flash{position:fixed;inset:0;background:#fff;opacity:0;pointer-events:none;z-index:2}
.g-anim.burst .g-flash{animation:gFlash .5s ease-out}
.g-skip{position:fixed;bottom:16px;left:0;right:0;text-align:center;color:#fffa;font-size:13px;margin:0;z-index:3}
@keyframes gFloat{to{transform:translateY(-10px)}}
@keyframes gShake{0%{transform:translate(0,0)}25%{transform:translate(-4px,2px)}50%{transform:translate(3px,-3px)}75%{transform:translate(-2px,-2px)}100%{transform:translate(4px,3px)}}
@keyframes gSpin{to{transform:rotate(360deg)}}
@keyframes gFlash{0%{opacity:0}20%{opacity:.9}100%{opacity:0}}
@keyframes gPop{0%{transform:scale(.85)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
@media(max-width:760px){.g-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:10px;width:100%}.g-front b{font-size:10px}.g-front .rstar{font-size:10px}}
@media (prefers-reduced-motion: reduce){.g-orb,.g-rays,.g-card.wait .g-back,.g-card.on{animation:none!important}}
/* 玉が1つずつ降ってくる */
.g-card .g-back{opacity:0}
.g-card.drop .g-back{opacity:1;animation:gDrop .45s cubic-bezier(.3,1.4,.5,1) backwards,gBob 1.6s ease-in-out .45s infinite alternate}
.g-card.drop-gold::after{content:"";position:absolute;inset:-10%;border-radius:50%;background:radial-gradient(circle,#fff6 0,#ffcf4d55 40%,transparent 70%);animation:gSpark .6s ease-out forwards;pointer-events:none}
.g-card.on .g-back{animation:none}
@keyframes gDrop{0%{opacity:0;transform:translateY(-120px) scale(.6)}60%{opacity:1;transform:translateY(8px) scale(1.05)}100%{transform:none}}
@keyframes gSpark{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.4)}}
.g-card.drop.wait .g-back{animation:gShake .09s linear infinite}
/* 修行の解放前（序章2話を読むまで）と、修行のチュートリアル（2026-10-08） */
.mode.locked{filter:grayscale(.85);opacity:.8}
.mode.locked small{font-weight:700}
.tuto p{font-size:15px;line-height:1.8;font-weight:700;margin:14px 6px}
/* 指さしチュートリアル（コーチマーク）2026-10-09 */
.coach{position:fixed;inset:0;z-index:300;pointer-events:none}
.coach i{position:fixed;background:rgba(20,14,8,.66);pointer-events:auto}
.coach.tap{pointer-events:auto;cursor:pointer}
.coach-hole{position:fixed;border:3px solid #ffd84a;box-shadow:0 0 0 3px var(--ink),0 0 18px #ffd84a;pointer-events:none;animation:coachBlink 1.2s infinite}
@keyframes coachBlink{50%{box-shadow:0 0 0 3px var(--ink),0 0 4px #ffd84a}}
.coach-say{position:fixed;width:300px;background:#fffaf0;color:var(--ink);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:10px 12px;font-weight:700;font-size:14px;line-height:1.6;pointer-events:none}
.coach-say p{margin:0;white-space:pre-line}
.coach-say small{display:block;text-align:right;color:#8a6a3a;margin-top:4px}
.coach-finger{position:fixed;transform:translateX(-50%);color:#ffd84a;font-size:26px;text-shadow:0 0 0 #000,2px 2px 0 var(--ink);pointer-events:none;animation:coachBob .7s infinite alternate}
@keyframes coachBob{to{translate:0 6px}}
@media (prefers-reduced-motion: reduce){.coach-hole,.coach-finger{animation:none}}
/* ホーム＝赤の国の地図（2026-10-09）。行き先は地図の上の木札 */
.home-map{display:flex;flex-direction:column;gap:12px}
.map-wrap{position:relative;max-width:560px;margin:0 auto;width:100%;border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink)}
.map-img{display:block;width:100%;height:auto}
.map-spot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 12px 6px;background:#c8442b;color:#fff8e6;border:3px solid #2a1f16;border-radius:4px;box-shadow:0 4px 0 #2a1f16;font-weight:900;cursor:pointer;white-space:nowrap}
.map-spot b{font-size:15px;letter-spacing:.04em;text-shadow:1px 1px 0 #2a1f16}
.map-spot small{font-size:11px;background:#fff8e6;color:#2a1f16;padding:0 6px;border-radius:2px}
.map-spot:active{transform:translate(-50%,-46%);box-shadow:0 2px 0 #2a1f16}
.map-spot.locked{background:#6b5d50;filter:grayscale(.4)}
.map-badge{position:absolute;right:-9px;top:-9px;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#ffd36a,#e8502a 60%,#a8261a);border:2px solid #2a1f16}
/* ===== 赤の国の部品（チャッピー作 2026-10-09）。ボタン＝木札、窓＝溶岩の岩としめ縄の枠、印＝炎の玉 ===== */
.map-spot{background:none;border:0;border-radius:0;box-shadow:none;border-style:solid;border-width:10px 26px 12px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/10px 26px 12px stretch;padding:2px 2px 4px;filter:drop-shadow(0 3px 0 #2a1f16)}
.map-spot.locked{border-image-source:url(art/ui/btn_wood.png);color:#5a4a3a}
.map-spot.locked b{text-shadow:none}
.map-badge{width:24px;height:30px;right:-18px;top:-20px;border:0;border-radius:0;background:url(art/ui/flame.png) center/contain no-repeat}
.btn.primary{background:none;border:0;border-style:solid;border-width:9px 24px 11px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/9px 24px 11px stretch;box-shadow:none;filter:drop-shadow(0 3px 0 #2a1f16)}
.btn:not(.primary):not(.small){background:none;border:0;border-style:solid;border-width:8px 22px 10px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/8px 22px 10px stretch;box-shadow:none;color:#2a1f16;filter:drop-shadow(0 3px 0 #2a1f16)}
.modal{border:0;border-style:solid;border-width:34px 28px 30px;border-image:url(art/ui/frame.png) 130 110 110 fill/34px 28px 30px stretch;background:none;box-shadow:none;filter:drop-shadow(6px 6px 0 #000a);padding:8px 10px}
.modal .close{top:6px;right:6px}
/* ===== 文字（2026-10-09 ユーザー：ボタンの文字がしょぼい・バランスが悪い）=====
   見出し・ボタン・地図の札は太いゲーム文字（Dela Gothic One）＋縁取り。本文は丸ゴシックの太字。木札の中の文字は札の高さの半分くらいまで大きく */
:root{--game-font:'M PLUS Rounded 1c','Hiragino Maru Gothic ProN',sans-serif;--body-font:'Zen Maru Gothic','Hiragino Maru Gothic ProN',sans-serif}
body{font-family:var(--body-font);font-weight:700}
.btn,.map-spot b,.band,.mode b,.logo b,.modal .band,.navbtn,.mg-btn{font-family:var(--game-font);font-weight:900;letter-spacing:.03em}
.btn.primary,.map-spot b{color:#fff8e6;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;text-shadow:0 2px 0 #3a1408}
.btn:not(.primary):not(.small){color:#3a2410;-webkit-text-stroke:3px #fff6df;paint-order:stroke fill;text-shadow:none}
.btn.big{font-size:22px;min-height:64px}
.btn small{font-family:var(--body-font);font-weight:900;-webkit-text-stroke:0;text-shadow:none;font-size:12px;letter-spacing:0}
.btn.primary small{color:#ffe6b8}
.map-spot{border-width:8px 20px 10px;border-image-width:8px 20px 10px;padding:4px 6px 6px}
.map-spot b{font-size:19px;line-height:1.1}
.map-spot small{font-family:var(--body-font);font-weight:900;font-size:12px;margin-top:2px}
.band{-webkit-text-stroke:0}
.btn{font-size:16px}
.home-resume{gap:8px}
.home-resume p{font-family:var(--game-font);font-weight:800}
.home-resume{flex-wrap:wrap}
.home-resume p{flex:1 1 60%;min-width:150px;margin:0}
.home-resume .btn{flex:1 1 40%}
.home-resume .btn:not(.primary){flex:0 0 auto}
/* 見出し＝のぼり旗の布（朱の札を伸ばす）、上の帯のボタン＝小さな白木の札、帯＝溶岩の岩（2026-10-09） */
.band{clip-path:none;background:none;border-style:solid;border-width:7px 22px 9px 22px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/7px 22px 9px stretch;padding:2px 6px;color:#fff8e6;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;filter:drop-shadow(0 2px 0 #2a1f16)}
.band-teal{border-image-source:url(art/ui/btn_red.png)}
.band .band-sub{-webkit-text-stroke:0;font-family:var(--body-font);color:#ffe6b8}
.hud{background:linear-gradient(#2c211a,#1d1510);border-bottom:4px solid #c8442b;box-shadow:inset 0 -6px 0 #3a2a1f}
.navbtn{background:none;border:0;border-style:solid;border-width:5px 12px 6px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/5px 12px 6px stretch;color:#3a2410;padding:1px 2px;font-size:12px;-webkit-text-stroke:2px #fff6df;paint-order:stroke fill}
.navbtn.gacha-btn{border-image-source:url(art/ui/btn_red.png);color:#fff8e6;-webkit-text-stroke:2px #3a1408}
.logo b{color:#ffcf6a;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;font-size:20px}
/* 地図の行き先＝このゲームだけの描き文字（チャッピー作 2026-10-09。`game/art/moji/`）。札は下の小さな白木だけ */
.map-spot{border:0;border-image:none;background:none;filter:none;padding:0;gap:0}
.map-spot .moji{height:34px;width:auto;display:block;filter:drop-shadow(0 2px 2px #0008)}
.map-spot small{margin-top:-2px;background:none;border-style:solid;border-width:4px 12px 5px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/4px 12px 5px stretch;color:#3a2410;font-size:12px;padding:0 4px}
.map-spot.locked{filter:grayscale(.8) brightness(.85)}
.map-badge{right:-10px;top:-16px}
/* 案内役（立ち絵＋ひとこと） */
.guide{display:flex;align-items:flex-end;gap:0;margin:6px 0 4px;min-height:120px}
.guide img{height:130px;width:auto;flex:0 0 auto;filter:drop-shadow(3px 3px 0 #2a1f16);margin-right:-8px;z-index:1}
.guide-say{flex:1;margin-bottom:10px;background:#fffaf0;border:3px solid #2a1f16;box-shadow:4px 4px 0 #2a1f16;padding:8px 12px;position:relative}
.guide-say::before{content:'';position:absolute;left:-12px;bottom:14px;border:8px solid transparent;border-right:12px solid #2a1f16}
.guide-say b{display:inline-block;font-family:var(--game-font);font-weight:900;font-size:12px;color:#fff8e6;background:#c8442b;padding:0 8px;margin-bottom:2px}
.guide-say p{margin:0;font-size:15px;line-height:1.6}
.train-name .moji{height:26px;width:auto;display:block;filter:drop-shadow(0 1px 1px #0006)}
.sub-actions .btn .moji{height:28px;width:auto;display:block;margin:0 auto}
/* ===== タイトル画面（2026-10-09）===== */
.title-screen{position:fixed;inset:0;z-index:50;overflow:hidden;cursor:pointer;background:#1d1510;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}
.ts-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.ts-koma{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);height:min(48vh,420px);filter:drop-shadow(4px 4px 0 #2a1f16)}
.ts-logo{position:absolute;top:9%;left:50%;transform:translateX(-50%);width:min(88vw,520px);text-align:center}
.ts-logo img{width:100%;height:auto;filter:drop-shadow(0 6px 0 #2a1f16)}
.ts-logo b{font-family:var(--game-font);font-size:56px;color:#fff8e6;-webkit-text-stroke:8px #3a1408;paint-order:stroke fill}
.ts-tap{position:relative;margin:0 0 7%;font-family:var(--game-font);font-weight:900;font-size:20px;color:#fff8e6;-webkit-text-stroke:5px #3a1408;paint-order:stroke fill;animation:tsBlink 1.4s ease-in-out infinite}
@keyframes tsBlink{50%{opacity:.35}}
.ts-ver{position:absolute;right:10px;bottom:8px;color:#fff8e6aa;font-size:11px}
@media (prefers-reduced-motion: reduce){.ts-tap{animation:none}}
/* ===== 上の帯：タイトルは書かない。ホームの札・石・メニュー ===== */
.hud{display:flex;align-items:center;justify-content:space-between;padding:8px 12px}
.hud-place{font-family:var(--game-font);font-weight:900;color:#ffcf6a;font-size:16px;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;letter-spacing:.1em}
.hud-right{display:flex;align-items:center;gap:8px}
.hud-stone{display:flex;align-items:center;gap:5px;background:#fff6df;color:#3a2410;border:2px solid #3a2410;border-radius:12px;padding:1px 10px 1px 4px;font-family:var(--game-font);font-weight:900;font-size:15px}
.hud-stone i{width:18px;height:18px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 35% 30%,#ffe6b8,#e8502a 55%,#7a1d10);border:2px solid #3a1408}
.navbtn{font-size:13px;padding:2px 4px}
.hud-menu-ico{display:inline-block;width:12px;height:10px;margin-right:4px;vertical-align:-1px;background:linear-gradient(#3a2410 0 2px,transparent 2px 4px,#3a2410 4px 6px,transparent 6px 8px,#3a2410 8px 10px)}
.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.menu-grid .btn{min-height:54px}
/* ===== ステータスと練習のカード＝和紙に木の縁 ===== */
.status,.train,.result,.team,.logbox,.sub-actions .btn,.chapter,.pick,.record{background-color:#f8eed6;background-image:radial-gradient(#e9dcbc 1px,transparent 1.2px);background-size:7px 7px;border-color:#5a3a22!important}
.status,.train,.chapter{box-shadow:inset 0 0 0 2px #fff6df,0 4px 0 #3a2410}
.topbar .daycount,.topbar .phase{display:none}
.topbar{justify-content:flex-end}
/* 修行の窓の札：文字が縄にかからないように */
.garden-day{padding:12px 24px 9px}
.garden-day small{margin-left:2px}
/* チュートリアルの吹き出し＝ブルが話す */
.coach-say{padding-left:74px;min-height:78px;background:#fffaf0}
.coach-face{position:absolute;left:-6px;bottom:-4px;width:76px;height:auto;filter:drop-shadow(2px 2px 0 #2a1f16)}
.coach-name{display:inline-block;font-family:var(--game-font);font-size:12px;color:#fff8e6;background:#c8442b;padding:0 8px;margin-bottom:2px}
/* 戦闘の上の帯 */
.b3-top button,.b3-wave{font-family:var(--game-font);font-weight:900}
.b3-top button{background:none;border:0;border-style:solid;border-width:5px 14px 6px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/5px 14px 6px stretch;color:#3a2410}
.b3-top button.on{border-image-source:url(art/ui/btn_red.png);color:#fff8e6;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
.b3-wave{background:#2a1f16;color:#ffcf6a;padding:3px 10px;border:2px solid #c8442b}
.menu-grid .btn{white-space:nowrap}
/* 地図の行き先：朱の木札の上に描き文字（2026-10-09 ユーザー：札だけのほうがよかった→札と描き文字を合わせる） */
.map-spot{border-style:solid;border-width:9px 26px 11px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/9px 26px 11px stretch;padding:3px 4px 4px;filter:drop-shadow(0 4px 0 #2a1f16);gap:2px}
.map-spot .moji{height:30px;filter:drop-shadow(0 2px 0 #3a1408)}
.map-spot small{margin-top:0;border:0;border-image:none;background:#fff8e6;color:#3a2410;border-radius:2px;padding:0 8px;font-size:12px}
.map-spot.locked{border-image-source:url(art/ui/btn_wood.png);filter:grayscale(.5) drop-shadow(0 4px 0 #2a1f16)}
/* 炎の紋を札の両はしに収め、文字と重ならないようにする（はしの切り取りを広く） */
.map-spot{border-width:9px 44px 11px;border-image:url(art/ui/btn_red.png) 50 228 56 fill/9px 44px 11px stretch;padding:3px 0 4px}
.map-spot.locked{border-image-source:url(art/ui/btn_wood.png);border-image-slice:40 140 46 fill;border-width:9px 30px 11px}
.btn.primary{border-width:9px 40px 11px;border-image:url(art/ui/btn_red.png) 50 228 56 fill/9px 40px 11px stretch}
.band{border-width:7px 34px 9px;border-image:url(art/ui/btn_red.png) 50 228 56 fill/7px 34px 9px stretch}
/* ===== ホーム（ライモン型の配置 2026-10-09）：背景いっぱい・大きな札2つ・下のタブ ===== */
.page-home{padding:0!important;max-width:none!important}
.home2{position:relative;min-height:calc(100vh - 56px - 74px);display:flex;flex-direction:column;justify-content:flex-end;padding:12px 12px 90px}
.home2-bg{position:fixed;inset:0;z-index:-1;background:url(art/bg/home3.jpg) center top/cover no-repeat,#2a1f16}
.home2 .home-resume{position:absolute;top:10px;left:10px;right:10px}
.home2-modes{display:grid;grid-template-columns:1fr 1.25fr;gap:10px}
.mode2{position:relative;height:150px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:10px 12px;border:4px solid #2a1f16;box-shadow:0 6px 0 #2a1f16,inset 0 0 0 3px #f2c66a;overflow:hidden;cursor:pointer;text-align:left}
.mode2 .moji{height:38px;width:auto;position:relative;z-index:1;filter:drop-shadow(0 2px 0 #3a1408)}
.mode2 b{position:relative;z-index:1;font-family:var(--game-font);font-size:24px;color:#fff8e6;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill}
.mode2 small{position:relative;z-index:1;background:#2a1f16cc;color:#fff8e6;padding:1px 8px;font-size:12px;margin-top:2px}
.mode2-story{background:#c8442b}
.mode2-story::before{content:"";position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 80% 30%,#0003 0 2deg,transparent 2deg 10deg)}
.mode2-art{position:absolute;right:10px;top:10px;width:52%;height:54%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1.3fr;gap:4px;transform:rotate(4deg)}
.mode2-art i{background:#fff8e6;border:3px solid #2a1f16}.mode2-art i:first-child{grid-column:1/-1}
.mode2-train{background:linear-gradient(#3f7d74,#2c5d57)}
.mode2-train::before{content:"";position:absolute;inset:0;background:url(art/bg/train.jpg) center 60%/cover;opacity:.55}
.mode2-mon{position:absolute;right:4px;bottom:0;height:140px}
.mode2-mon img,.mode2-mon svg{height:140px;width:auto;display:block}
.mode2.locked{filter:grayscale(.8)}
.mode2 .map-badge{right:6px;top:6px}
/* 下のタブ */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:linear-gradient(#3a2a1f,#1d1510);border-top:4px solid #c8442b;box-shadow:0 -4px 0 #2a1f16}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:64px;background:none;border:0;cursor:pointer;padding:0}
.tab-ico{height:44px;width:auto;filter:drop-shadow(0 2px 0 #000a);transition:transform .15s}
.tab .moji{height:20px;width:auto}
.tab b{font-family:var(--game-font);color:#fff8e6;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;font-size:15px}
.tab.on::before{content:"";position:absolute;inset:2px;border-radius:10px;background:radial-gradient(#ffb04a66,transparent 70%)}
.tab.on .tab-ico{transform:translateY(-6px) scale(1.12)}
body:has(.tabbar) main{padding-bottom:84px}
/* お知らせ・イベント */
.hud-news{border-image-source:url(art/ui/btn_wood.png)}
.news{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:8px}
.news li{background:#fff8e6;border:2px solid #5a3a22;padding:8px 10px;font-weight:700}
.event-list{display:grid;gap:12px}
.event-card{position:relative;height:120px;border:4px solid #2a1f16;box-shadow:0 6px 0 #2a1f16,inset 0 0 0 3px #f2c66a;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:10px;cursor:pointer}
.event-card>img:first-child{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ev-tower>img:first-child{object-position:50% 10%}
.event-card .moji{position:relative;height:36px;width:auto;filter:drop-shadow(0 2px 0 #3a1408)}
.event-card small{position:relative;background:#2a1f16cc;color:#fff8e6;padding:1px 8px;font-size:12px}
.mode2 .moji{height:40px}
.tab .moji{height:22px}
.nakama-note{margin:0 0 8px;font-size:13px;color:#5a3a22}
.hud.hud-home{position:fixed;top:0;left:0;right:0;z-index:30;justify-content:flex-end;background:none;border:0;box-shadow:none}
.page-home{padding-top:0!important}
.back-float{position:sticky;top:6px;z-index:30;padding:6px 10px 0;pointer-events:none}
.back-float .navbtn{pointer-events:auto;font-size:14px}
.home2{min-height:calc(100vh - 74px);padding-top:60px}
.home2 .home-resume{top:56px}
/* ホームの2つの札：文字を大きく、絵とつり合わせる（2026-10-09） */
.home2-modes{grid-template-columns:1fr 1fr}
.mode2{height:178px;padding:8px 10px}
.mode2 .moji{height:auto;width:78%;max-height:60px;object-fit:contain;object-position:left bottom}
.mode2-train .moji{width:56%;max-height:64px}
.mode2-mon{right:-6px;bottom:-2px;height:168px}
.mode2-mon img{height:168px}
.mode2-art{inset:6px 6px 52px 6px;width:auto;height:auto;display:block;transform:rotate(-2deg);background:#fff;border:3px solid #2a1f16;overflow:hidden}
.mode2-art img{width:100%;height:100%;object-fit:cover;display:block}
.mode2-story::before{opacity:.6}
/* 体力の帯（イベントの上） */
.stam-bar{display:flex;align-items:center;gap:8px;margin:4px 0 10px;padding:6px 12px;background:#2a1f16;border:3px solid #c8442b;box-shadow:0 4px 0 #1d1510;color:#fff8e6}
.stam-bar b{font-family:var(--game-font);font-size:16px;color:#ffcf6a}
.stam-ico{width:22px;height:26px;background:url(art/ui/flame.png) center/contain no-repeat}
.stam-gauge{flex:1;height:14px;background:#1d1510;border:2px solid #5a3a22;border-radius:7px;overflow:hidden}
.stam-gauge i{display:block;height:100%;background:linear-gradient(#ffcf6a,#e8502a)}
.stam-bar em{font-style:normal;font-family:var(--game-font);font-weight:900;font-size:22px}
.stam-bar em small{font-size:13px;opacity:.8}
/* イベント：半分の大きさで2つずつ */
.event-list{grid-template-columns:1fr 1fr;gap:10px}
.event-card{height:auto;aspect-ratio:1/1.05;padding:8px}
.event-card .moji{height:auto;width:100%;max-height:40px;object-fit:contain;object-position:left bottom}
.event-card small{font-size:11px;margin-top:2px}
/* 仲間：一覧と修行後 */
.nk-tabs{display:flex;gap:8px;margin:6px 0 10px}
.nk-tab{flex:1;padding:8px;font-family:var(--game-font);font-weight:900;font-size:16px;background:none;border:0;border-style:solid;border-width:6px 18px 8px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/6px 18px 8px stretch;color:#3a2410;cursor:pointer}
.nk-tab.on{border-image-source:url(art/ui/btn_red.png);border-image-slice:50 228 56 fill;border-width:6px 30px 8px;color:#fff8e6;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill}
.nk-tab small{font-size:12px}
.after-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.after-card{position:relative;display:flex;flex-direction:column;align-items:center;padding:8px;background:#f8eed6;border:3px solid #5a3a22;box-shadow:0 4px 0 #3a2410}
.after-card img,.after-card svg{height:96px;width:auto}
.after-card b{font-family:var(--game-font);font-size:15px}
.after-card .rank-mini{position:absolute;right:6px;top:6px}
.after-card small{font-size:11px;color:#5a3a22}
/* 修行の札＝溶岩の岩としめ縄の枠。コマが枠の上へはみ出す。文字は上に大きく（2026-10-09） */
.home2-modes{grid-template-columns:.9fr 1.1fr;align-items:end;overflow:visible}
.mode2-story{height:170px}
.mode2-train{height:200px;overflow:visible;background:none;box-shadow:none;border:0;border-style:solid;border-width:22px 18px 18px;border-image:url(art/ui/frame_v3.png) 142 110 110 fill/22px 18px 18px stretch;padding:0;justify-content:flex-start;filter:drop-shadow(0 5px 0 #2a1f16)}
.mode2-train::before{inset:0;border-radius:2px;opacity:.85}
.mode2-train .moji{width:62%;max-height:none;margin:-4px 0 0 -2px;filter:drop-shadow(0 3px 0 #3a1408)}
.mode2-train small{position:absolute;left:0;bottom:-2px}
.mode2-train .mode2-mon{right:-18px;bottom:-14px;height:230px;z-index:2}
.mode2-train .mode2-mon img{height:230px}
.home2-modes{grid-template-columns:.85fr 1.15fr}
.mode2-train .moji{position:relative;z-index:3;width:48%}
.mode2-train small{z-index:3}
.mode2-train .mode2-mon{right:-30px;bottom:-16px;height:210px}
.mode2-train .mode2-mon img{height:210px}
/* ===== ガチャ（夜の行商人の屋台）===== */
.page-gacha{padding:0!important;max-width:none!important}
.gacha2{position:relative;min-height:calc(100vh - 74px);padding:12px 12px 96px;display:flex;flex-direction:column;gap:10px}
.gacha2-bg{position:fixed;inset:0;z-index:-1;background:url(art/bg/gacha.jpg?3) center top/cover no-repeat,#1d1510}
.g2-guide{display:flex;align-items:flex-end}
.g2-bunta{height:150px;width:auto;margin-right:-10px;z-index:1;filter:drop-shadow(3px 3px 0 #2a1f16)}
.g2-banner{position:relative;background:linear-gradient(#3a1f4acc,#1d1510ee);border:4px solid #2a1f16;box-shadow:0 6px 0 #2a1f16,inset 0 0 0 3px #f2c66a;padding:10px}
.g2-title{display:flex;align-items:center;gap:8px}
.g2-title .moji{height:40px}
.g2-tag{background:linear-gradient(90deg,#ff6a6a,#ffd36a,#6affb0,#6ad0ff,#c46aff);color:#2a1f16;font-family:var(--game-font);font-weight:900;padding:2px 10px;border:2px solid #2a1f16}
.g2-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:8px}
.g2-pick{display:flex;flex-direction:column;align-items:center;background:radial-gradient(#fff3,transparent 70%)}
.g2-pick img,.g2-pick svg{height:70px;width:auto}
.g2-pick small{color:#fff8e6;font-size:11px;text-shadow:0 1px 0 #000}
.g2-rule{margin:6px 0 0;color:#ffcf6a;font-size:13px;text-align:center}
.g2-money{display:flex;align-items:center;gap:10px;justify-content:center}
.g2-mat{background:#2a1f16cc;color:#fff8e6;padding:2px 10px;border-radius:10px}
.g2-rates{background:none;border:0;color:#fff8e6;text-decoration:underline;font-weight:900;cursor:pointer}
.g2-buttons{display:grid;grid-template-columns:1fr 1.3fr;gap:10px}
.g2-buttons .btn{min-height:76px;font-size:24px}
.g2-pity{display:flex;align-items:center;gap:8px;background:#2a1f16cc;color:#fff8e6;padding:4px 10px;font-size:13px}
.g2-pity .stam-gauge{flex:1}
.gacha2 .gacha-result{background:#2a1f16dd;padding:8px;border:3px solid #f2c66a}
.g2-banner{background:linear-gradient(#3a1f4a99,#1d1510cc)}
.g2-pick img,.g2-pick svg{height:96px}
.g2-pick{filter:drop-shadow(0 0 8px #ffd36a88)}
.g2-money{margin-top:auto}
.g2-guide .guide-say{background:#fffaf0ee}
.hud-stone{min-width:7.2em;justify-content:space-between;font-variant-numeric:tabular-nums;font-size:16px;padding:2px 12px 2px 4px}
.g2-guide .guide-say,.guide .guide-say{flex:0 1 auto;max-width:calc(100% - 110px)}
/* ガチャの目玉：1体ずつ自動で切りかわる（4秒ずつ） */
.g2-slides{position:relative;height:150px;margin-top:6px;overflow:hidden}
.g2-slide{position:absolute;inset:0;display:flex;align-items:center;gap:10px;opacity:0;animation:g2slide calc(var(--n)*4s) infinite;animation-delay:calc(var(--k)*4s)}
.g2-slide-art{flex:0 0 46%;display:flex;justify-content:center;filter:drop-shadow(0 0 12px #ffd36a99)}
.g2-slide-art img,.g2-slide-art svg{height:140px;width:auto}
.g2-slide-txt{color:#fff8e6}
.g2-slide-txt b{display:block;font-family:var(--game-font);font-size:26px;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill}
.g2-slide-txt p{margin:4px 0 0;font-size:14px;line-height:1.6}
@keyframes g2slide{0%{opacity:0;transform:translateX(30px)}4%,22%{opacity:1;transform:none}26%,100%{opacity:0;transform:translateX(-30px)}}
.g2-dots{position:absolute;bottom:2px;left:0;right:0;display:flex;justify-content:center;gap:6px}
.g2-dots i{width:8px;height:8px;border-radius:50%;background:#fff6;animation:g2dot calc(var(--n,4)*4s) infinite;animation-delay:calc(var(--k)*4s)}
@keyframes g2dot{0%,24%{background:#ffd36a}26%,100%{background:#fff6}}
@media (prefers-reduced-motion: reduce){.g2-slide{animation:none}.g2-slide:first-child{opacity:1}}
.hud.hud-home .hud-right{gap:4px;flex-wrap:nowrap;width:100%;justify-content:space-between}
.hud.hud-home .navbtn{white-space:nowrap;font-size:12px;border-width:5px 10px 6px}
.hud.hud-home .hud-stone{flex:0 0 auto}
/* ホームの上：右に詰めて並べる */
.hud.hud-home .hud-right{width:auto;justify-content:flex-end;gap:6px}
.hud.hud-home{justify-content:flex-end}
/* 修行の札：文字を大きく、まん中寄り */
.mode2-train{justify-content:center}
.mode2-train .moji{width:62%;margin:0 0 0 2px}
/* イベント：小さめ、1画面に収める */
.event-list{grid-template-columns:1fr 1fr;gap:8px}
.event-card{aspect-ratio:1/.95;padding:6px}
.stam-ico{width:26px;height:26px;object-fit:contain;background:none}
/* 修行後 */
.after-count{margin:0 0 8px;font-family:var(--game-font);font-weight:900;color:#3a2410}
.after-count b{font-size:20px;color:#c8442b}
.after-grid{grid-template-columns:repeat(4,1fr);gap:6px}
.after-card{cursor:pointer;padding:6px 2px;font:inherit}
.after-card img,.after-card svg{height:56px;width:auto}
.after-card b{font-size:11px;line-height:1.2;text-align:center}
.after-card .rank-mini{right:2px;top:2px;transform:scale(.8)}
/* 詳細 */
.rec-detail{padding-top:8px}
.rd-top{display:flex;align-items:flex-end;gap:10px;background:url(art/bg/train.jpg) center/cover;border:4px solid #2a1f16;box-shadow:0 6px 0 #2a1f16;padding:10px;min-height:220px}
.rd-art img,.rd-art svg{height:200px;width:auto;filter:drop-shadow(3px 3px 0 #2a1f16)}
.rd-id{background:#2a1f16cc;color:#fff8e6;padding:6px 10px;display:flex;flex-direction:column}
.rd-id b{font-family:var(--game-font);font-size:22px}
.rd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}
.rd-stats div{background:#f8eed6;border:2px solid #5a3a22;text-align:center;padding:4px}
.rd-stats span{display:block;font-size:11px;color:#5a3a22}.rd-stats b{font-family:var(--game-font);font-size:18px}
.rd-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.rd-slot{position:relative;aspect-ratio:1;border:3px dashed #8a6a4a;background:#f8eed6;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font:inherit}
.rd-slot.on{border:3px solid #2a1f16;background:radial-gradient(#fff8e6,#e9c98a)}
.rd-slot b{font-family:var(--game-font);font-size:18px}
.rd-slot small{font-size:10px;text-align:center;line-height:1.2}
.rd-slot em{position:absolute;right:3px;top:2px;font-style:normal;font-size:11px;font-weight:900}
.rd-acts{display:flex;gap:10px;margin-top:12px}.rd-acts .btn{flex:1}
/* 石・素材の絵（2026-10-09 絵文字・CSSの丸をやめてチャッピーの絵に） */
.hud-stone .ico,.g2-mat .ico{width:22px;height:22px;object-fit:contain;flex:0 0 auto}
.g2-mat{display:inline-flex;align-items:center;gap:4px}
.rd-id .rank-mini{align-self:flex-start;font-family:var(--game-font);font-size:14px;padding:0 7px}
.rd-acts .btn{min-height:0;height:58px;padding:0 10px;font-size:16px;white-space:nowrap}
/* ガチャ（2026-10-09 作り直し：ライモン型。ピックアップの大きな絵・左右の矢印・幕の切りかえ・ピックアップ／提供割合・終わる日・確定の帯・天井の道のり） */
.gacha3{position:relative;min-height:calc(100vh - 74px);padding:8px 10px 96px;display:flex;flex-direction:column;gap:8px}
.g3-money{display:flex;justify-content:flex-end;gap:8px}
.g3-money .g2-mat{background:#fff6df;color:#3a2410;border:2px solid #3a2410;border-radius:12px;padding:1px 10px 1px 4px;font-family:var(--game-font);font-weight:900}
.g3-banner{position:relative;margin:0 -10px;overflow:hidden;border-top:4px solid #2a1f16;border-bottom:4px solid #2a1f16;box-shadow:0 5px 0 #0006}
.g3-track-wrap{display:flex;transform:translateX(calc(var(--i) * -100%));transition:transform .35s ease}
.g3-key{position:relative;flex:0 0 100%;aspect-ratio:3/2;overflow:hidden}
.g3-art{width:100%;height:100%;object-fit:cover;display:block}
.g3-label{position:absolute;left:10px;top:12px;width:48%;display:flex;flex-direction:column;gap:2px;filter:drop-shadow(2px 3px 0 #2a1f16)}
.g3-label img{width:100%;height:auto}.g3-label .g3-pu{width:78%}
.g3-label b{font-family:var(--game-font);font-size:30px;color:#fff8e6;-webkit-text-stroke:2px #2a1f16;paint-order:stroke}
.g3-end{position:absolute;left:0;bottom:10px;margin:0;background:#2a1f16e6;color:#fff3d6;font-size:12px;font-weight:900;padding:3px 14px 3px 10px;clip-path:polygon(0 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.g3-arrow{position:absolute;top:50%;width:40px;height:56px;margin-top:-28px;background:none;border:0;padding:0;cursor:pointer;filter:drop-shadow(2px 3px 0 #2a1f16)}
.g3-arrow img{width:100%;height:100%;object-fit:contain}
.g3-arrow.l{left:2px}.g3-arrow.l img{transform:scaleX(-1)}.g3-arrow.r{right:2px}
.g3-tabs{display:flex;gap:6px;justify-content:center}
.g3-thumb{width:64px;aspect-ratio:3/2;padding:0;border:3px solid #2a1f16;background:#2a1f16;cursor:pointer;opacity:.6}
.g3-thumb.on{opacity:1;border-color:#f2c66a;box-shadow:0 0 0 2px #2a1f16}
.g3-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.g3-info{display:flex;gap:8px;justify-content:center}.g3-info .btn{flex:0 1 150px;min-height:0;font-size:14px}
.g3-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.g3-pull{position:relative;height:84px;background:none;border:0;border-style:solid;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:inherit;filter:drop-shadow(0 4px 0 #2a1f16)}
.g3-pull{border-width:10px 30px 12px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/10px 30px 12px stretch}
.g3-ten{border-image:url(art/ui/btn_red.png) 50 228 56 fill/10px 30px 12px stretch}
.g3-pull:disabled{filter:grayscale(.7) brightness(.8) drop-shadow(0 4px 0 #2a1f16);cursor:default}
.g3-pull .moji{height:30px;width:auto}.g3-pull>b{font-family:var(--game-font);font-size:24px}
.g3-cost{display:flex;align-items:center;gap:3px;font-family:var(--game-font);font-weight:900;font-size:15px;color:#3a2410;background:#fff6dfe6;border-radius:10px;padding:0 8px 0 2px}
.g3-cost .ico{width:18px;height:18px;object-fit:contain}
.g3-ribbon{position:absolute;top:-22px;left:50%;transform:translateX(-50%) rotate(-3deg);white-space:nowrap;background:#f2c66a;color:#3a2410;border:2px solid #2a1f16;font-size:12px;font-weight:900;padding:1px 10px;z-index:1}
.g3-miles{position:relative;background:#2a1f16dd;border:3px solid #5a3a22;padding:44px 22px 8px;margin-top:6px}
.g3-line{height:10px;background:#5a3a22;border:2px solid #120c08;border-radius:6px;overflow:hidden}
.g3-line i{display:block;height:100%;background:linear-gradient(#ffd27a,#e8762a)}
.g3-mile{position:absolute;top:8px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;color:#fff3d6}
.g3-mile{left:calc(22px + (100% - 44px) * var(--p))}
.g3-node{width:30px;height:30px;border-radius:50%;background:#3a2410;border:2px solid #120c08;display:grid;place-items:center}
.g3-node img{width:24px;height:24px;object-fit:contain;filter:grayscale(.6) brightness(.8)}
.g3-mile.reach .g3-node{background:#f2c66a}.g3-mile.reach img{filter:none}.g3-mile.got{opacity:.55}
.g3-node b{font-size:11px;color:#f2c66a}
.g3-mile small{font-size:10px;font-weight:900;margin-top:20px}.g3-mile em{position:absolute;top:20px;left:62%;background:#2a1f16;padding:0 3px;border-radius:4px;font-style:normal;font-size:10px;font-weight:900;color:#ffd27a}
.g3-count{margin:22px 0 0;text-align:right;color:#fff3d6;font-size:12px}.g3-count b{font-family:var(--game-font);font-size:16px;color:#ffd27a}
.gacha3 .gacha-result{background:#2a1f16dd;padding:8px;border:3px solid #f2c66a}
.gpick-list{display:flex;flex-direction:column;gap:8px}.gpick{display:flex;gap:10px;align-items:center;background:#f8eed6;border:2px solid #5a3a22;padding:6px}
.gpick img,.gpick svg{height:90px;width:auto}.gpick b{font-family:var(--game-font);font-size:18px;display:block}.gpick p{margin:2px 0 0;font-size:13px}
.gpick-note{font-size:12px;text-align:center}
.g3-info .btn{min-height:0;height:44px;padding:0 8px;font-size:15px}
.g3-guide{display:flex;align-items:flex-end;gap:4px;margin-top:auto}
.g3-guide .g2-bunta{height:110px;width:auto;flex:0 0 auto;filter:drop-shadow(2px 3px 0 #2a1f16)}
.g3-guide .guide-say{flex:0 1 auto;margin-bottom:14px}
.g3-info .btn{white-space:nowrap;flex:0 1 160px}
.g3-miles{padding:40px 22px 4px}.g3-count{margin:18px 0 0}
.g3-guide .g2-bunta{height:84px}.g3-guide .guide-say{margin-bottom:6px}.g3-guide .guide-say p{font-size:13px;margin:0}
.gacha3{gap:7px}
.g3-ribbon{background:url(art/ui/ribbon.png) center/100% 100% no-repeat;border:0;padding:4px 26px 7px;font-size:12px;top:-20px;color:#3a2410;-webkit-text-stroke:2px #fff6df;paint-order:stroke fill;transform:translateX(-50%)}
.g3-arrow{width:44px;height:46px;margin-top:-23px}
.g3-node{background:none;border:0;width:34px;height:34px}.g3-node img{width:32px;height:32px}
.g3-mile.reach .g3-node{background:none}.g3-mile.reach .g3-node img{filter:drop-shadow(0 0 4px #ffd27a)}
.g3-mile:last-child .g3-node img,.g3-mile .g3-node img[src*=ico_pick]{width:40px;height:30px}
.g3-label{width:52%}
.g3-pull .moji{height:34px}
.g3-arrow{width:48px;height:50px;margin-top:-25px;filter:drop-shadow(2px 0 0 #fff6df) drop-shadow(-2px 0 0 #fff6df) drop-shadow(0 2px 0 #fff6df) drop-shadow(0 -2px 0 #fff6df) drop-shadow(2px 3px 0 #2a1f16)}
.g3-count{margin:30px 0 0}
.gacha3{padding-bottom:88px}
/* 詳細＝ゆら玉をつける画面（枠を押すとその枠の玉だけ出す） */
.rd-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rd-head .rd-list{min-height:0;height:40px;padding:0 6px;font-size:14px;white-space:nowrap}
.rd-slot.sel{outline:4px solid #e8502a;outline-offset:1px;transform:translateY(-2px)}
.rd-hint{text-align:center;font-size:13px;color:#5a3a22;margin:10px 0}
.rd-pick{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.rd-pick-t{margin:0;font-family:var(--game-font);font-weight:900;font-size:16px}.rd-pick-t small{font-size:12px;color:#5a3a22}
.rd-acts{display:none}
/* 修行画面（2026-10-09 洗い出し6〜8・18・19）：上は中断とやめるの木札だけ。能力は和紙の札 */
.modal-row{display:flex;gap:10px;justify-content:center;margin-top:10px}.modal-row .btn{flex:1;max-width:160px}
.topbar{background:none!important;padding:0!important;margin-bottom:8px!important;justify-content:flex-end}
.topbar-actions .btn{min-height:0;height:40px;padding:0 6px;font-size:14px}
.st{background:#fbf3df!important;border:2px solid #5a3a22!important;border-left-width:7px!important;box-shadow:0 2px 0 #5a3a22}
.garden-window .garden-mate{position:absolute;bottom:8px;z-index:1}
.garden-window .gm-0{right:22%}.garden-window .gm-1{right:3%}
.garden-window .garden-mate img,.garden-window .garden-mate svg{height:78px;width:auto;display:block;filter:drop-shadow(2px 2px 0 #2a1f16)}
.garden-window .garden-trainer{left:30%!important}
.runbar .rb-energy,.runbar .rb-day{display:none}
/* バトル前後（2026-10-09） */
.b3-intro{font-size:14px;margin:6px 0}
.b3-side{margin:6px 0 2px;font-weight:900;font-size:13px}.b3-side small{font-weight:700;font-size:11px}
.b3-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.b3-cards .b3-card{min-width:0}.b3-cards .b3-card b{display:block;margin:0 -9px;max-width:none;overflow:hidden;white-space:nowrap;font-size:clamp(9px,calc(72px / var(--n,5)),13px);letter-spacing:-.03em}
.b3-card{background:#fbf3df;border:2px solid #5a3a22;box-shadow:0 2px 0 #5a3a22;text-align:center;padding:4px 2px;display:flex;flex-direction:column;align-items:center}
.b3-card img{height:64px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(1px 2px 0 #2a1f16)}
.b3-card b{font-size:12px;line-height:1.2}.b3-card small{font-size:10px;color:#5a3a22}
.b3-cards.e .b3-card{background:#f3dccf}
.vs{text-align:center;font-family:var(--game-font);font-size:22px;color:#c0392b;-webkit-text-stroke:2px #fff6df;paint-order:stroke;margin:4px 0}
.rule{font-size:12px;text-align:center;margin:8px 0 4px}
.br-head{text-align:center;margin:4px 0 10px}
.br-head b{font-family:var(--game-font);font-size:54px;letter-spacing:.06em;color:#fff6df;-webkit-text-stroke:5px #7a1d10;paint-order:stroke;text-shadow:0 5px 0 #2a1f16;display:inline-block;transform:rotate(-3deg);animation:brPop .5s cubic-bezier(.2,1.6,.4,1)}
.br-head.lose b{color:#d9d2c3;-webkit-text-stroke-color:#2a2220}
@keyframes brPop{from{transform:scale(2.2) rotate(-3deg);opacity:0}to{transform:scale(1) rotate(-3deg);opacity:1}}
.br-gains{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.br-next{text-align:center;font-weight:900;margin:10px 0 4px}
.br-gains .score-chip{flex:0 0 31%;display:flex;align-items:center;justify-content:space-between;padding:4px 6px}
.br-gains .score-chip span{writing-mode:horizontal-tb;white-space:nowrap;font-size:12px}.br-gains .score-chip strong{font-size:20px}
.help-page{display:flex;align-items:flex-end;gap:8px;margin:10px 0}
.help-page img{height:110px;width:auto;flex:0 0 auto;filter:drop-shadow(2px 3px 0 #2a1f16)}
.help-page .guide-say{flex:1}.help-page .guide-say p{font-size:15px;line-height:1.6}
.modal-row .btn{white-space:nowrap;min-height:0;height:52px;font-size:16px}
/* 修行の準備（2026-10-09 デッキ編成） */
.su-actor{display:flex;gap:10px;align-items:center;background:#fbf3df;border:2px solid #5a3a22;box-shadow:0 3px 0 #5a3a22;padding:6px 10px;margin:6px 0}
.su-actor img,.su-actor svg{height:72px;width:auto}.su-actor b{font-family:var(--game-font);font-size:20px;display:block}.su-actor small{font-size:12px}
.pk-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:6px 0 10px}
.pk{position:relative;background:#fbf3df;border:2px solid #8a6a4a;padding:3px 1px 2px;display:flex;flex-direction:column;align-items:center;font:inherit;cursor:pointer;min-width:0}
.pk img,.pk svg{height:44px;width:auto;max-width:100%}
.pk b{font-size:10px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.pk small{font-size:9px;line-height:1}.pk small .rstar{font-size:9px}
.pk .spec{position:absolute;left:1px;top:1px;font-size:8px;padding:0 2px}
.pk.on{border:3px solid #e8502a;background:#ffe9c7}
.pk:disabled{opacity:.4}
.su-decks{display:flex;gap:5px;align-items:center;margin:6px 0}
.su-dk{width:38px;height:38px;font-family:var(--game-font);font-weight:900;font-size:16px;background:#fbf3df;border:2px solid #5a3a22;box-shadow:0 2px 0 #5a3a22;cursor:pointer}
.su-dk.on{background:#e8502a;color:#fff}
.su-decks .su-rec{margin-left:auto;min-height:0;height:42px;padding:0 4px;font-size:14px;white-space:nowrap}
.su-slots{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.su-slot{position:relative;aspect-ratio:1;background:#fbf3df;border:2px solid #5a3a22;display:grid;place-items:center;padding:2px;cursor:pointer}
.su-slot.empty{border-style:dashed;background:#f0e4c8}
.su-slot img,.su-slot svg{max-height:100%;max-width:100%}
.su-slot .spec{position:absolute;left:0;bottom:0;font-size:8px;padding:0 2px}
.su-note{font-size:12px;margin:4px 0}
.su-sort{display:flex;gap:6px;align-items:center}
.rd-stats{grid-template-columns:repeat(3,1fr)}
.rd-top{position:relative}
.rd-fav{position:absolute;right:8px;top:8px;background:#fbf3df;border:2px solid #5a3a22;font:inherit;font-size:11px;font-weight:900;padding:2px 8px;cursor:pointer}
.rd-fav.on{background:#e8502a;color:#fff}
.rd-foot{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.after-card.fav{border-color:#e8502a;box-shadow:0 0 0 2px #e8502a}
.nick-in{display:block;width:100%;font:inherit;font-size:18px;padding:8px;border:2px solid #5a3a22;background:#fffaf0;margin:6px 0}
/* ミッション（2026-10-09） */
.ms-strip{display:flex;align-items:center;gap:8px;width:100%;margin:8px 0;background:#fbf3dfee;border:3px solid #5a3a22;box-shadow:0 4px 0 #2a1f16;padding:6px 10px;font:inherit;cursor:pointer;text-align:left;position:relative;z-index:2}
.ms-strip .ms-tag{background:#5a3a22;color:#fff6df;font-size:11px;font-weight:900;padding:1px 6px;flex:0 0 auto}
.ms-strip b{flex:1;font-size:14px}.ms-strip small{font-size:11px;font-weight:900;color:#7a1d10;flex:0 0 auto}
.ms-strip.ready{background:#ffe2a8;animation:msGlow 1.4s ease-in-out infinite}.ms-strip.ready small{background:#e8502a;color:#fff;padding:2px 8px}
@keyframes msGlow{50%{box-shadow:0 4px 0 #2a1f16,0 0 14px #ffb347}}
.ms-h{font-weight:900;margin:12px 0 4px}.ms-h small{font-weight:700;font-size:11px}
.ms-row{display:flex;align-items:center;gap:6px;background:#fbf3df;border:2px solid #5a3a22;padding:6px 8px;margin-bottom:5px}
.ms-row b{flex:1;font-size:13px}.ms-row small{font-size:11px;white-space:nowrap}.ms-row em{font-style:normal;font-size:11px;color:#7a6a5a}
.ms-row.ready{background:#ffe9c7;border-color:#e8502a}.ms-row.got{opacity:.55}
.ms-done{text-align:center;font-weight:900}
.ms-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e8502a;border:2px solid #fff6df;margin-left:3px;vertical-align:top}
.event-card.locked{filter:grayscale(.85) brightness(.6)}
/* ストーリーの表紙（名場面のコマ。2026-10-09 洗い出し25） */
.chapter .ch-cover{width:96px;min-height:72px;background:#2a1f16 center/cover no-repeat;display:flex;align-items:flex-end;padding:0;border:2px solid #2a1f16}
.chapter .ch-cover i{font-style:normal;background:#2a1f16dd;color:#fff6df;font-size:10px;font-weight:900;padding:1px 5px}
.chapter .ch-cover{width:150px!important;height:100px!important;flex:0 0 150px!important;writing-mode:horizontal-tb!important;justify-content:flex-start!important;align-items:flex-end!important;font-size:0!important}
.chapter .ch-cover i{font-size:11px}
.chapter .ch-cover{background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important} /* 2026-10-12 カラーのサムネを全体が見えるように */

/* 2026-10-12 ユーザー指定：押せるボタンと、押せない見出しを同じ見た目にしない
   見出し（.band）は木札をやめて、紙に墨で書いた文字＋火の印にする（盛り上がり・影・縄なし＝押せそうに見えない） */
.band,.modal .band{border:0!important;border-image:none!important;background:none!important;clip-path:none;filter:none;box-shadow:none;position:relative;padding:2px 4px 6px 30px!important;color:#3a1408;-webkit-text-stroke:0;font-size:19px;line-height:1.25}
.band::before{content:"";position:absolute;left:2px;top:50%;width:22px;height:28px;transform:translateY(-60%);background:url(art/ui/flame.png) center/contain no-repeat}
.band::after{content:"";position:absolute;left:30px;right:0;bottom:0;height:3px;background:#3a1408;opacity:.75;border-radius:2px 40% 40% 2px/2px 100% 100% 2px}
.band .band-sub{color:#6b4a2a}
.band-black{color:#fff6df}.band-black::after{background:#fff6df}
/* 押せるボタンは木札だけ。中身に合わせて色を使い分ける
   赤＝戦う・大事な決定／金＝もらう・ガチャ／緑＝育てる（修行）／藍＝読む・見る／白木＝とじる・もどる */
.btn.primary[data-action^="ms-"],.btn.primary[data-action^="pull"],.g3-pull,.g3-ten{border-image-source:url(art/ui/btn_gold.png)!important;color:#3a1408!important;-webkit-text-stroke:3px #fff2c8;paint-order:stroke fill}
.btn.primary[data-action="grant-train"],.btn.primary[data-action="train-open-go"],.btn.primary[data-action="new"],.btn.primary[data-action="resume"]{border-image-source:url(art/ui/btn_green.png)!important}
.btn.primary[data-action="story"],.btn.primary[data-action="nakama"]{border-image-source:url(art/ui/btn_blue.png)!important}
.btn.primary[data-action="close"]{border-image-source:url(art/ui/btn_wood.png)!important;border-image-slice:40 140 46 fill!important;color:#2a1f16;-webkit-text-stroke:0}
.g3-pull{border-image-slice:50 228 56 fill!important}
.modal .band{margin-top:16px}
.ms-strip .ms-more{font-style:normal;font-size:10px;font-weight:700;color:#7a6a5a;margin-left:6px;white-space:nowrap}
.ms-row .btn{flex:0 0 auto;border-width:6px 16px 8px!important;padding:1px 2px!important;font-size:13px;min-width:0}.ms-row b{min-width:0}
.gchoice>b{white-space:nowrap;flex:0 0 auto}
/* 2026-10-13 ホームにゆぐらの葉（絵ができるまで仮の「葉」の字） */
.hud-leaf .ico-leaf{font-style:normal;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#4f7d2a;color:#eaf7d2;font-size:12px;font-weight:900;margin-right:4px}
.hud.hud-home .hud-right{width:100%;justify-content:flex-end;gap:5px}
.hud-money{display:flex;flex-direction:column;gap:2px;margin-right:auto}
.hud.hud-home .hud-money .hud-stone{min-width:6.4em;font-size:13px;padding:0 9px 0 3px;border-radius:10px}
.hud-money .hud-stone .ico,.hud-money .ico-leaf{width:18px!important;height:18px!important;font-size:10px}
/* リーダー（2026-10-14） */
.lead-note{margin:4px 0 6px;font-size:12px;background:#fff3c8;border:2px solid #5a3a22;padding:4px 8px;line-height:1.5}
.lead-note i{font-style:normal;font-size:10px;font-weight:900;color:#fff;background:#c0392b;padding:0 5px;margin-right:6px}
.lead-note small{display:block;font-size:11px;color:#5a3a22}
.sb-cand.lead,.sb-fixed.lead{position:relative;outline:3px solid #c0392b;outline-offset:-3px}
.sb-cand.lead::before{content:'リーダー';position:absolute;left:4px;top:4px;font-size:9px;font-weight:900;color:#fff;background:#c0392b;padding:0 4px;z-index:1}
/* 2026-10-14 ユーザー：「わかった」の文字が下にずれる → 高さを決めたボタンは、上下のすき間を0にして文字をまん中に */
.modal-row .btn{padding-top:0!important;padding-bottom:0!important;display:flex;align-items:center;justify-content:center;line-height:1}
/* ミッションのページ（2026-10-14）：木札のつまみ・全達成の札 */
.ms-tabs{display:flex;gap:3px;margin:8px 0 4px;border-bottom:3px solid #5a3a22}
.ms-tab{flex:1;font:inherit;font-size:12px;font-weight:900;padding:6px 2px 4px;background:#d9c49a;color:#5a3a22;border:2px solid #5a3a22;border-bottom:0;cursor:pointer;position:relative;white-space:nowrap}
.ms-tab.on{background:#fbf3df;color:#2a1f16;margin-bottom:-3px;padding-bottom:7px}
.ms-tab .ms-dot{position:absolute;top:-4px;right:-3px;margin:0}
.ms-allbtn{display:block;width:100%;margin:6px 0 2px}
.ms-all{display:flex;align-items:center;gap:6px;background:#3a2414;color:#fff6df;border:2px solid #2a1f16;box-shadow:inset 0 0 0 2px #c9a24a;padding:7px 9px;margin-bottom:7px}
.ms-all b{flex:1;font-size:13px}.ms-all small{font-size:12px;font-weight:900;color:#ffd77a;white-space:nowrap}.ms-all em{font-style:normal;font-size:11px;color:#d9c49a}
.ms-all.ready{background:#7a1d10;animation:msGlow 1.4s ease-in-out infinite}.ms-all.got{opacity:.6}
.ms-row.lock{opacity:.5}
.ms-body{max-height:min(44vh,420px);overflow:auto}
/* 黄の国の賭場（2026-10-15）。絵はチャッピーに頼むまで仮。台は .sx */
.cs-top{display:flex;justify-content:space-between;align-items:center;margin:6px 0;font-weight:900}
.cs-coins b{font-size:20px;color:#7a1d10}.cs-leaf{font-size:12px}
.cs-note{font-size:12px;margin:8px 0}.cs-desc{display:block;font-style:normal;font-size:10px;font-weight:700;color:#7a6a5a}
.cs-foot{text-align:center;margin:12px 0}
.page-casino{padding-left:6px;padding-right:6px}
.sx{position:relative;background:linear-gradient(#5a3a1a,#2a1608 30%,#1a0e06);border:5px solid #d8a84a;border-radius:16px 16px 10px 10px;padding:8px 8px 10px;box-shadow:inset 0 0 0 2px #7a4a1a,0 8px 0 #0d0905,0 0 24px #ffb43a55;color:#fff6df;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.sx.shake{animation:sxShake .07s steps(2) infinite}
@keyframes sxShake{50%{transform:translate(2px,-2px)}}
.sx-data{position:relative;margin-bottom:6px}
.sx-data-t{font:inherit;font-size:11px;font-weight:900;background:#000;color:#ff7a3a;border:2px solid #5a3a22;border-radius:4px;padding:2px 10px}
.sx-data-in{display:none;grid-template-columns:repeat(4,1fr);gap:3px;background:#000;border:2px solid #5a3a22;padding:4px;font-size:9px;text-align:center;margin-top:4px}
.sx-data.open .sx-data-in{display:grid}.sx-data-in b{display:block;color:#ff5a2a;font:900 16px monospace}
.sx-hist{grid-column:1/-1;display:flex;gap:3px;justify-content:center}.sx-hist i{font:700 10px monospace;font-style:normal;padding:1px 4px;border-radius:3px;background:#333}
.sx-hist .h-renzoku,.sx-hist .h-big7{background:#c81e10}.sx-hist .h-raiju{background:#1d5a8a}.sx-hist .h-reg{background:#6a6a6a}.sx-hist .h-bigw{background:#a03a8a}
/* 液晶 */
.sx-lcd{position:relative;height:200px;border:4px solid #1a1210;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 2px #d8a84a;background:#0d1a2a}
.sx-bg{position:absolute;inset:0;background:linear-gradient(#5aa0d8,#bfe6ff 55%,#c9a86a 56%,#8a6a3a);transition:filter .6s}
.sx-lcd.st1 .sx-bg{background:linear-gradient(#e8a060,#f8d8a0 55%,#a06a3a 56%,#5a3a1a)}
.sx-lcd.st2 .sx-bg{background:linear-gradient(#3a0a08,#c8401a 55%,#5a1a0a 56%,#1a0805)}
.sx-lcd.st3 .sx-bg{background:linear-gradient(#0a2a14,#2a7a3a 55%,#1a4a1a 56%,#0a1a0a)}
.sx-lcd.st4 .sx-bg{background:radial-gradient(circle at 50% 60%,#ffd84a,#e8502a 45%,#5a0a08)}
.sx-lcd.st5 .sx-bg{background:radial-gradient(circle at 50% 50%,#5a2a8a,#1a0a2a 70%)}
.sx-lcd.st6 .sx-bg{background:radial-gradient(circle at 50% 50%,#ffe08a,#c88a1a 60%,#3a2408)}
.sx-stage{position:absolute;left:6px;bottom:4px;font-size:10px;font-weight:900;color:#fff;text-shadow:0 1px 0 #000;z-index:3}
.sx-mode{position:absolute;left:0;right:0;top:0;font-size:12px;font-weight:900;padding:3px 6px;z-index:4;text-shadow:0 1px 0 #000}
.sx-mode b{padding:1px 6px;border-radius:3px;margin-right:6px}.sx-mode b.art{background:#e8402a}.sx-mode b.tk{background:#ffd84a;color:#1a1210}.sx-mode b.qs{background:#8a4a1a}.sx-mode b.bn{background:#7a1d8a}.sx-mode b.cz{background:#1d6a3a}
.sx-mode em{font:900 22px monospace;font-style:normal;color:#ffd84a;margin-right:2px}.sx-mode i{font-style:normal;font-size:10px;margin-left:6px;color:#9fd}
.sx-chara{position:absolute;left:4px;bottom:0;height:120px;display:none;z-index:2}
.sx-talk.on~.sx-chara,.sx-talk.on+.sx-chara{display:block}
.sx-talk{white-space:pre-line;position:absolute;left:96px;right:8px;bottom:12px;padding:6px 10px;border-radius:10px;background:#fbf3df;color:#1a1210;font-size:13px;font-weight:900;border:3px solid #1a1210;opacity:0;transform:translateY(8px);transition:.2s;z-index:3}
.sx-talk small{display:block;font-size:9px;color:#7a6a5a}
.sx-talk.on{opacity:1;transform:none}.sx-talk.c-blue{color:#1d4a9a}.sx-talk.c-green{color:#1d7a2a}.sx-talk.c-red{color:#c81e10;border-color:#c81e10}.sx-talk.c-gold{color:#7a5a00;background:linear-gradient(#fff3a0,#ffd84a);border-color:#c88a1a;animation:sxGold .4s infinite}
@keyframes sxGold{50%{filter:brightness(1.3)}}
.sx-mon{position:absolute;right:8px;top:26px;width:46%;text-align:center;z-index:2}
.sx-mon img{height:110px;image-rendering:pixelated}
.sx-hp{height:8px;background:#3a0d08;border:2px solid #000;margin:2px 8px}.sx-hp i{display:block;height:100%;background:linear-gradient(#ff7a5a,#c81e10);transition:width .3s}
.sx-dmg{position:absolute;left:0;right:0;top:30px;font:900 26px monospace;color:#fff;text-shadow:0 0 4px #e8402a,0 2px 0 #000;opacity:0}
.sx-dmg.on{animation:sxDmg .5s}@keyframes sxDmg{0%{opacity:1;transform:scale(1.6)}100%{opacity:0;transform:translateY(-20px)}}
.sx-navi{position:absolute;left:0;right:0;bottom:6px;display:flex;justify-content:space-around;z-index:5;pointer-events:none}
.sx-navi b{width:46px;height:46px;border-radius:50%;background:#e8402a;color:#fff;font:900 30px/46px monospace;text-align:center;border:3px solid #fff;box-shadow:0 0 12px #ff3a1a;animation:sxNav .5s infinite alternate}
@keyframes sxNav{to{transform:scale(1.12)}}
.sx-big{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font:900 30px/1.2 "M PLUS Rounded 1c",sans-serif;color:#fff;-webkit-text-stroke:2px #1a1210;text-shadow:0 4px 0 #1a1210;z-index:8;opacity:0;pointer-events:none;transform:scale(.6)}
.sx-big.on{opacity:1;transform:none;transition:transform .18s cubic-bezier(.3,1.8,.6,1)}
.sx-big em{font-style:normal;font-size:46px;color:#ffd84a}
.sx-big.bonus{color:#ffd84a;font-size:32px}.sx-big.art{color:#ff7a3a}.sx-big.up{color:#ffd84a}.sx-big.lose{color:#9ab}.sx-big.warn{font-size:20px}.sx-big.cz{color:#8f8}.sx-big.tk{color:#ffe84a}.sx-big.qs{font-size:22px}.sx-big.aim{color:#ff3a2a;font-size:28px;animation:sxGold .25s infinite}
.sx-big.rainbow{background:linear-gradient(90deg,#f33,#fa3,#ff3,#3f6,#3cf,#a6f);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px #fff;font-size:34px}
.sx-cut{position:absolute;left:-100%;top:30%;width:100%;height:42%;z-index:7;display:flex;align-items:center;gap:8px;padding-left:10px;transform:skewY(-6deg);transition:left .15s ease-out;border-top:4px solid #fff;border-bottom:4px solid #fff}
.sx-cut.on{left:0}.sx-cut img{height:120%;image-rendering:pixelated}.sx-cut b{font:900 30px "M PLUS Rounded 1c";-webkit-text-stroke:2px #000;color:#fff}
.sx-cut.c-blue{background:linear-gradient(90deg,#1d4a9a,#4a8ad8)}.sx-cut.c-red{background:linear-gradient(90deg,#8a0a08,#e8402a)}.sx-cut.c-gold{background:linear-gradient(90deg,#8a5a00,#ffd84a,#fff3a0);animation:sxGold .2s infinite}
.sx-mission{position:absolute;left:8px;right:8px;top:34%;background:#1a1210ee;border:3px solid #ffd84a;border-radius:8px;padding:8px;text-align:center;font-size:16px;font-weight:900;z-index:6;opacity:0;transition:.2s}
.sx-mission.on{opacity:1}.sx-mission b{display:block;font-size:22px;color:#ffd84a}
.sx-push{position:absolute;right:10px;bottom:10px;width:74px;height:74px;border-radius:50%;font:900 16px monospace;color:#fff;background:radial-gradient(circle at 40% 35%,#ff9a6a,#c81e10 60%,#5a0805);border:4px solid #ffd84a;box-shadow:0 5px 0 #3a0805,0 0 18px #ff5a2a;z-index:9;display:none}
.sx-push.on{display:block;animation:sxNav .3s infinite alternate}
.sx-flash{position:absolute;inset:0;z-index:10;pointer-events:none;opacity:0}
.sx-flash.bonus{animation:sxFl .12s steps(2) 12;background:#fff}.sx-flash.dark{opacity:1;background:#000;transition:opacity .2s}.sx-flash.zawa{opacity:.5;background:#300}.sx-flash.hit{opacity:.5;background:#fff}
@keyframes sxFl{50%{opacity:.9}}
/* リール */
.sx-reelbox{position:relative;margin:8px auto 4px;width:max-content;max-width:100%;padding:6px;border-radius:8px;background:linear-gradient(#e8c06a,#a8782a);box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210}
.sx-reels{display:block;width:min(78vw,236px);height:auto;border-radius:4px}
.sx-lamps{position:absolute;left:-14px;top:20%;display:flex;flex-direction:column;gap:14px}.sx-lamps i{width:9px;height:9px;border-radius:50%;background:#3a2414;border:1px solid #000}.sx-lamps i.on{background:#ffd84a;box-shadow:0 0 8px #ffd84a}
.sx-seg{display:flex;justify-content:space-around;background:#000;border:2px solid #5a3a22;border-radius:4px;padding:3px;font-size:8px;color:#a88}
.sx-seg span{display:flex;flex-direction:column;align-items:center}.sx-seg b{font:900 18px monospace;color:#ff3a2a;text-shadow:0 0 6px #ff3a2a;letter-spacing:2px}
/* 操作盤 */
.sx-panel{display:grid;grid-template-columns:54px 64px 1fr;gap:8px;align-items:end;margin-top:8px;background:linear-gradient(#3a2414,#1a0e06);border-radius:8px;padding:8px;border:2px solid #7a4a1a}
.sx-bet{height:52px;border-radius:8px;font:900 12px/1.1 monospace;color:#1a1210;background:linear-gradient(#fff3a0,#e8b030);border:3px solid #1a1210;box-shadow:0 4px 0 #5a3a1a}.sx-bet:active{transform:translateY(3px);box-shadow:0 1px 0 #5a3a1a}
.sx-lever{position:relative;height:84px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:pointer}
.sx-lever::before{content:'';position:absolute;top:24px;width:8px;height:44px;background:linear-gradient(90deg,#999,#eee,#888);border-radius:4px}
.sx-knob{position:relative;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff9a8a,#c81e10 60%,#5a0805);border:3px solid #1a1210;transition:transform .08s;z-index:1}
.sx-knob.down{transform:translateY(26px)}.sx-lever small{position:absolute;bottom:0;font-size:9px;color:#d8b080}
.sx-stops{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sx-stop{height:52px;border-radius:50%/40%;background:radial-gradient(circle at 50% 35%,#6a5a4a,#2a1e14);border:3px solid #1a1210;box-shadow:0 5px 0 #0d0905;transition:transform .05s}
.sx-stop.lit{background:radial-gradient(circle at 50% 35%,#fff3a0,#ffb43a 55%,#c86a10);box-shadow:0 5px 0 #5a3a1a,0 0 14px #ffb43a}
.sx-stop.pressed{transform:translateY(4px);box-shadow:0 1px 0 #0d0905}
.sx-opts{display:flex;gap:6px;justify-content:center;margin-top:8px}
.sx-opt{font:inherit;font-size:11px;font-weight:900;padding:4px 10px;border-radius:6px;border:2px solid #7a4a1a;background:#2a1a0e;color:#a88}.sx-opt.on{background:#e8502a;color:#fff6df;border-color:#ffd84a}
/* 筐体ランプ（レバーオンで光る） */
.sx::after{content:'';position:absolute;inset:-5px;border-radius:16px 16px 10px 10px;pointer-events:none;border:5px solid transparent}
.sx[data-frame=blue]::after{border-color:#3a8aff;box-shadow:0 0 18px #3a8aff,inset 0 0 14px #3a8aff;animation:sxLamp .25s steps(2) infinite}
.sx[data-frame=green]::after{border-color:#3aff6a;box-shadow:0 0 18px #3aff6a,inset 0 0 14px #3aff6a;animation:sxLamp .2s steps(2) infinite}
.sx[data-frame=red]::after{border-color:#ff2a1a;box-shadow:0 0 22px #ff2a1a,inset 0 0 18px #ff2a1a;animation:sxLamp .15s steps(2) infinite}
.sx[data-frame=rainbow]::after{border-image:linear-gradient(90deg,#f33,#fa3,#ff3,#3f6,#3cf,#a6f) 1;box-shadow:0 0 26px #fff;animation:sxLamp .1s steps(2) infinite}
@keyframes sxLamp{50%{opacity:.35}}
/* シャッター：レバーオンで閉じ、第3停止で開く */
.sx-shutter{position:absolute;inset:0;z-index:5;pointer-events:none;transform:translateY(-102%);transition:transform .18s ease-in;background:repeating-linear-gradient(#6a4a2a 0 14px,#4a2e16 14px 16px);border-bottom:4px solid #1a1210}
.sx-shutter i{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;border-radius:50%;border:5px solid #d8a84a;background:#2a1608;box-shadow:0 0 0 4px #4a2e16}
.sx-lcd.shut .sx-shutter{transform:none}
.sx-lcd.shut .sx-shutter i{animation:sxGold .5s infinite}
/* 採取：停止ごとにゆら結晶がならぶ */
.sx-gather{position:absolute;left:8px;top:28px;display:flex;gap:4px;align-items:center;z-index:4}
.sx-gather b{font-size:11px;background:#1a1210cc;padding:2px 6px;border-radius:4px}
.sx-gather .gem{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#6ac0ff 40%,#1d5a8a);border:2px solid #1a1210;animation:sxPop .2s}
@keyframes sxPop{from{transform:scale(2);opacity:0}}
/* 連続演出・暗転 */
.sx-ren{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.sx-ren img{height:110px;image-rendering:pixelated}.sx-ren .ren-t{font:900 20px "M PLUS Rounded 1c";-webkit-text-stroke:1px #000;text-shadow:0 2px 0 #000}
.sx-lcd.ren1 .sx-bg{filter:brightness(.6) hue-rotate(-20deg)}.sx-lcd.ren2 .sx-bg{filter:brightness(.5) saturate(1.6)}
.sx-lcd.dark .sx-bg{filter:brightness(.08)}.sx-lcd.dark .ren-boss{filter:brightness(.6) drop-shadow(0 0 10px #f22);animation:sxShake .1s steps(2) infinite}
.sx-flash.wave{opacity:.35;background:#fff}
/* ---- 液晶の動き（2026-10-15 ユーザー：静止画が流れるだけはだめ。何もないときも動く） ---- */
.sx-bg{overflow:hidden}
.sx-bg .cl{position:absolute;height:14px;border-radius:10px;background:#ffffffcc;box-shadow:12px -6px 0 2px #ffffffcc,26px 0 0 0 #ffffffcc;animation:sxCloud linear infinite}
.sx-bg .c1{top:12%;width:34px;animation-duration:38s}.sx-bg .c2{top:26%;width:24px;animation-duration:52s;animation-delay:-20s;opacity:.8}.sx-bg .c3{top:6%;width:44px;animation-duration:64s;animation-delay:-40s;opacity:.7}
@keyframes sxCloud{from{left:-60px}to{left:105%}}
.sx-bg .pt{position:absolute;inset:0;pointer-events:none}
.sx-lcd.st2 .sx-bg .pt{background-image:radial-gradient(#ffb43a 1.5px,transparent 2px),radial-gradient(#ff7a3a 1px,transparent 1.5px);background-size:40px 60px,27px 44px;animation:sxEmber 4s linear infinite}
.sx-lcd.st3 .sx-bg .pt{background-image:radial-gradient(#9fe08a 2px,transparent 2.5px);background-size:46px 70px;animation:sxLeaf 7s linear infinite}
.sx-lcd.st4 .sx-bg .pt,.sx-lcd.st6 .sx-bg .pt{background-image:radial-gradient(#fff3a0 1.5px,transparent 2px);background-size:30px 30px;animation:sxEmber 2s linear infinite}
@keyframes sxEmber{from{background-position:0 100px,0 80px}to{background-position:20px -60px,-14px -70px}}
@keyframes sxLeaf{from{background-position:0 -70px}to{background-position:30px 140px}}
.sx-lcd.st1 .cl,.sx-lcd.st2 .cl,.sx-lcd.st5 .cl{display:none}
.sx-scene{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.sx-scene .amb{mix-blend-mode:multiply;position:absolute;bottom:calc(8% + var(--y,0%));height:54px;image-rendering:pixelated}
.sx-scene .amb.ltr{animation:sxWalkL var(--dur) linear forwards;transform:scaleX(-1)}
.sx-scene .amb.rtl{animation:sxWalkR var(--dur) linear forwards}
.sx-scene .amb.walk{animation-name:sxWalkL,sxBob}.sx-scene .amb.walk.rtl{animation-name:sxWalkR,sxBob}
.sx-scene .amb.run{height:46px}.sx-scene .amb.hop{height:44px}.sx-scene .amb.fly,.sx-scene .amb.float{height:44px}
.sx-scene .amb.walk,.sx-scene .amb.run,.sx-scene .amb.hop,.sx-scene .amb.fly,.sx-scene .amb.float{animation-duration:var(--dur),.4s;animation-iteration-count:1,infinite;animation-timing-function:linear,ease-in-out}
.sx-scene .amb.hop.ltr,.sx-scene .amb.run.ltr,.sx-scene .amb.fly.ltr,.sx-scene .amb.float.ltr{animation-name:sxWalkL,sxHop}.sx-scene .amb.hop.rtl,.sx-scene .amb.run.rtl,.sx-scene .amb.fly.rtl,.sx-scene .amb.float.rtl{animation-name:sxWalkR,sxHop}
.sx-scene .amb.float{animation-duration:var(--dur),1.6s}
@keyframes sxWalkL{from{left:-60px}to{left:105%}}@keyframes sxWalkR{from{left:105%}to{left:-60px}}
@keyframes sxBob{50%{margin-bottom:3px}}@keyframes sxHop{50%{margin-bottom:12px}}
.sx-scene .amb.birds{left:-30px;top:14%;width:30px;height:14px;animation:sxBirds 7s linear forwards}
.sx-scene .amb.birds i{position:absolute;width:8px;height:4px;border-top:2px solid #1a1210;border-radius:50% 50% 0 0;animation:sxFlap .3s infinite alternate}
.sx-scene .amb.birds i:nth-child(2){left:12px;top:6px}.sx-scene .amb.birds i:nth-child(3){left:22px;top:-2px}
@keyframes sxBirds{to{left:105%;top:4%}}@keyframes sxFlap{to{transform:scaleY(-1)}}
.sx-scene .amb.train{left:40%;bottom:6%;height:64px;animation:sxPunch .35s steps(2) 12}
@keyframes sxPunch{50%{transform:translateX(-8px) rotate(-6deg)}}
.sx-lcd.m-bonus .sx-scene,.sx-lcd.m-quest .sx-scene,.sx-lcd.dark .sx-scene{display:none}
/* 演出の動き */
.sx-chara.pop{animation:sxCharaIn .35s cubic-bezier(.3,1.6,.6,1),sxBob .6s .35s ease-in-out infinite}
@keyframes sxCharaIn{from{transform:translateX(-80px)}}
.sx-talk.on{animation:sxTalk .25s cubic-bezier(.3,1.6,.6,1)}@keyframes sxTalk{from{transform:scale(.4)}}
.sx-cut.on img{animation:sxCutImg .9s ease-out}@keyframes sxCutImg{from{transform:translateX(-40px) scale(1.4)}to{transform:none}}
.sx-cut.on b{animation:sxCutTxt .3s .15s both cubic-bezier(.3,1.8,.6,1)}@keyframes sxCutTxt{from{transform:scale(3);opacity:0}}
.sx-ren img{animation:sxZoom .6s cubic-bezier(.2,1.4,.5,1),sxBob .8s .6s ease-in-out infinite}@keyframes sxZoom{from{transform:scale(.2);opacity:0}}
.sx-ren .ren-t{animation:sxTalk .3s cubic-bezier(.3,1.6,.6,1)}
.sx-lcd.shut .sx-shutter{transition:transform .18s cubic-bezier(.5,0,.7,1.4)}
.sx-mon img{animation:sxBob 1.2s ease-in-out infinite}
.sx-lcd.m-bonus .sx-mon img,.sx-lcd.m-quest .sx-mon img{animation:sxBob 1.2s ease-in-out infinite}
.sx-flash.hit~*{}
/* ---- レア役の専用演出（レバーオン） ---- */
.sx-rare{position:absolute;inset:0;z-index:6;pointer-events:none;display:none}
.sx-rare.on{display:block}
.sx-rare .rare-t{position:absolute;left:0;right:0;top:36%;text-align:center;font:900 30px "M PLUS Rounded 1c";color:#fff;-webkit-text-stroke:2px #1a1210;text-shadow:0 3px 0 #1a1210;animation:sxCutTxt .3s .2s both cubic-bezier(.3,1.8,.6,1)}
.sx-rare.che .rare-t{color:#ff6a4a}.sx-rare.sui .rare-t{color:#6ac0ff}.sx-rare.chance .rare-t{color:#ffe84a}
.sx-rare .fruit{position:absolute;top:-40px;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 12%,#ff6a4a 30%,#b8180c);border:3px solid #1a1210;animation:sxFall .7s cubic-bezier(.5,0,.6,1.4) forwards}
.sx-rare .fruit::before{content:'';position:absolute;left:12px;top:-12px;width:4px;height:12px;background:#3a6a2a;transform:rotate(15deg)}
.sx-rare .f1{left:44%}.sx-rare .f2{left:22%;animation-delay:.15s}.sx-rare .f3{left:68%;animation-delay:.3s}
.sx-rare.big .fruit{width:50px;height:50px}
@keyframes sxFall{to{top:58%}}
.sx-rare .orb{position:absolute;right:-60px;bottom:14%;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 14%,#6ac0ff 35%,#1d5a8a);border:3px solid #1a1210;box-shadow:0 0 16px #6ac0ff;animation:sxRoll 1.1s cubic-bezier(.2,.8,.4,1) forwards}
.sx-rare.big .orb{width:70px;height:70px;box-shadow:0 0 30px #9fe0ff,0 0 60px #6ac0ff}
@keyframes sxRoll{to{right:42%;transform:rotate(-540deg)}}
.sx-rare .bolt{position:absolute;left:46%;top:-10%;width:22px;height:120%;background:linear-gradient(#fff,#ffe84a);clip-path:polygon(50% 0,100% 0,60% 42%,100% 42%,20% 100%,40% 55%,0 55%);filter:drop-shadow(0 0 10px #ffe84a);animation:sxBolt .5s steps(3) 2}
.sx-rare .bolt.b2{left:22%;transform:scale(.7);animation-delay:.12s}
@keyframes sxBolt{50%{opacity:0}}
.sx-rare.chance{background:#1a1408aa}
.sx-rare.kche{background:linear-gradient(90deg,#f338,#fa38,#ff38,#3f68,#3cf8,#a6f8);animation:sxGold .2s infinite}
.sx-flash.red{opacity:.45;background:#ff3a1a}.sx-flash.blue{opacity:.45;background:#3a9aff}.sx-flash.yellow{opacity:.6;background:#ffe84a}
.sx[data-frame=yellow]::after{border-color:#ffe84a;box-shadow:0 0 22px #ffe84a,inset 0 0 16px #ffe84a;animation:sxLamp .12s steps(2) infinite}
/* 台の画面：画面いっぱい。スクロールしないで全部入る（2026-10-15 ユーザー） */
.page-casino:has(#sl-host){padding:0 4px;min-height:auto}
.page-casino:has(#sl-host)~.tabbar,body:has(#sl-host) .tabbar{display:none}
.cs-bar{display:flex;align-items:center;gap:6px;padding:calc(env(safe-area-inset-top,0px) + 4px) 2px 4px}
.cs-bar .cs-coins{flex:1;font-weight:900;font-size:13px}.cs-bar .cs-coins b{font-size:17px}
.cs-bar .btn{padding:4px 10px;font-size:12px}
#sl-host .sx{height:calc(100svh - 64px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;padding:6px;border-width:4px}
#sl-host .sx-data{position:absolute;right:10px;top:10px;z-index:20;margin:0}
#sl-host .sx-data-in{position:absolute;right:0;width:240px}
#sl-host .sx-lcd{flex:1 1 auto;height:auto;min-height:120px}
#sl-host .sx-reelbox{margin:6px auto 4px}
#sl-host .sx-reels{width:min(64vw,230px,calc((100dvh - 420px)*1.05))}
#sl-host .sx-panel{margin-top:6px;padding:6px}
#sl-host .sx-opts{margin-top:6px}
.sx-navi b.off{visibility:hidden;animation:none}
/* ---- ラッシュ中（初代の動画にならう 2026-10-15） ---- */
/* ずっと戦っている：コマが敵の群れと戦う */
.sx-hero{position:absolute;left:12%;bottom:14%;height:70px;z-index:2;image-rendering:pixelated;transform:scaleX(-1);animation:sxBob .5s ease-in-out infinite}
.sx-hero.atk{animation:sxDash .35s ease-out}
@keyframes sxDash{40%{left:46%;transform:scaleX(-1) rotate(-12deg)}100%{left:12%}}
.sx-foes{position:absolute;right:4%;bottom:12%;display:flex;gap:2px;z-index:1}
.sx-foes img{height:50px;image-rendering:pixelated;filter:brightness(.55) sepia(1) hue-rotate(-30deg) saturate(2);animation:sxBob .7s ease-in-out infinite}
.sx-foes img:nth-child(2){animation-delay:-.3s;height:42px}.sx-foes img:nth-child(3){animation-delay:-.5s;height:46px}
/* 押し順ナビ：盾の形。押すと斬撃が走って割れる */
.sx-navi b{position:relative;border-radius:40% 40% 50% 50%/30% 30% 70% 70%;background:radial-gradient(circle at 50% 35%,#7ad8ff,#1d6aaa 70%);border-color:#d8f4ff;box-shadow:0 0 14px #4ab8ff}
.sx-navi b.hit{animation:sxNaviHit .26s steps(3)}
@keyframes sxNaviHit{50%{transform:scale(1.4);filter:brightness(3)}}
.sx-navi .navi-slash{position:absolute;left:-40px;top:50%;width:130px;height:6px;margin-top:-3px;background:linear-gradient(90deg,transparent,#fff,#7ad8ff,transparent);transform:rotate(-35deg);box-shadow:0 0 12px #fff;animation:sxSlash .26s ease-out forwards}
@keyframes sxSlash{from{transform:rotate(-35deg) scaleX(0)}to{transform:rotate(-35deg) scaleX(1.4);opacity:0}}
/* 上乗せ：レバーで扉が閉まる → 第3停止で開いて白く光る → 大きな金の数字 */
.sx-lcd.up .sx-shutter{background:repeating-linear-gradient(90deg,#7a5a32 0 22px,#5a3e1e 22px 25px);border:4px solid #3a2410}
.sx-lcd.up .sx-shutter i{width:70px;height:70px;margin:-35px;border:6px double #d8a84a;background:radial-gradient(circle,#3a2410 30%,#d8a84a 32%,#3a2410 40%)}
.sx-flash.white{opacity:1;background:#fff;transition:opacity .4s}
.sx-upnum{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:9;pointer-events:none;opacity:0;font:900 76px "M PLUS Rounded 1c";color:#ffd84a;-webkit-text-stroke:3px #7a3a08;text-shadow:0 0 18px #ff9a2a,0 6px 0 #5a2a04}
.sx-upnum i{font-style:normal;font-size:44px;margin-right:2px}
.sx-upnum.on{opacity:1;animation:sxUp 1.5s ease-out forwards}
@keyframes sxUp{0%{transform:scale(3);opacity:0}15%{transform:scale(.9);opacity:1}25%{transform:scale(1.05)}80%{opacity:1}100%{transform:scale(1);opacity:0}}
/* BARを狙え！（帯が流れる） */
.sx-banner{position:absolute;left:0;right:0;top:42%;height:40px;z-index:7;display:none;align-items:center;justify-content:center;font:900 22px "M PLUS Rounded 1c";color:#fff;-webkit-text-stroke:1px #000;background:linear-gradient(90deg,transparent,#c81e10 15%,#ff7a3a 50%,#c81e10 85%,transparent);border-top:2px solid #ffd84a;border-bottom:2px solid #ffd84a}
.sx-banner b{background:#1a1210;color:#ffd84a;padding:0 8px;margin-right:4px;border:2px solid #ffd84a}
.sx-banner.on{display:flex;animation:sxBanner .3s ease-out,sxLamp .3s steps(2) .3s infinite}
@keyframes sxBanner{from{transform:translateX(100%)}}
.sx-ticket{position:absolute;left:6px;top:26px;z-index:5;font-size:11px;font-weight:900}
.sx-ticket b{background:#ffd84a;color:#1a1210;padding:1px 5px;border-radius:3px;margin-right:2px}
.sx-lcd.m-art .sx-scene,.sx-lcd.m-tokka .sx-scene{display:none}
/* 台の画面はスクロールさせない（iPhoneでスクロール中の最初のタップが止めるだけになるのを防ぐ） */
html:has(#sl-host),body:has(#sl-host){overflow:hidden;height:100%;overscroll-behavior:none}
/* ======== 液晶の場面（ラッシュ・ボーナス）2026-10-15 ======== */
.sx-act{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.sx-act img{position:absolute;image-rendering:pixelated}
/* ナビのゲーム：番号の上に敵が3体 */
.sx-act.navi .foe{bottom:56px;height:56px;animation:sxFoeIn .3s cubic-bezier(.3,1.6,.6,1) both,sxBob .6s .3s ease-in-out infinite}
.sx-act.navi .f0{left:calc(16.6% - 28px)}.sx-act.navi .f1{left:calc(50% - 28px);animation-delay:.08s,.4s}.sx-act.navi .f2{left:calc(83.3% - 28px);animation-delay:.16s,.5s}
@keyframes sxFoeIn{from{transform:translateY(-120px) scale(.4);opacity:0}}
.sx-act .foe.down{animation:sxFoeDown .6s ease-in forwards!important}
@keyframes sxFoeDown{0%{filter:brightness(4)}20%{transform:translate(10px,-30px) rotate(40deg)}100%{transform:translate(60px,90px) rotate(200deg);opacity:0}}
.sx-act .hero{left:-60px;bottom:14px;height:60px;transform:scaleX(-1);transition:left .14s ease-out}
.sx-act.navi .hero{left:4%}
.sx-act .hero.slash{animation:sxHeroSlash .3s ease-out}
@keyframes sxHeroSlash{40%{transform:scaleX(-1) translateY(-30px) rotate(-25deg)}100%{transform:scaleX(-1)}}
.sx-act .spark,.sx-act .bspark{position:absolute;width:90px;height:90px;margin:-45px;background:radial-gradient(circle,#fff 0 12%,#ffe84a 25%,#ff6a2a 45%,transparent 65%);animation:sxSpark .35s ease-out forwards}
.sx-act .spark.s0{left:16.6%;bottom:30px}.sx-act .spark.s1{left:50%;bottom:30px}.sx-act .spark.s2{left:83.3%;bottom:30px}
@keyframes sxSpark{from{transform:scale(.2) rotate(0)}to{transform:scale(1.5) rotate(90deg);opacity:0}}
.sx-act .getstamp{position:absolute;left:0;right:0;top:30%;text-align:center;font:900 46px "M PLUS Rounded 1c";color:#ffb43a;-webkit-text-stroke:3px #5a2a04;text-shadow:0 0 16px #ffe84a,0 5px 0 #3a1a04;animation:sxStamp .9s cubic-bezier(.3,1.8,.6,1) both}
@keyframes sxStamp{0%{transform:scale(3) rotate(-10deg);opacity:0}30%{transform:scale(1) rotate(-6deg);opacity:1}85%{opacity:1}100%{opacity:0}}
/* ナビのないゲーム：毎回ちがう場面 */
.sx-act.sc-run .speed{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 30px,#fff6 30px 32px,transparent 32px 70px);animation:sxSpeed .25s linear infinite}
@keyframes sxSpeed{to{background-position:-70px 0}}
.sx-act .hero.run{left:36%;height:72px;animation:sxRun .25s steps(2) infinite}
@keyframes sxRun{50%{transform:scaleX(-1) translateY(-6px) rotate(-6deg)}}
.sx-act .shadow{left:-60%;bottom:0;height:150%;filter:brightness(0) opacity(.7);animation:sxShadow 2.6s ease-in-out forwards}
@keyframes sxShadow{0%{left:110%}60%{left:20%}100%{left:15%}}
.sx-act.sc-boss{background:linear-gradient(#0008,#0004)}
.sx-act .npc{left:2%;bottom:0;height:120px;animation:sxCharaIn .35s cubic-bezier(.3,1.6,.6,1),sxBob .7s .35s ease-in-out infinite}
.sx-act .npc-t{position:absolute;left:34%;right:6px;bottom:14px;background:#fbf3df;color:#1a1210;border:3px solid #1a1210;border-radius:10px;padding:6px 10px;font-weight:900;font-size:14px;animation:sxTalk .25s cubic-bezier(.3,1.6,.6,1)}
.sx-act .npc-t small{display:block;font-size:9px;color:#7a6a5a}
.sx-act .hero.pose{left:30%;bottom:-10px;height:150px;animation:sxPose .5s cubic-bezier(.3,1.6,.6,1) both}
@keyframes sxPose{from{transform:scaleX(-1) scale(.3);opacity:0}}
.sx-act .burst{position:absolute;left:30%;top:10%;width:180px;height:180px;background:conic-gradient(from 0deg,#fff4 0 8deg,transparent 8deg 20deg,#fff4 20deg 28deg,transparent 28deg 40deg,#fff4 40deg 48deg,transparent 48deg 60deg);border-radius:50%;animation:sxSpin 3s linear infinite;z-index:-1}
@keyframes sxSpin{to{transform:rotate(360deg)}}
.sx-act .herd{bottom:20px;height:40px;animation:sxBob .8s ease-in-out infinite}
.sx-act .h0{left:40%}.sx-act .h1{left:55%;animation-delay:-.2s}.sx-act .h2{left:70%;animation-delay:-.4s}.sx-act .h3{left:62%;bottom:44px;height:32px}.sx-act .h4{left:82%;bottom:40px;height:30px}
.sx-act .hero.look{left:6%;height:64px;animation:sxBob .6s ease-in-out infinite}
.sx-act.sc-run~*,.sx-lcd.m-art .sx-bg{}
/* ボス戦 */
.sx-act.boss .hero{left:6%;bottom:8px;height:76px;animation:sxBob .5s ease-in-out infinite}
.sx-act.boss .hero.slash{animation:sxBossSlash .32s ease-out}
@keyframes sxBossSlash{40%{left:44%;transform:scaleX(-1) translateY(-26px) rotate(-30deg)}100%{left:6%;transform:scaleX(-1)}}
.sx-act .bspark{width:120px;height:120px;margin:-60px;background:radial-gradient(circle,#fff 0 10%,#ff3a1a 30%,#a00 50%,transparent 68%)}
.sx-act .bnum{position:absolute;top:30%;font:900 28px monospace;color:#fff;-webkit-text-stroke:2px #a00;animation:sxDmg .7s ease-out forwards}
/* 2026-10-30 ユーザー：第3停止の被弾を、通常の呼吸アニメーションより優先する */
.sx-mon img.hurt,.sx-lcd.pk .sx-mon img.hurt{animation:sxHurt .25s steps(2)}
@keyframes sxHurt{50%{transform:translateX(8px);filter:brightness(3) saturate(0)}}
.sx-mon.roar img{animation:sxRoar .9s ease-out}
@keyframes sxRoar{30%{transform:scale(1.8) translateY(10px)}100%{transform:scale(1)}}
.sx-mon.dead img{animation:sxDead 1.4s ease-in forwards}
@keyframes sxDead{0%{filter:brightness(4)}30%{transform:rotate(-15deg)}100%{transform:translateY(60px) rotate(-90deg);opacity:0}}
.sx-act .claw{position:absolute;width:10px;height:150%;top:-20%;background:linear-gradient(transparent,#fff,#ff3a1a,transparent);transform:rotate(28deg);box-shadow:0 0 10px #f00;animation:sxClaw .4s ease-out both}
.sx-act .c1{left:30%}.sx-act .c2{left:45%;animation-delay:.05s}.sx-act .c3{left:60%;animation-delay:.1s}
@keyframes sxClaw{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0);opacity:.2}}
.sx-act.special{background:radial-gradient(circle at 70% 45%,#ffe84a55,transparent 60%)}
.sx-act .callout{position:absolute;left:6px;top:28px;font:900 26px "M PLUS Rounded 1c";color:#ffe84a;-webkit-text-stroke:2px #a00;animation:sxCutTxt .3s cubic-bezier(.3,1.8,.6,1),sxLamp .2s .3s steps(2) infinite}
.sx-act .bigslash{position:absolute;left:20%;top:45%;width:80%;height:10px;background:linear-gradient(90deg,transparent,#fff,#ffe84a,transparent);transform:rotate(-20deg);box-shadow:0 0 20px #fff;animation:sxSlash .4s ease-out forwards}
.sx-act .boom{position:absolute;left:72%;top:45%;width:220px;height:220px;margin:-110px;border-radius:50%;background:radial-gradient(circle,#fff 0 15%,#ffe84a 30%,#ff6a2a 50%,transparent 70%);animation:sxBoom 1s ease-out forwards}
@keyframes sxBoom{from{transform:scale(.1)}to{transform:scale(2.2);opacity:0}}
.sx-lcd.m-bonus .sx-mon,.sx-lcd.m-quest .sx-mon{right:4%;top:18%;width:52%}
.sx-lcd.m-bonus .sx-mon img,.sx-lcd.m-quest .sx-mon img{height:130px}
/* ボス戦の背景：闘技場の地面・火の粉・ゆれる光（何もない瞬間をつくらない） */
.sx-lcd.m-bonus .sx-bg,.sx-lcd.m-quest .sx-bg{background:radial-gradient(ellipse at 70% 30%,#a0381a,transparent 60%),linear-gradient(#2a0d18,#5a1a1a 58%,#7a4a2a 59%,#3a2010);animation:sxArena 2.4s ease-in-out infinite}
.sx-lcd.m-bonus .sx-bg .pt,.sx-lcd.m-quest .sx-bg .pt{background-image:radial-gradient(#ffb43a 1.5px,transparent 2px),radial-gradient(#ff5a2a 1px,transparent 1.5px);background-size:36px 50px,23px 40px;animation:sxEmber 2.6s linear infinite}
@keyframes sxArena{50%{filter:brightness(1.18)}}
.sx-lcd.m-bonus .sx-mon img,.sx-lcd.m-quest .sx-mon img{animation:sxBreath 1.6s ease-in-out infinite}
@keyframes sxBreath{50%{transform:scale(1.04) translateY(-3px)}}
/* ---- 2026-10-15 ユーザー：ダメージは数字ではなくHPゲージで見せる ---- */
.sx-lcd.m-bonus .sx-mon,.sx-lcd.m-quest .sx-mon{top:30px}
.sx-lcd.m-bonus .sx-hp,.sx-lcd.m-quest .sx-hp{position:absolute;left:-90%;right:0;top:-24px;height:14px;margin:0;border:3px solid #1a1210;border-radius:3px;background:#2a0805;box-shadow:0 2px 0 #000}
.sx-hp i{position:absolute;left:0;top:0;bottom:0;transition:width .25s ease-out;background:linear-gradient(#ff8a5a,#c81e10 60%,#8a0a05)}
.sx-hp s{position:absolute;left:0;top:0;bottom:0;background:#ffe8a0;transition:width .7s .45s ease-in}
.sx-hp.hit{animation:sxHpHit .35s ease-out}
@keyframes sxHpHit{30%{transform:translateX(-5px) scaleY(1.4)}60%{transform:translateX(4px)}}
.sx-dmg,.sx-act .bnum{display:none!important}
/* 攻撃しないゲーム */
.sx-act.wait .hero{animation:sxBob .9s ease-in-out infinite}
.sx-act.w-guard .hero{transform:scaleX(-1) translateY(6px) scale(.95)}
.sx-act.w-prowl~.sx-mon img,.sx-lcd .sx-act.w-prowl+*{}
.sx-act .tension{position:absolute;left:30%;right:30%;top:48%;height:2px;background:linear-gradient(90deg,transparent,#fff8,transparent);animation:sxLamp .8s ease-in-out infinite}
/* リールロック：ガクッ */
.sx-reelbox.jolt{transform:translateY(3px)}
/* リールまわりの光（役の色） */
.sx-reelbox[data-glow]{transition:box-shadow .2s}
.sx-reelbox[data-glow=blue]{box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210,0 0 22px 6px #3a8aff}
.sx-reelbox[data-glow=yellow]{box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210,0 0 22px 6px #ffe84a}
.sx-reelbox[data-glow=red]{box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210,0 0 22px 6px #ff3a2a}
.sx-reelbox[data-glow=green]{box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210,0 0 22px 6px #3ad86a}
.sx-reelbox[data-glow=purple]{box-shadow:inset 0 0 0 2px #fff3c0,0 0 0 3px #1a1210,0 0 22px 6px #b04aff}
.sx[data-frame=purple]::after{border-color:#b04aff;box-shadow:0 0 18px #b04aff,inset 0 0 12px #b04aff}
/* ---- フラッシュを減らす（光過敏への配慮）：点滅はゆっくり・弱く ---- */
.sx-flash.bonus{animation:none;opacity:.25;background:#fff;transition:opacity .4s}
.sx-flash.hit{opacity:.12}.sx-flash.wave{opacity:.08}.sx-flash.white{opacity:.45}
.sx-flash.red,.sx-flash.blue,.sx-flash.yellow{opacity:.18}.sx-flash.zawa{opacity:.25}
.sx[data-frame]::after{animation-duration:.9s!important;animation-timing-function:ease-in-out!important}
.sx-machine.bonus-in,.sx-machine.art-in,.sx-machine.quest-in .sx-lcd{animation:none}
.sx-talk.c-gold,.sx-cut.c-gold,.sx-big.aim,.sx-rare.kche{animation-duration:1s!important}
.sx-rare .bolt{animation:sxBolt 1s ease-in-out 1}
.sx-banner.on{animation:sxBanner .3s ease-out}
.sx-act .callout{animation:sxCutTxt .3s cubic-bezier(.3,1.8,.6,1)}
/* 2026-10-15 上乗せ演出（押忍番長2の上乗せを手本に：溜め → 奥から拳がこっちへ → 画面が割れて数字）。点滅はさせない */
.sx-upfx{position:absolute;inset:0;z-index:5;pointer-events:none;display:none;overflow:hidden}
.sx-upfx.on{display:block;animation:sxUpIn .18s ease-out}
.sx-upfx.out{opacity:0;transition:opacity .25s}
.sx-upfx .fire{position:absolute;inset:-20%;background:radial-gradient(ellipse at 50% 110%,#ffd84a 0,#ff7a1a 22%,#c2200a 45%,#2a0604 75%);animation:sxUpFire .9s ease-in-out infinite alternate}
.sx-upfx.hot .fire{background:radial-gradient(ellipse at 50% 110%,#fff3b0 0,#ffcf3a 20%,#ff5a1a 42%,#5a0a04 75%)}
.sx-upfx .lines{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 46%,#fff4 0,#fff0 60%)} /* 2026-10-30 放射状の線をやめ、やわらかい光に（ユーザー：日章旗のような光線はいや） */
.sx-upfx .brush{position:absolute;left:0;right:0;top:6%;text-align:center;font:900 40px "Zen Maru Gothic",serif;color:#fff;-webkit-text-stroke:2px #1a0604;letter-spacing:.1em;animation:sxUpBrush .32s cubic-bezier(.2,1.6,.5,1) both}
.sx-upfx .fist{position:absolute;left:50%;top:58%;height:42%;transform:translate(-50%,-50%) scale(.55);filter:brightness(.55) drop-shadow(0 0 6px #000);transition:transform .35s ease-out,filter .35s}
.sx-upfx.wind .fist{transform:translate(-50%,-46%) scale(.48) rotate(-8deg);filter:brightness(.8) drop-shadow(0 0 8px #ff0)}
.sx-upfx.punch .fist{transform:translate(-50%,-50%) scale(4.2);filter:brightness(1.1) blur(1.5px);transition:transform .17s cubic-bezier(.6,0,.9,.4),filter .17s;opacity:.92}
.sx-upfx.punch .brush{opacity:0}
.sx-upfx .crack{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#fff;stroke-width:.9;filter:drop-shadow(0 0 1px #000);animation:sxUpCrack .12s ease-out both}
.sx-upfx .crack circle{fill:#fff8;stroke:#fff}
.sx-upfx .num{position:absolute;left:0;right:0;top:20%;text-align:center;font:900 76px/1 "M PLUS Rounded 1c";color:#ffe23a;-webkit-text-stroke:3px #5a1000;text-shadow:0 4px 0 #000;animation:sxUpNum .35s cubic-bezier(.2,1.8,.5,1) both}
.sx-upfx.hot .num{background:linear-gradient(180deg,#fff 0,#ffe23a 40%,#ff8a1a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-upfx .num i{font-style:normal;font-size:.6em;vertical-align:.25em}
.sx-upfx .num small{font-size:.45em}
.sx-upfx .txt{position:absolute;left:0;right:0;bottom:10%;text-align:center;font:900 30px "Zen Maru Gothic",serif;color:#fff;-webkit-text-stroke:2px #a00;letter-spacing:.3em;animation:sxUpBrush .3s .15s cubic-bezier(.2,1.6,.5,1) both}
@keyframes sxUpIn{from{opacity:0}to{opacity:1}}
@keyframes sxUpFire{from{transform:scale(1) translateY(0)}to{transform:scale(1.06) translateY(-3%)}}
@keyframes sxUpSpin{to{transform:rotate(360deg)}}
@keyframes sxUpBrush{from{transform:rotate(-6deg) scale(2.2);opacity:0}to{transform:rotate(-6deg) scale(1);opacity:1}}
@keyframes sxUpCrack{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes sxUpNum{0%{transform:scale(3);opacity:0}60%{transform:scale(.9);opacity:1}100%{transform:scale(1)}}
/* 一撃撃破（どの役でも低い確率）：虹 */
.sx-act.oneshot .rainbow-bg{position:absolute;inset:0;background:linear-gradient(120deg,#f336,#fa36,#ff36,#3f66,#3cf6,#a6f6);background-size:300% 100%;animation:sxRbMove 1.6s linear infinite}
.sx-act .callout.rb{background:linear-gradient(90deg,#f33,#fa3,#ff3,#3f6,#3cf,#a6f);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px #fff;font-size:34px}
@keyframes sxRbMove{to{background-position:300% 0}}
/* ボス登場（★が多いほど出にくく、倒しやすい・ごほうびが多い） */
.sx-big.boss{color:#fff;font-size:24px;line-height:1.25}.sx-big.boss small{display:block;font-size:20px;color:#ffd84a;letter-spacing:.1em}
.sx-big.boss.b3 small{color:#ff8a3a}.sx-big.boss.b4 small{background:linear-gradient(90deg,#f33,#fa3,#ff3,#3f6,#3cf,#a6f);-webkit-background-clip:text;background-clip:text;color:transparent}
.sx-upfx .fist{height:56%}
.sx-upfx.hit .fist{opacity:0;transition:opacity .22s}
.sx-upfx .call{position:absolute;left:0;right:0;bottom:6%;text-align:center;font:900 20px "M PLUS Rounded 1c";color:#ffe84a;-webkit-text-stroke:1.5px #5a1000;animation:sxUpBrush .25s both}
.sx-upfx.punch .brush{animation:none;opacity:0;transition:opacity .1s}
.sx-upfx.hot .num{text-shadow:none;filter:drop-shadow(0 4px 0 #000)}
/* ドアップのパンチ（ev_up_punch）：奥から手前へ寄って、当たった瞬間に引く */
.sx-upfx .pz{position:absolute;left:50%;top:50%;width:120%;transform:translate(-50%,-50%) scale(.35);opacity:0;animation:sxUpPz .42s cubic-bezier(.7,0,.9,.5) forwards}
.sx-upfx.punch .fist{opacity:0;transition:opacity .1s}
.sx-upfx.hit .pz{animation:none;transform:translate(-50%,-50%) scale(1.5);opacity:0;transition:opacity .3s,transform .3s}
@keyframes sxUpPz{0%{transform:translate(-50%,-50%) scale(.35);opacity:0}25%{opacity:1}100%{transform:translate(-50%,-50%) scale(1.25);opacity:1}}
.sx-upfx .pz{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 62%,#0000 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 62%,#0000 100%)}
/* 2026-10-15 液晶の背景（チャッピー）。ゆっくり左右に流して、止まった画面にしない */
.sx-lcd.st0 .sx-bg{background:url(art/bg/slot_kunren.jpg) 0 50%/auto 112% no-repeat}
.sx-lcd.st1 .sx-bg{background:url(art/bg/slot_gake.jpg) 0 50%/auto 112% no-repeat}
.sx-lcd.st2 .sx-bg{background:url(art/bg/slot_kazan.jpg) 0 50%/auto 112% no-repeat}
.sx-lcd.st3 .sx-bg{background:url(art/bg/slot_mori.jpg) 0 50%/auto 112% no-repeat}
.sx-lcd.st0 .sx-bg,.sx-lcd.st1 .sx-bg,.sx-lcd.st2 .sx-bg,.sx-lcd.st3 .sx-bg,.sx-lcd.st5 .sx-bg{animation:sxBgPan 38s ease-in-out infinite alternate}
@keyframes sxBgPan{from{background-position:0 50%}to{background-position:100% 50%}}
.sx-lcd.st5 .sx-bg{background:url(art/bg/slot_kessen.jpg) 0 50%/auto 112% no-repeat}
.sx-lcd.st4 .sx-bg{background:url(art/bg/slot_rush.jpg) 0 50%/auto 112% no-repeat;animation:sxBgPan 24s ease-in-out infinite alternate}
.sx-lcd.st5.m-bonus .sx-bg,.sx-lcd.st5.m-quest .sx-bg{background:url(art/bg/slot_kessen.jpg) 0 50%/auto 112% no-repeat;animation:sxBgPan 30s ease-in-out infinite alternate}
.sx-lcd.st4.m-art .sx-bg,.sx-lcd.st4.m-tokka .sx-bg{background:url(art/bg/slot_rush.jpg) 0 50%/auto 112% no-repeat;animation:sxBgPan 24s ease-in-out infinite alternate}
.sx-big.logo{background:none;-webkit-text-stroke:0}.sx-big.logo img{display:block;width:min(96%,360px);margin:auto;filter:drop-shadow(0 4px 6px #000a);animation:sxUpNum .45s cubic-bezier(.2,1.6,.5,1) both}
/* 2026-10-15 操作盤の部品（チャッピー） */
.sx-stop{background:url(art/slot/btn_stop.png) center/contain no-repeat!important;border:0!important;border-radius:0;box-shadow:none!important;filter:drop-shadow(0 3px 0 #0008)}
.sx-stop.lit{background-image:url(art/slot/btn_stop_on.png)!important;filter:drop-shadow(0 0 8px #ffb43a)}
.sx-stop.pressed{transform:translateY(3px) scale(.96);filter:none}
.sx-bet{background:url(art/slot/btn_bet.png) center/contain no-repeat!important;border:0!important;box-shadow:none!important;color:transparent!important;filter:drop-shadow(0 3px 0 #0008)}
.sx-bet:active{transform:translateY(3px)}
.sx-lever::before{display:none}
.sx-lever{background:url(art/slot/btn_lever.png) center 4px/auto 78px no-repeat;transform-origin:50% 90%;transition:transform .12s}
.sx-lever:has(.sx-knob.down){transform:scaleY(.82)}
.sx-knob{opacity:0}
.sx-push{background:url(art/slot/btn_push.png) center/contain no-repeat!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:transparent!important;width:120px!important;height:68px!important}
/* カットインの枠（チャッピー）。絵が斜めなので skew はやめる */
.sx-cut{transform:none;border:0!important;background-color:transparent!important;background-size:100% 100%!important;background-repeat:no-repeat!important;height:46%;top:28%}
.sx-cut.c-blue{background-image:url(art/slot/cut_blue.png)!important}
.sx-cut.c-red{background-image:url(art/slot/cut_red.png)!important}
.sx-cut.c-gold{background-image:url(art/slot/cut_gold.png)!important}
.sx-cut img{height:105%;margin-left:6%}
/* 液晶の飾り枠（チャッピー）。四隅の金具は大きく、辺はくり返し */
.sx-lcd::after{content:'';position:absolute;inset:0;z-index:30;pointer-events:none;border:22px solid transparent;border-image:url(art/slot/frame.png) 27% round}
.sx-lcd{border-color:transparent!important;box-shadow:none!important}
.sx-lcd::after{border-width:34px}
/* 飾り枠の内側に表示を寄せる */
.sx-mode{left:20px;right:20px;top:16px}
.sx-ticket{left:24px;top:40px}
.sx-stage{left:24px;bottom:18px}
.sx-lcd .sx-data-t{z-index:31}
#sl-host .sx-data{right:26px;top:24px;z-index:40}
.sx-ticket{top:48px}
/* 2026-10-15 ユーザー：液晶の主人公と敵が小さくてしょぼい → 液晶の高さに合わせて大きく（cqh＝液晶の高さの%） */
.sx-lcd{container-type:size}
.sx-act .hero{height:46cqh;bottom:4cqh}
.sx-act.navi .hero{left:2%}
.sx-act .hero.run{height:52cqh}
.sx-act .hero.look{height:48cqh}
.sx-act .hero.pose{height:92cqh;left:24%;bottom:-8cqh}
.sx-act.boss .hero{height:56cqh;bottom:2cqh;left:2%}
.sx-act.navi .foe{height:36cqh;bottom:14cqh}
.sx-mon{top:10cqh;right:2%;width:58%}
.sx-mon img{height:62cqh}
.sx-lcd.m-bonus .sx-mon,.sx-lcd.m-quest .sx-mon{top:8cqh;right:0;width:62%}
.sx-lcd.m-bonus .sx-mon img,.sx-lcd.m-quest .sx-mon img{height:74cqh;filter:drop-shadow(0 6px 8px #000a)}
.sx-scene .amb{height:30cqh}
.sx-scene .amb.run,.sx-scene .amb.hop,.sx-scene .amb.fly,.sx-scene .amb.float{height:26cqh}
.sx-scene .amb.birds{height:6cqh;width:12cqh}
/* 上乗せ：殴ったあと（2026-10-15 派手に） */
.sx.shake.big{animation:sxShakeBig .06s steps(2) infinite}
@keyframes sxShakeBig{0%{transform:translate(-5px,3px)}50%{transform:translate(5px,-4px)}}
.sx-upfx{container-type:size}
.sx-upfx.hit .fire{filter:brightness(1.25) saturate(1.3)}
.sx-upfx .rays{position:absolute;left:50%;top:44%;width:240cqw;height:240cqw;margin:-120cqw 0 0 -120cqw;background:radial-gradient(circle,#fff6b0cc 0,#fff6b055 22%,#fff0 50%);border-radius:50%;animation:sxFadeIn .25s ease-out both}
.sx-upfx.hot .rays{background:radial-gradient(circle,#fff0c0dd 0,#ff9a6a77 18%,#8ad0ff33 34%,#fff0 50%)}
@keyframes sxRays{to{transform:rotate(360deg)}}
@keyframes sxFadeIn{from{opacity:0;transform:scale(.4)}}
.sx-upfx .wave{position:absolute;left:50%;top:44%;width:20cqw;height:20cqw;margin:-10cqw 0 0 -10cqw;border-radius:50%;border:4cqw solid #fff;opacity:0;animation:sxWave .7s ease-out forwards}
.sx-upfx .wave.w2{animation-delay:.12s;border-color:#ffe23a}.sx-upfx .wave.w3{animation-delay:.24s;border-color:#ff8a3a}
@keyframes sxWave{0%{opacity:1;transform:scale(.3)}100%{opacity:0;transform:scale(7);border-width:.4cqw}}
.sx-upfx .shard{position:absolute;left:50%;top:44%;width:7cqw;height:10cqw;background:linear-gradient(135deg,#fff,#cfe8ff 60%,#8ab);clip-path:polygon(50% 0,100% 40%,70% 100%,0 70%);transform:translate(-50%,-50%);animation:sxShard .8s cubic-bezier(.2,.8,.4,1) forwards}
@keyframes sxShard{to{transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(var(--d) * -1)) rotate(var(--r)) scale(var(--s));opacity:0}}
.sx-upfx .spark{position:absolute;left:50%;top:44%;width:2cqw;height:2cqw;border-radius:50%;background:#fff6c0;box-shadow:0 0 2cqw #ffb43a;animation:sxSpark var(--t) ease-out forwards}
.sx-upfx .spark.gold{width:3.4cqw;height:3.4cqw;background:radial-gradient(#fff,#ffd84a 50%,#c88a10);border-radius:50% 50% 50% 50%/40% 40% 60% 60%}
@keyframes sxSpark{0%{transform:rotate(var(--a)) translateY(0) scale(1.4)}100%{transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(.3);opacity:0}}
.sx-upfx .bolt{position:absolute;top:-5%;width:14cqw;height:70%;background:linear-gradient(#fff,#ffe23a);clip-path:polygon(40% 0,70% 0,52% 38%,78% 38%,30% 100%,44% 52%,20% 52%);filter:drop-shadow(0 0 2cqw #ffd84a);animation:sxBolt .5s ease-out both}
.sx-upfx .bolt.b1{left:6%}.sx-upfx .bolt.b2{right:6%;animation-delay:.15s;transform:scaleX(-1)}
@keyframes sxBolt{0%{opacity:0;transform:translateY(-30%)}30%{opacity:1;transform:none}100%{opacity:.85}}
.sx-upfx .num{z-index:3;font-size:30cqh;top:16%;filter:drop-shadow(0 0 3cqw #ffb43a) drop-shadow(0 6px 0 #000)}
.sx-upfx .num span{display:inline-block;min-width:1.2em}
.sx-upfx .num.land{animation:sxLand .45s cubic-bezier(.2,1.8,.4,1) both}
@keyframes sxLand{0%{transform:scale(1.9)}55%{transform:scale(.88)}100%{transform:scale(1)}}
.sx-upfx .txt{z-index:3;font-size:13cqh;bottom:8%;color:#fff3a0;-webkit-text-stroke:3px #a00;filter:drop-shadow(0 4px 0 #000)}
.sx-upfx .crack{z-index:2;stroke-width:1.4}
.sx-lcd.m-bonus .sx-hp,.sx-lcd.m-quest .sx-hp{top:74cqh;left:2%;right:12%;height:4.5cqh}
/* ナビの盾は小さく下へ。敵とコマは盾の上に立つ（2026-10-15 シミュレータで重なっていた） */
.sx-navi{bottom:3cqh!important;top:auto!important}
.sx-navi b{width:15cqh;height:15cqh;font-size:10cqh;line-height:15cqh}
.sx-act.navi .foe{bottom:20cqh;height:34cqh}
.sx-act.navi .hero{bottom:18cqh;height:40cqh}
.sx-act.navi .f0{left:calc(19% - 15cqh)}.sx-act.navi .f1{left:calc(50% - 15cqh)}.sx-act.navi .f2{left:calc(81% - 15cqh)}
.sx-act.navi .hero{left:-9%;height:36cqh;z-index:2}
/* 液晶の飾り枠は本物の要素で（iPhone で ::after の枠が消えたため） */
.sx-lcd::after{content:none}
.sx-frame{position:absolute;inset:0;z-index:30;pointer-events:none;border:34px solid transparent;border-image:url(art/slot/frame.png) 27% round}
.sx-act.navi .hero{left:-2%}
/* BET：押すとへこんで点く。BET していないのにレバーを引くと BET がうながす */
.sx-bet.on{transform:translateY(3px);filter:drop-shadow(0 0 8px #ffd84a) brightness(1.15)}
.sx-bet.nudge{animation:sxNudge .5s ease-out}
@keyframes sxNudge{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
.sx-lever.ready{filter:drop-shadow(0 0 6px #ffb43a)}
/* レバー：真横から見た絵。引くと下にずれた絵に替わる（2026-10-15 ユーザー） */
.sx-lever{background:url(art/slot/btn_lever.png) left center/contain no-repeat;transform:none!important;min-width:76px}
.sx-lever.pull{background-image:url(art/slot/btn_lever_down.png)}
.sx-lever::after{content:'';position:absolute;width:0;height:0;background:url(art/slot/btn_lever_down.png)} /* 先読み */
.sx-lever small{display:none}
.sx-lever{min-width:96px;height:92px;background-size:auto 100%;background-position:left center}
.sx-lever{position:relative;z-index:3;min-width:104px}
/* レバー：台を正面から見た絵（2026-10-15 ユーザー） */
.sx-lever{min-width:84px;background-position:center center;background-size:contain}
/* 窓の枠の紙垂が見出しにかからないように、中身を紙垂の下から始める（2026-10-16 ユーザー：ショップの見出しが見づらすぎる） */
.modal{padding-top:58px}
/* タイトルの一枚絵：コマとノボリのにらみ合い（2026-10-16 ユーザー） */
.ts-key{object-position:50% 60%}
/* タイトルロゴを大きく、迫力を出す（2026-10-17 ユーザー） */
.ts-logo{top:6%;width:min(98vw,760px);transform:translateX(-50%) rotate(-4deg)}
.ts-logo img{filter:drop-shadow(0 0 18px #ff7a1acc) drop-shadow(0 8px 0 #2a1f16) drop-shadow(0 0 3px #000);animation:tsLogoIn .7s cubic-bezier(.2,1.6,.4,1) both,tsLogoBeat 2.4s ease-in-out 1s infinite}
@keyframes tsLogoIn{0%{transform:scale(2.6);opacity:0}55%{transform:scale(.92);opacity:1}75%{transform:scale(1.06)}100%{transform:scale(1)}}
@keyframes tsLogoBeat{0%,100%{transform:scale(1)}8%{transform:scale(1.05)}16%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){.ts-logo img{animation:none}}
/* 2段組みのロゴ（2026-10-17） */
.ts-logo{top:3%;width:min(86vw,560px);transform:translateX(-50%) rotate(-3deg)}
/* ロゴをさらに大きく（2026-10-17 ユーザー） */
.ts-logo{top:.5%;width:min(100vw,680px)}
/* 2026-10-20 ユーザー：スマホ（縦長）だとロゴが大きすぎてコマとノボリにかぶる → ロゴを小さく、絵の顔を下へ */
@media (max-aspect-ratio: 3/4){.ts-logo{top:1%;width:min(74vw,420px)}}
/* 2026-10-20 ユーザー：タイトルロゴは動かさない */
.ts-logo img{animation:none}
/* 黄の国の修行「時成通り」（2026-10-21）。帳場の木札と、相場の板 */
.su-place{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px 0 10px}
.su-place .gchoice.on{outline:4px solid var(--gold);background:#fff4cc}
.mk-purse{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;background:#5a3b22;color:#fbefd3;border:var(--line);box-shadow:0 4px 0 var(--ink);padding:8px 10px;margin-bottom:6px;font-weight:900}
.mk-purse .ico{width:22px;height:22px;vertical-align:-5px;margin-right:2px}
.mk-money b{font-size:20px;color:#ffe08a}
.mk-credit{display:flex;align-items:center;gap:4px}.mk-credit .gauge{width:70px;height:10px;background:#2c1d10;border:2px solid #fbefd3;display:inline-block}.mk-credit .gauge i{display:block;height:100%;background:#e0a91a}
.mk-shelf,.mk-sales{font-size:13px}
.mk-help{font-size:12px;font-weight:700;color:#6d5a40;margin:0 0 8px}
.mk-good{min-height:0}
.mk-good .train-name{font-size:18px;display:flex;align-items:baseline;gap:6px}
.mk-kind{font-size:11px;font-weight:900;color:#fff;background:#6d5a40;padding:0 5px}
.mk-price{font-size:13px;font-weight:900}.mk-price b{font-size:17px}
.mk-price i{font-style:normal;font-size:11px;margin-left:4px;padding:0 4px;border:2px solid var(--ink)}
.mk-up{background:#d9482b;color:#fff}.mk-down{background:#3d7fc4;color:#fff}.mk-flat{background:#efe3c4}
.mk-price em{font-style:normal;margin-left:4px;background:var(--gold);border:2px solid var(--ink);padding:0 4px;font-size:11px}
.mk-good.mk-fair{box-shadow:0 5px 0 var(--ink),0 0 0 3px var(--gold) inset}
.mk-stock{font-size:13px;font-weight:900}.mk-stock small{font-weight:700;margin-left:4px;color:#6d5a40}
.mk-none{font-size:11px;color:#8a7a5c}
.mk-btns{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto}
.mk-btns .btn{padding:4px 6px;font-size:13px;line-height:1.1}.mk-btns .btn small{display:block;font-size:10px}
@media (max-width:720px){.su-place{grid-template-columns:1fr}.mk-goods{grid-template-columns:1fr 1fr}}
.mk-price{white-space:nowrap}.mk-price i,.mk-price em{font-size:10px}@media (max-width:720px){.mk-good .train-name{font-size:16px}.mk-help{font-size:11px}}
/* ==== 修行の画面 v2（2026-10-21）：場面の絵の上に、その国の物でできた部品を置く ==== */
.page-training main,.tr{--tr-ink:#2a1f16}
.tr{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.tr-top{display:flex;justify-content:flex-end;gap:6px}
.tr-scene{position:relative;aspect-ratio:16/9;background:#2a1f16 center 60%/cover no-repeat;border:3px solid var(--tr-ink);box-shadow:0 5px 0 var(--tr-ink);overflow:hidden}
.tr-date{position:absolute;left:2%;top:4%;width:31%;display:flex;align-items:center;justify-content:center;gap:2px;color:#fff;font-weight:900;text-shadow:0 2px 0 #5a1d10,0 0 3px #5a1d10;z-index:3}
.tr-date small{font-size:clamp(10px,2.6vw,15px);margin-right:4px}.tr-date b{font-size:clamp(24px,7vw,40px);line-height:1}.tr-date span{font-size:clamp(11px,2.8vw,16px)}
.tr-yellow .tr-date{width:17%;flex-direction:column;gap:0;color:#5a3b22;text-shadow:0 1px 0 #fff;padding-left:6%;padding-top:5%}
.tr-yellow .tr-date small{margin:0;font-size:clamp(8px,2vw,12px)}.tr-yellow .tr-date b{font-size:clamp(18px,5vw,30px)}.tr-yellow .tr-date span{font-size:clamp(8px,2vw,12px)}
.tr-count{position:absolute;right:2%;top:5%;background:#fbefd3;border:3px solid var(--tr-ink);box-shadow:0 3px 0 var(--tr-ink);padding:2px 10px;font-weight:900;font-size:clamp(11px,3vw,16px);z-index:3}
.tr-count.now{background:var(--red);color:#fff;animation:wob .6s ease-in-out infinite alternate}
.tr-cast{position:absolute;left:0;right:0;bottom:15%;height:62%}
.tr-cast .mon-img,.tr-cast svg{height:100%;width:auto;filter:drop-shadow(0 4px 0 rgba(42,31,22,.45))}
.tr-hero{position:absolute;left:30%;bottom:0;height:100%;transform:translateX(-50%)}
.tr-mate{position:absolute;bottom:4%;height:68%}.tm-0{left:56%}.tm-1{left:76%}
.tr-stam{position:absolute;left:2%;right:2%;bottom:3%;display:flex;align-items:center;gap:6px;z-index:3}
.tr-stam-l,.tr-stam b{font-weight:900;color:#fff;text-shadow:0 2px 0 var(--tr-ink),0 0 3px var(--tr-ink);font-size:clamp(12px,3.2vw,17px)}
.tr-tube{position:relative;flex:1;height:clamp(22px,6vw,36px)}
.tr-tube i{position:absolute;left:10.5%;top:33%;bottom:27%;max-width:82.5%;background:linear-gradient(#ffd25a,#f08a24);border-radius:20px;transition:width .4s}
.tr-tube.y i{left:9%;top:26%;bottom:26%;max-width:82%;border-radius:3px;background:#e0a91a}
.tr-stam.low .tr-tube i{background:#d9482b}
.tr-retry{position:absolute;right:2%;top:19%;font-size:11px;font-weight:900;color:#fff;text-shadow:0 1px 0 var(--tr-ink),0 0 3px var(--tr-ink);display:flex;align-items:center;gap:3px;z-index:3}
.tr-retry i{width:10px;height:10px;transform:rotate(45deg);background:#6d5a40;border:2px solid var(--tr-ink)}.tr-retry i.on{background:var(--gold)}
.tr-note{background:#fbefd3;border:3px solid var(--tr-ink);box-shadow:0 3px 0 var(--tr-ink);padding:5px 8px;font-size:13px;font-weight:700}
.tr-note b{background:var(--tr-ink);color:#fbefd3;padding:0 6px;margin-right:8px}.tr-note.fight b{background:var(--red)}
.tr-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.tr-st{position:relative;aspect-ratio:348/120;display:flex;align-items:center;justify-content:center;gap:4px;font-weight:900;background-size:100% 100%}
.tr-st span{font-size:clamp(9px,2.2vw,12px);color:#6d5a40}.tr-st b{font-size:clamp(13px,3.6vw,19px)}
.tr-st em{position:absolute;right:2px;top:-8px;font-style:normal;font-size:10px;background:var(--c,#d9482b);color:#fff;border:2px solid var(--tr-ink);padding:0 3px}
.tr-st.st-hp{--c:var(--hp)}.tr-st.st-atk{--c:var(--atk)}.tr-st.st-def{--c:var(--def)}.tr-st.st-spd{--c:var(--spd)}.tr-st.st-hit{--c:var(--hit)}.tr-st.st-spi{--c:var(--spi)}
.tr-skills{display:flex;gap:4px}.tr-skills i{flex:1;font-style:normal;text-align:center;font-size:12px;font-weight:900;background:#fbefd3;border:2px solid var(--tr-ink);padding:2px}.tr-skills i.empty{color:#a8977a;border-style:dashed}
.tr-board{border-style:solid;padding:6px 4px 4px}
.tr-board.red{border-width:34px 24px 22px;border-image:url(art/ui/tr/red_board_v2.png) 100 70 64 70 fill / 34px 24px 22px stretch}
.tr-board.yellow{border-width:30px 22px 22px;border-image:url(art/ui/tr/yellow_board.png) 86 76 70 76 fill / 30px 22px 22px stretch}
.tr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 6px;position:relative}
.tr .train.tr-card{min-height:0;padding:0;border:0;box-shadow:none;background-color:transparent;border-radius:0;display:block;position:relative;filter:drop-shadow(0 4px 0 rgba(42,31,22,.55))}
.tr .train.tr-card::before{display:none}
.tr .train.tr-card.boost{filter:drop-shadow(0 0 6px #ffd25a) drop-shadow(0 4px 0 rgba(42,31,22,.55))}
.tr .train.tr-card.reso{filter:drop-shadow(0 0 8px #ff7a2a) drop-shadow(0 4px 0 rgba(42,31,22,.55));animation:wob .7s ease-in-out infinite alternate}
.tr .train.tr-card:active{transform:translateY(3px)}
.tr-mates{position:absolute;right:4%;top:14%;display:flex;flex-direction:column;gap:2px;z-index:2}
.tr-face{position:relative;width:clamp(24px,6.5vw,34px);height:clamp(24px,6.5vw,34px);border-radius:50%;background:#fbefd3;border:2px solid var(--tr-ink);overflow:hidden;display:block}
.tr-face .mon-img,.tr-face svg{width:100%;height:100%;object-fit:cover}
.tr-face.lit{border-color:#ff7a2a;box-shadow:0 0 0 2px #ffd25a}
.tr-face u{position:absolute;right:-2px;top:-2px;background:var(--red);color:#fff;font-size:9px;text-decoration:none;border-radius:50%;width:12px;height:12px;line-height:12px;text-align:center}
.tr-low{position:absolute;left:9%;right:9%;top:55%;bottom:5%;display:flex;flex-direction:column;align-items:center;gap:2px}
.tr-name{height:clamp(16px,4.6vw,26px);width:auto}
.tr-gain{display:flex;flex-wrap:wrap;justify-content:center;gap:2px}
.tr-gain .g{font-size:clamp(9px,2.3vw,12px);font-weight:900;background:#fff;border:1.5px solid var(--tr-ink);padding:0 2px;line-height:1.25}
.tr-gain .g b{margin-left:1px}.tr-gain.none{font-size:10px;color:#8a7a5c;font-weight:700;text-align:center}
.tr-cost{margin-top:auto;font-size:clamp(8px,2.1vw,11px);font-weight:900;color:#6d5a40}.tr-cost em{font-style:normal;color:#fff;background:var(--red);padding:0 3px;margin-left:3px}
.tr-subs{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.tr-subs .btn{text-align:left}
.tr-last{background:#fbefd3;border:3px solid var(--tr-ink);box-shadow:0 4px 0 var(--tr-ink);padding:6px 10px;display:flex;flex-direction:column}
.tr-last b{font-size:16px}.tr-last span{font-size:13px;font-weight:700}.tr-last.bad{background:#e9dfd2}
.tr-team{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.tr-tm{display:flex;flex-direction:column;align-items:center;gap:1px;font-size:10px}
.tr-tm b{font-size:clamp(8px,2.2vw,11px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tr-tm-face{position:relative;width:100%;aspect-ratio:235/226;display:block}
.tr-tm-face .mon-img,.tr-tm-face svg{position:absolute;left:19%;top:19%;width:62%;height:62%;object-fit:cover;border-radius:50%}
.tr-tm-face.y{aspect-ratio:1;border-radius:50%;background:#e9c77a;border:3px solid #8a5a1c;box-shadow:inset 0 0 0 2px #fbe7a8}
.tr-tm-face.y .mon-img,.tr-tm-face.y svg{left:8%;top:8%;width:84%;height:84%}
.tr-tm.lit .tr-tm-face{filter:drop-shadow(0 0 5px #ffd25a)}
.tr-bond{width:90%;height:6px;background:#5a3b22;border:1.5px solid var(--tr-ink)}.tr-bond i{display:block;height:100%;background:#e0a91a}.tr-tm.lit .tr-bond i{background:#ff7a2a}
/* 黄の国 */
.tr-purse{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;background:#5a3b22;color:#fbefd3;border:3px solid var(--tr-ink);box-shadow:0 4px 0 var(--tr-ink);padding:6px 10px;font-weight:900}
.tr-money .ico{width:22px;height:22px;vertical-align:-5px;margin-right:2px}.tr-money b{font-size:22px;color:#ffe08a;margin-left:4px}
.tr-credit{display:flex;align-items:center;gap:4px}.tr-hex{position:relative;display:inline-block;width:130px;aspect-ratio:451/130}
.tr-hex i{position:absolute;top:38%;width:11%;aspect-ratio:1;transform:translate(-50%,-50%);clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);background:transparent}
.tr-hex i.on{background:#e0a91a}.tr-hex i.half{background:#f3d88a}
.tr-shelf{font-size:13px}
.tr-help{margin:0 0 6px;font-size:11px;font-weight:700;color:#6d5a40;text-align:center}
.tr-grid.mk{gap:10px 6px}
.tr-crate-wrap{display:flex;flex-direction:column;align-items:center;gap:3px}
.tr-crate{position:relative;width:100%;filter:drop-shadow(0 4px 0 rgba(42,31,22,.5))}
.tr-crate-wrap.boost .tr-crate{filter:drop-shadow(0 0 6px #ffd25a) drop-shadow(0 4px 0 rgba(42,31,22,.5))}
.tr-crate-wrap.reso .tr-crate{filter:drop-shadow(0 0 8px #ff7a2a) drop-shadow(0 4px 0 rgba(42,31,22,.5))}
.tr-crate .tr-mates{left:2%;right:auto;top:-6%;flex-direction:row}
.tr-ptag{position:absolute;right:-4%;top:-4%;width:58%;display:flex;align-items:center;justify-content:center;gap:2px;padding-left:12%;transform:rotate(8deg)}
.tr-ptag b{font-size:clamp(10px,2.8vw,15px)}.tr-ptag i{font-style:normal;font-size:9px}.tr-ptag i.up{color:#d9482b}.tr-ptag i.down{color:#3d7fc4}
.tr-fair{position:absolute;left:-2%;bottom:30%;background:var(--red);color:#fff;font-weight:900;font-size:11px;border:2px solid var(--tr-ink);padding:0 4px;transform:rotate(-8deg)}
.tr-stock{position:absolute;left:50%;bottom:7%;transform:translateX(-50%);font-weight:900;font-size:clamp(14px,4vw,22px);color:#fff;text-shadow:0 2px 0 var(--tr-ink),0 0 3px var(--tr-ink)}.tr-stock small{font-size:10px}
.tr-gname{font-size:clamp(12px,3.3vw,16px);font-weight:900;text-align:center;line-height:1.1}.tr-gname small{display:block;font-size:10px;color:#6d5a40}
.tr-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:3px}
.tr-btn{position:relative;font:inherit;font-weight:900;font-size:12px;line-height:1.1;padding:3px 6px 3px;border:2.5px solid var(--tr-ink);box-shadow:0 3px 0 var(--tr-ink);background:#fbefd3;color:var(--tr-ink);display:flex;align-items:center;gap:3px;cursor:pointer}
.tr-btn small{display:block;font-size:9px}.tr-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--tr-ink)}
.tr-btn.sell{background:#d9482b;color:#fff}.tr-btn.haggle{background:#efe3c4;font-size:10px}
.tr-btn:disabled{opacity:.45;cursor:default}
.tr-ico{width:22px;aspect-ratio:278/169;display:inline-block}.tr-btn.sell .tr-ico{aspect-ratio:329/154}
@media (min-width:721px){.tr-stats{grid-template-columns:repeat(6,1fr)}}
@media (max-width:420px){.tr-stats{grid-template-columns:repeat(3,1fr)}.tr-hex{width:100px}}
.tr-tube.y i{background:#6fbf3f;box-shadow:inset 0 -3px 0 #3f8a24}
.tr-btns{display:grid;grid-template-columns:1fr auto;gap:3px;width:100%}
.tr-btn{white-space:nowrap;justify-content:center;font-size:11px;padding:3px 4px}
.tr-btn.sell,.tr-btn.haggle{grid-column:1/-1}
.tr-btn.sell{font-size:13px;padding:4px}
.tr-btn small{display:inline;margin-left:3px}
.tr-subs{grid-template-columns:repeat(3,1fr)}
.tr-subs .btn{min-height:0;height:auto;padding:10px 10px 8px;font-size:14px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}
.tr-subs .btn .moji{height:28px;width:auto;max-width:100%}
.tr-subs .btn small{font-size:10px;line-height:1.25}
.tr-subs .btn b{font-size:15px}
.tr-gain .g{color:var(--tr-ink)!important;background:#fffaf0!important;border-left:5px solid var(--c,#999)!important}
.tr-gain .g-hp{--c:var(--hp)}.tr-gain .g-atk{--c:var(--atk)}.tr-gain .g-def{--c:var(--def)}.tr-gain .g-spd{--c:var(--spd)}.tr-gain .g-hit{--c:var(--hit)}.tr-gain .g-spi{--c:var(--spi)}.tr-gain .g-leaf{--c:#6fbf3f}
.tr-card .tr-mates{right:-7%;top:12%;gap:1px}
.tr-card .tr-face{width:clamp(20px,5.6vw,28px);height:clamp(20px,5.6vw,28px)}
.tr-low{top:57%;bottom:9%}
.tr-card .tr-cost{position:absolute;left:3%;top:9%;margin:0;background:#5a3b22;color:#fbefd3;border:2px solid var(--tr-ink);padding:0 3px;font-size:clamp(8px,2.2vw,11px);transform:rotate(-6deg);display:flex;flex-direction:column;align-items:center;line-height:1.15}
.tr-card .tr-cost em{margin:0}
.tr-subs{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
/* ==== 修行のメイン画面 v3（2026-10-21）：スクロールなしで1画面に収める ==== */
.tr{height:calc(100dvh - var(--tr-off,58px));min-height:520px;gap:5px;overflow:hidden}
.tr-top{flex:0 0 auto;gap:4px}.tr-top .btn{padding:2px 10px;font-size:12px;min-height:0}
.tr-scene{flex:0 0 auto;aspect-ratio:auto;height:min(31dvh,58vw);background-position:center 62%}
.tr-cast{bottom:16%;height:66%}
.tr-note{position:absolute;left:2%;top:31%;z-index:3;max-width:62%;padding:2px 6px;font-size:11px;box-shadow:0 2px 0 var(--tr-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-note b{margin-right:5px}
.tr-last{position:absolute;left:50%;top:44%;transform:translateX(-50%);z-index:4;width:76%;padding:4px 8px;box-shadow:0 3px 0 var(--tr-ink);animation:trPop .25s ease-out}
.tr-last b{font-size:13px}.tr-last span{font-size:11px}
@keyframes trPop{from{transform:translateX(-50%) scale(.8);opacity:0}to{transform:translateX(-50%) scale(1);opacity:1}}
.tr-stats{flex:0 0 auto;grid-template-columns:repeat(6,1fr)!important;gap:3px}
.tr-st{aspect-ratio:auto;height:30px;background-size:100% 100%!important;background-position:center!important;gap:2px}
.tr-st span{font-size:9px}.tr-st b{font-size:13px}.tr-st em{top:-7px;font-size:9px}
.tr-team{flex:0 0 auto;gap:3px}
.tr-tm{position:relative}.tr-tm-face{width:min(100%,46px);margin:0 auto}
.tr-tm u{position:absolute;right:6%;top:0;background:var(--red);color:#fff;font-size:9px;text-decoration:none;border-radius:50%;width:13px;height:13px;line-height:13px;text-align:center;border:1.5px solid var(--tr-ink)}
.tr-board{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.tr-board.red{border-width:26px 18px 16px;border-image-width:26px 18px 16px;padding:2px}
.tr-board.red .tr-grid{flex:1;min-height:0;grid-template-rows:1fr 1fr;gap:4px}
.tr-cell{min-height:0;display:flex;justify-content:center;align-items:center}
.tr .train.tr-card{height:100%;width:auto;max-width:100%;container-type:size}
.tr-card .tr-low{top:56%;bottom:6%;left:7%;right:7%;gap:1.5cqh}
.tr-card .tr-name{height:12cqh}
.tr-card .tr-gain{gap:1cqh}.tr-card .tr-gain .g{font-size:max(8px,6.4cqh);padding:0 1.5cqh;border-left-width:3px!important}
.tr-card .tr-gain .g b{font-size:inherit}
.tr-card .tr-cost{font-size:max(7px,5.6cqh)}
.tr-card .tr-face{width:15cqh;height:15cqh}
.tr-card .tr-mates{right:-6%;top:12%}
.tr-subs{flex:0 0 auto}
.tr-subs .btn{padding:6px 8px;align-items:center;text-align:center}.tr-subs .btn .moji{height:24px;margin:0 auto}
.tr-subs .btn small{font-size:10px}
/* 黄の国：メインは市の入口だけ */
.tr-board.yellow{border-width:24px 18px 16px;border-image-width:24px 18px 16px;padding:2px 2px 4px;gap:6px}
.tr-board.yellow .tr-purse{padding:4px 8px;font-size:12px;box-shadow:none}
.tr-shop{flex:1;min-height:0;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:6px;background:transparent;border:0;cursor:pointer;padding:0;font:inherit}
.tr-mini{display:grid;grid-template-columns:repeat(6,1fr);gap:3px}
.tr-mini-c{position:relative;display:flex;flex-direction:column;align-items:center}
.tr-mini-box{width:100%;display:block}
.tr-mini-c b{position:absolute;left:50%;top:44%;transform:translateX(-50%);color:#fff;font-size:14px;text-shadow:0 1px 0 var(--tr-ink),0 0 3px var(--tr-ink)}
.tr-mini-c i{font-style:normal;font-size:10px;font-weight:900}.tr-mini-c i.up{color:#d9482b}.tr-mini-c i.down{color:#3d7fc4}
.tr-mini-c em{position:absolute;top:-6px;right:-2px;font-style:normal;font-size:9px;background:#e0a91a;border:1.5px solid var(--tr-ink);padding:0 2px;font-weight:900}
.tr-mini-c.fair .tr-mini-box{filter:drop-shadow(0 0 4px #d9482b)}
.tr-shop-l{align-self:center;background:#d9482b;color:#fff;border:3px solid var(--tr-ink);box-shadow:0 4px 0 var(--tr-ink);padding:6px 26px;font-size:18px;font-weight:900;text-shadow:0 2px 0 #5a1d10}
.tr-shop-l small{display:block;font-size:10px;text-shadow:none}
.tr-shop:active .tr-shop-l{transform:translateY(3px);box-shadow:0 1px 0 var(--tr-ink)}
/* 市の窓 */
.mk-sheet{display:flex;flex-direction:column;gap:6px}
.mk-sheet .tr-purse{box-shadow:none;font-size:13px}
.mk-sheet .tr-stam-s{font-size:12px}
.tr-logbox{max-height:60vh;overflow:auto;font-size:12px}
main.page-training{padding-bottom:4px!important;padding-top:6px!important}.page-training .tr{--tr-off:50px}
/* 能力：札の絵は横に伸ばせないので、木の板の色で作る */
.tr-st{background:#f3dfb4!important;border:2px solid #5a3b22;box-shadow:inset 0 -3px 0 #d8bb84,0 2px 0 var(--tr-ink);height:28px;border-top:4px solid var(--c)}
.tr-yellow .tr-st{background:#fbefd3!important;border-color:#8a5a1c}
.tr-st span{color:#6d5a40}
/* 稽古札：セルいっぱいに */
.tr-board.red .tr-grid{gap:2px 4px}
.tr-cell{align-items:stretch}
.tr .train.tr-card{height:100%;width:auto;aspect-ratio:267/404;max-height:100%}
.tr-card .tr-low{top:55%;bottom:4%;gap:1cqh}
.tr-card .tr-gain{flex-wrap:wrap;justify-content:center;max-width:100%}
.tr-card .tr-gain .g{font-size:max(9px,6.8cqh)}
.tr-scene{height:min(25dvh,52vw)}
.tr-cast{bottom:18%;height:70%}
.tr-tm-face{width:min(100%,36px)}
.tr-bond{height:5px}
.tr-subs .btn{padding:3px 8px;min-height:44px}.tr-subs .btn .moji{height:22px}
.tr .train.tr-card{aspect-ratio:auto;width:100%;background-size:auto!important}
.tr-card{display:block}

.tr .train.tr-card{width:100%;height:100%;background:none!important;display:flex;align-items:stretch;gap:2px;container-type:normal}
.tr-art{flex:0 0 auto;height:100%;aspect-ratio:267/404;position:relative}
.tr-art .tr-name{position:absolute;left:50%;top:58%;transform:translateX(-50%);height:22%;width:auto;max-width:96%}
.tr-art .tr-cost{position:absolute;left:50%;bottom:6%;top:auto;transform:translateX(-50%) rotate(0);white-space:nowrap;font-size:9px;flex-direction:row;gap:2px;padding:0 3px}
.tr-side{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px}
.tr-side .tr-mates{position:static;flex-direction:row;flex-wrap:wrap;gap:1px}
.tr-side .tr-face{width:18px;height:18px}
.tr-side .tr-gain{flex-direction:column;align-items:flex-start;gap:1px}
.tr-side .tr-gain .g{font-size:10px;padding:0 3px;white-space:nowrap}
.tr .train.tr-card.reso .tr-art,.tr .train.tr-card.boost .tr-art{filter:drop-shadow(0 0 6px #ff7a2a)}
.tr .train.tr-card{filter:none!important;animation:none!important}
.tr .train.tr-card.reso{animation:none}
.tr .train.tr-card .tr-art{filter:drop-shadow(0 3px 0 rgba(42,31,22,.55))}
.tr-alone{font-size:9px;color:#8a7a5c;font-weight:700}
.tr .train.tr-card{flex-direction:row;text-align:left;justify-content:center}.tr-side{flex:0 1 auto}
.tr-art{height:86%;align-self:center}.tr-alone{display:none}.tr-side .tr-gain .g{font-size:9.5px;padding:0 2px}.tr-board.red .tr-grid{gap:2px 2px}
.tr-note{top:auto;bottom:19%;left:2%}
.tr-last{top:36%;animation:trPop .25s ease-out,trFade .5s ease-in 2.6s forwards;pointer-events:none}
@keyframes trFade{to{opacity:0;visibility:hidden}}
.tr-yellow .tr-date{width:15%;top:3%}
.modal.mk-modal{border-image:url(art/ui/tr/yellow_board.png) 86 76 70 76 fill / 30px 22px 22px stretch!important;border-style:solid!important;border-width:30px 22px 22px!important;background:none!important;padding:4px 6px!important;max-height:calc(100dvh - 60px);overflow:auto}
.mk-sheet .tr-grid.mk{grid-template-columns:repeat(3,1fr);gap:6px 4px}
.mk-sheet .tr-crate-wrap{background:transparent;border:2px solid transparent;padding:2px;cursor:pointer;font:inherit}
.mk-sheet .tr-crate-wrap.sel{border-color:#d9482b;background:#fff4cc;box-shadow:0 0 0 2px #d9482b}
.mk-sheet .tr-crate{width:82%}
.mk-sheet .tr-gname{font-size:12px}
.mk-detail{background:#fffaf0;border:2.5px solid #8a5a1c;box-shadow:0 3px 0 #5a3b22;padding:6px 8px;display:flex;flex-direction:column;gap:5px}
.mk-dh b{font-size:16px;margin-right:6px}.mk-dh small{font-size:10px;color:#6d5a40}
.mk-dl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;font-weight:700}
.mk-dlab{background:#5a3b22;color:#fbefd3;font-size:11px;font-weight:900;padding:0 6px}
.mk-dl .tr-btn{font-size:13px}
.mk-dl.btns{display:grid;grid-template-columns:2fr 1fr}
.mk-dl.btns .tr-btn{padding:6px;font-size:15px;flex-direction:row}
.mk-dl.btns .tr-btn small{font-size:9px;display:block}
.mk-dl.btns .tr-btn.sell{display:flex;flex-direction:column}
.mk-next{position:static!important;max-width:none!important;white-space:normal!important}

/* 2026-10-21 まだ読めない話（前の話を読むと開く） */
.chapter.locked{opacity:.55;filter:grayscale(1);cursor:default}
.chapter.locked .ch-cover{background:#2a1f16!important}
.chapter.locked small{color:#7a5a3a}

/* 2026-10-21 修行地の遊び方ボタン */
.su-howto{display:flex;gap:8px;justify-content:flex-end;margin:6px 0 2px}
.su-howto .btn.small{font-size:12px;padding:6px 10px}

/* 2026-10-21 ユーザー：もどるは右上、上のすき間を詰める */
main.page-story{padding-top:6px}
.story-top{display:flex;align-items:flex-start;justify-content:space-between;gap:6px}
.story-top .guide{margin:0;min-height:0;flex:1 1 auto}
.story-top .guide img{height:78px}
.story-top .guide-say{margin-bottom:4px;padding:5px 10px}
.story-top .guide-say p{font-size:13px;line-height:1.45;margin:2px 0 0}
.story-top .navbtn{font-size:14px;flex:0 0 auto}
.band.story-band{margin:6px 0 8px}

/* ---- 修行の準備（2026-10-21 画面切り替え。ライモンの育成準備を参考） ---- */
main.page-setup{padding:0 10px 0!important}
.su-wiz{display:flex;flex-direction:column;min-height:calc(100dvh - 84px)}
.su-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:6px;padding:6px 0 6px;background:var(--paper,#efe3c4);border-bottom:3px solid #5a3a22}
.su-bar .su-x{font-size:13px;flex:0 0 auto}
.su-prog{display:flex;flex:1;gap:2px;margin:0;padding:0;list-style:none;justify-content:space-between}
.su-prog li{flex:1;position:relative}
.su-prog li+li::before{content:'';position:absolute;left:-50%;right:50%;top:13px;height:3px;background:#b39b6e;z-index:0}
.su-prog li.done::before,.su-prog li.now::before{background:#b8402a}
.su-prog button{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1px;width:100%;background:none;border:0;padding:0;color:#7a6446}
.su-prog i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:2px solid #5a3a22;background:#f8eed6;font-weight:900;font-size:13px}
.su-prog small{font-size:10px;font-weight:900;white-space:nowrap}
.su-prog .done i{background:#e8b85a}.su-prog .now i{background:#b8402a;color:#fff;transform:scale(1.15)}.su-prog .now small{color:#b8402a}
.su-body{flex:1;padding:8px 0 96px}
.su-h{font-family:var(--game-font);font-size:18px;margin:6px 0 8px;display:flex;align-items:center;gap:8px}
.su-foot{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#2a1f16ee;border-top:3px solid #b8402a}
.su-foot .btn{margin:0}.su-foot .btn.big{flex:0 1 60%}

.su-places{display:flex;flex-direction:column;gap:12px}
.su-pl{position:relative}
.su-pl-pick{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;width:100%;min-height:150px;padding:10px 12px;border:3px solid #2a1f16;background:#2a1f16 center/cover no-repeat;box-shadow:0 4px 0 #2a1f16;text-align:left;color:#fff;filter:grayscale(.55) brightness(.8)}
.su-pl-pick b{font-family:var(--game-font);font-size:20px;text-shadow:2px 2px 0 #2a1f16,-1px -1px 0 #2a1f16}
.su-pl-pick small{font-size:12px;font-weight:900;background:#2a1f16cc;padding:3px 6px;margin-top:4px}
.su-pl.on .su-pl-pick{filter:none;outline:4px solid #e8b85a;outline-offset:-4px}
.su-pl-how{position:absolute;top:8px;right:8px}
.su-hero{display:flex;gap:10px;align-items:flex-end;background:#fbf3df;border:3px solid #5a3a22;box-shadow:0 4px 0 #5a3a22;padding:8px 10px;margin:4px 0 8px}
.su-hero-art img,.su-hero-art svg{height:120px;width:auto}
.su-hero-body{flex:1;min-width:0}
.su-hero-name{font-family:var(--game-font);font-size:22px;display:block;line-height:1.1}
.su-star{color:#d18a1c;font-size:14px;letter-spacing:1px}
.su-hero-body small{display:block;font-size:12px;margin:2px 0 4px}
.su-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:2px}
.su-stats span{background:#2a1f16;color:#fff6df;text-align:center;padding:2px 0}
.su-stats small{display:block;font-size:9px;margin:0;color:#e8b85a}.su-stats b{font-size:12px}
.su-hero-note{font-size:11px;color:#7a5a3a;margin:4px 0 0}
.su-deckhead{position:sticky;top:46px;z-index:10;background:var(--paper,#efe3c4);padding-bottom:4px}
.su-sum-place{font-family:var(--game-font);font-size:16px;background:#2a1f16;color:#fff6df;padding:4px 10px;display:inline-block;margin-bottom:6px}
.su-step-carry .it-list{margin-top:8px}
body:has(.su-wiz) .back-float{display:none}
.su-foot .btn{white-space:nowrap;writing-mode:horizontal-tb;flex:0 0 auto;min-width:84px;padding-left:10px;padding-right:10px}.su-foot .btn.big{flex:1 1 auto;min-width:0}

/* ==== 黄の国 時成通り：行商すごろく（2026-10-21） ==== */
main.page-training:has(.sg){padding:4px 8px 6px!important}
.sg{display:flex;flex-direction:column;gap:5px;height:calc(100dvh - 16px);max-width:560px;margin:auto}
.sg-top{display:flex;align-items:center;gap:8px}
.sg-leg{flex:1;min-width:0;background:#2a1f16;color:#fff6df;padding:4px 10px 5px;border:2px solid #c99a2e;box-shadow:0 3px 0 #1a120b}
.sg-leg b{font-family:var(--game-font);font-size:16px;display:block;line-height:1.2}
.sg-leg small{font-size:10.5px;color:#f1d79a}
.sg-days{display:flex;gap:3px;margin:3px 0 1px}.sg-days i{flex:1;height:7px;background:#5a4630;border-radius:2px}.sg-days i.done{background:#c99a2e}.sg-days i.now{background:#ffd75e;box-shadow:0 0 6px #ffd75e}.sg-days i.game{outline:2px solid #e05a3a;outline-offset:-1px}
.sg-leaf{display:flex;align-items:center;gap:3px;background:#fff6df;border:2px solid #2a1f16;box-shadow:0 3px 0 #2a1f16;padding:3px 9px;font-family:var(--game-font);font-size:20px}.sg-leaf .ico{height:22px}
.sg-tools{display:flex;gap:5px;align-items:center}.sg-tools .tr-retry{margin-left:auto;position:static;font-size:11px}
.sg-board{position:relative;flex:1 1 auto;min-height:260px;max-height:380px;border:3px solid #2a1f16;box-shadow:0 4px 0 #2a1f16;background:#c9a65f center/cover no-repeat;overflow:hidden}
.sg-board::before{content:'';position:absolute;inset:0;background:linear-gradient(#fff6df55,#2a1f1633)}
.sg-road{position:absolute;inset:0;width:100%;height:100%}
.sg-road line{stroke:#f3e2b4;stroke-width:4.2;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 2px 0 #6b4f2a)}
.sg-tile{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:var(--c);border:3px solid #fff6df;box-shadow:0 3px 0 #2a1f16,0 0 0 2px #2a1f16;display:grid;place-items:center;z-index:2}
.sg-tile b{color:#fff;font-family:var(--game-font);font-size:14px;text-shadow:1px 1px 0 #2a1f16}
.sg-tile.passed{filter:grayscale(.7) brightness(.85)}
.sg-tile.t-goal{width:46px;height:46px;border-radius:8px;background:#2a1f16;border-color:#ffd75e}.sg-tile.t-goal b{font-size:20px;color:#ffd75e}
.sg-tile.t-start{border-radius:8px}
.sg-tile.fork{box-shadow:0 3px 0 #2a1f16,0 0 0 2px #2a1f16,0 0 0 5px #ffd75e}
.sg-tmates{position:absolute;top:-16px;right:-14px;display:flex}
.sg-tmates i{width:22px;height:22px;border-radius:50%;background:#fff6df;border:2px solid #2a1f16;overflow:hidden;display:grid;place-items:center;margin-left:-6px}
.sg-tmates i.lit{border-color:#ffd75e;box-shadow:0 0 6px #ffd75e}
.sg-tmates img{height:22px;width:auto}
.sg-flag{position:absolute;transform:translate(-50%,-140%);background:#2a1f16;color:#fff6df;font-size:10px;font-weight:900;padding:1px 6px;white-space:nowrap;z-index:3}
.sg-flag.to{transform:translate(-50%,-120%);background:#b8402a;font-size:11px;text-align:center;line-height:1.25}.sg-flag.to small{display:block;font-size:9px;color:#ffe6a8}
.sg-flag.from{transform:translate(-30%,95%)}
.sg-me{position:absolute;transform:translate(-50%,-88%);z-index:5;transition:left .26s ease-out,top .26s ease-out;pointer-events:none}
.sg-me img,.sg-me svg{height:58px;width:auto;filter:drop-shadow(2px 3px 0 #2a1f16)}
.sg-me.hop{animation:sgHop .26s ease-out}
@keyframes sgHop{40%{transform:translate(-50%,-118%)}100%{transform:translate(-50%,-88%)}}
.sg-dice{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);z-index:8;width:78px;height:78px;background:#fff6df;border:4px solid #2a1f16;border-radius:14px;box-shadow:0 6px 0 #2a1f16;display:grid;place-items:center}
.sg-dice span{font-family:var(--game-font);font-size:46px;color:#b8402a}
.sg-dice em{position:absolute;right:-26px;top:-12px;background:#2f6fa8;color:#fff;font-style:normal;font-weight:900;padding:1px 6px;border:2px solid #2a1f16}
.sg-dice.rolling{animation:sgShake .14s linear infinite}
@keyframes sgShake{0%{transform:translate(-50%,-50%) rotate(-12deg)}50%{transform:translate(-50%,-56%) rotate(12deg)}100%{transform:translate(-50%,-50%) rotate(-12deg)}}
.sg-last{position:absolute;left:8%;right:8%;top:50%;z-index:6;background:#fff6dff2;border:3px solid #2a1f16;box-shadow:0 4px 0 #2a1f16;padding:6px 10px;font-size:12.5px;text-align:center;pointer-events:none;animation:sgPop .35s ease-out,sgFade .5s ease-in 2.8s forwards}
.sg-last b{display:block;font-family:var(--game-font);font-size:14px;color:#b8402a}
@keyframes sgPop{from{transform:translateY(-40%);opacity:0}to{transform:translateY(-50%)}}@keyframes sgFade{from{transform:translateY(-50%)}to{opacity:0;transform:translateY(-50%)}}
.sg-last{transform:translateY(-50%)}
.sg-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:3px}.sg-st{background:#2a1f16;color:#fff6df;padding:2px 0 1px;text-align:center;line-height:1.15;border:2px solid #c99a2e}.sg-st span{color:#f1d79a;font-size:10px;display:block}.sg-st b{font-size:14px;font-family:var(--game-font)}.sg-st em{display:block;font-size:9.5px;color:#9be08a;font-style:normal}
.sg .tr-team{margin:0}
.sg-act{display:flex;gap:8px;align-items:stretch}
.sg-bagbtn{flex:0 0 74px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0;background:#f3dfb0;border:3px solid #2a1f16;box-shadow:0 5px 0 #2a1f16;border-radius:6px;font-family:var(--game-font)}.sg-bagbtn b{font-size:17px}.sg-bagbtn small{font-size:11px}.sg-bagbtn:disabled{opacity:.55}
body:has(.sg) #runbar{display:none}
.sg-roll{flex:1;position:relative;display:flex;align-items:center;justify-content:center;gap:10px;min-height:66px;background:#b8402a;color:#fff;border:3px solid #2a1f16;box-shadow:0 5px 0 #2a1f16;font-family:var(--game-font);font-size:22px;border-radius:6px}
.sg-roll:active{transform:translateY(3px);box-shadow:0 2px 0 #2a1f16}
.sg-roll small{position:absolute;right:8px;top:4px;font-size:11px;background:#2f6fa8;padding:0 5px}
.sg-roll-die{width:38px;height:38px;background:#fff6df;border:3px solid #2a1f16;border-radius:7px;position:relative;transform:rotate(-10deg)}
.sg-roll-die i{position:absolute;width:7px;height:7px;border-radius:50%;background:#b8402a}.sg-roll-die i:nth-child(1){left:5px;top:5px}.sg-roll-die i:nth-child(2){left:13px;top:13px}.sg-roll-die i:nth-child(3){right:5px;bottom:5px}
.sg-town p{margin:0 0 4px;font-weight:900;font-size:13px}
.sg-town-g{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.sg-tb{background:var(--c);color:#fff;border:2px solid #2a1f16;box-shadow:0 3px 0 #2a1f16;padding:4px 2px;line-height:1.2}.sg-tb b{font-family:var(--game-font);font-size:15px;display:block}.sg-tb small{font-size:9.5px}
.sg-fork{display:flex;flex-direction:column;gap:8px}
.sg-list{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.sg-item{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;background:#fffaf0;border:2px solid #5a3a22;padding:6px 8px}
.sg-item b{font-family:var(--game-font);font-size:15px}.sg-item span{grid-column:1;font-size:12px}.sg-item .btn,.sg-item em{grid-column:2;grid-row:1/3}.sg-item em{font-size:10px;font-style:normal;color:#7a5a3a}
.sg-got{color:#2f6fa8}
.sg-ev b{font-family:var(--game-font);font-size:19px;display:block;margin:4px 0}.sg-ev p{margin:4px 0;font-size:14px;line-height:1.6}
.sg-hint{background:#fff3c9;border:2px dashed #c99a2e;padding:6px 8px;font-size:13px}
.sg-faces{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.sg-faces .btn{font-size:28px;font-family:var(--game-font)}
.sg-game-ov{position:fixed;inset:0;z-index:900;background:#1b140ecc;display:grid;place-items:center;padding:12px}
.sg-game{width:min(440px,100%);background:#f8eed6;border:4px solid #2a1f16;box-shadow:0 6px 0 #2a1f16;padding:12px 14px 16px;text-align:center}
.sg-game-t{font-size:15px;font-weight:900;margin:6px 0}
.sg-hits{display:flex;justify-content:center;gap:10px;margin:6px 0 12px}.sg-hits i{width:24px;height:24px;border-radius:50%;border:3px solid #2a1f16;background:#fff}.sg-hits i.ok{background:#e05a3a}.sg-hits i.ng{background:#7a6446}
.sg-meter{position:relative;height:44px;background:#fff6df;border:3px solid #2a1f16;margin:0 4px 14px}
.sg-zone{position:absolute;top:0;bottom:0;background:#e05a3a;opacity:.85}
.sg-mark{position:absolute;top:-10px;bottom:-10px;width:6px;margin-left:-3px;background:#2a1f16;box-shadow:0 0 0 2px #fff6df}
.sg-stop{width:100%;font-size:22px}
.sg-game-msg{min-height:1.6em;font-family:var(--game-font);font-size:20px;color:#b8402a;margin:8px 0 0}
.sg-vs{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;margin:6px 0 2px}
.sg-vs>div{flex:1;display:flex;flex-direction:column;align-items:center}.sg-vs img,.sg-vs svg{height:92px;width:auto;filter:drop-shadow(2px 3px 0 #2a1f16)}.sg-vs b{font-size:12px;font-weight:900;background:#2a1f16;color:#fff6df;padding:0 6px}
.sg-vs-you img{transform:scaleX(-1)}.sg-vs i{font-style:normal;font-family:var(--game-font);font-size:30px;color:#b8402a;text-shadow:2px 2px 0 #2a1f16;align-self:center}
.sg-game.hit{animation:sgHit .35s}.sg-game.miss{animation:sgMiss .35s}
@keyframes sgHit{30%{box-shadow:0 0 0 8px #ffd75e,0 6px 0 #2a1f16}}
@keyframes sgMiss{20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(4px)}}
.sg-game.won .sg-vs-you{opacity:.35;filter:grayscale(1)}.sg-game.won .sg-game-msg{font-size:30px;color:#d18a1c}
.sg-game.lost .sg-vs-me{opacity:.35;filter:grayscale(1)}
.sg-zone{animation:sgZone 1s ease-in-out infinite alternate}@keyframes sgZone{to{opacity:1}}

/* ---- 行商すごろく v2：長い道・カットイン・絆技 ---- */
.sg-board{background:#d9c08a url(art/bg/train_yellow.jpg) center/cover no-repeat}
.sg-board::after{content:'';position:absolute;inset:0;background:#efe0b8c4;z-index:0}
.sg-world{z-index:1}
.sg-board::before{background:radial-gradient(#6b4f2a22 1.2px,transparent 1.4px) 0 0/14px 14px,linear-gradient(90deg,#7fae7044,transparent 18%,transparent 82%,#7fae7044)}
.sg-world{position:absolute;left:0;right:0;bottom:-30px}
.sg-road{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sg-road line{stroke:#f3e2b4;stroke-width:12;stroke-linecap:round;filter:drop-shadow(0 3px 0 #6b4f2a)}
.sg-tile{transform:translate(-50%,-50%)}
.sg-tile.t-mile{width:42px;height:42px;border-radius:6px 6px 2px 2px;background:#5a5048;border-color:#ffd75e}.sg-tile.t-mile b{color:#ffd75e}
.sg-tile.t-fork{border-color:#ffd75e}
.sg-mile-l{position:absolute;left:115%;top:50%;transform:translateY(-50%);white-space:nowrap;font-style:normal;font-size:9.5px;font-weight:900;background:#2a1f16;color:#ffd75e;padding:1px 5px;line-height:1.25}
.sg-me{transform:translate(-50%,-85%)}
.sg-progress{position:absolute;left:6px;top:6px;z-index:6;background:#2a1f16cc;color:#ffd75e;font-weight:900;font-size:12px;padding:1px 8px}
.sg-progress small{font-size:10px}
.sg-buffs{position:absolute;right:6px;top:6px;z-index:6;display:flex;flex-direction:column;gap:3px;align-items:flex-end}.sg-buffs span{background:#2f6fa8;color:#fff;font-size:11px;font-weight:900;padding:1px 7px;border:2px solid #2a1f16}
.sg-team{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.sg-tm{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:0;padding:0}
.sg-tm-face{width:44px;height:44px;border-radius:50%;background:#fff6df;border:2px solid #2a1f16;display:grid;place-items:center;overflow:hidden}.sg-tm-face img,.sg-tm-face svg{height:42px;width:auto}
.sg-tm.lit .sg-tm-face{border-color:#ffd75e;box-shadow:0 0 8px #ffd75e}
.sg-tm.ready .sg-tm-face{animation:sgReady 1s ease-in-out infinite alternate}@keyframes sgReady{to{box-shadow:0 0 0 4px #ffd75e,0 0 12px #ffd75e}}
.sg-tm em{position:absolute;top:-4px;right:2px;font-style:normal;background:#b8402a;color:#fff;font-weight:900;font-size:11px;min-width:18px;height:18px;border-radius:9px;border:2px solid #fff6df;display:grid;place-items:center}
.sg-bond{position:relative;width:100%;height:7px;background:#5a4630;border:1px solid #2a1f16}.sg-bond i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#e8b85a,#e05a3a)}.sg-bond u{position:absolute;top:-2px;bottom:-2px;width:2px;background:#fff6df}
.sg-bondw{display:flex;gap:12px;align-items:center;margin:8px 0}.sg-bondw-art img,.sg-bondw-art svg{height:96px;width:auto}.sg-bondw b{font-family:var(--game-font);font-size:18px}.sg-bondw p{margin:2px 0}.sg-bondw-sk{background:#fff3c9;border:2px solid #c99a2e;padding:4px 8px}.sg-bondw-sk b{display:block;font-size:16px;color:#b8402a}.sg-bondw small{font-size:11px;color:#7a5a3a}
.sg-two{display:flex;gap:16px;justify-content:center;margin:10px 0}.sg-two-d{width:86px;height:86px;background:#fff6df;border:4px solid #2a1f16;border-radius:14px;box-shadow:0 6px 0 #2a1f16;font-family:var(--game-font);font-size:48px;color:#b8402a}
.sg-faces{grid-template-columns:repeat(3,1fr)!important}
.sg-vs.small img,.sg-vs.small svg{height:64px}
.sg-cut{position:fixed;inset:0;z-index:950;display:grid;place-items:center;background:#1b140e55;pointer-events:auto;animation:sgCutIn .25s ease-out}
.sg-cut.out{animation:sgCutOut .3s ease-in forwards}
.sg-cut-band{width:100%;background:linear-gradient(90deg,transparent,#2a1f16 14%,#2a1f16 86%,transparent);color:#fff6df;text-align:center;padding:12px 0 14px;border-top:3px solid #c99a2e;border-bottom:3px solid #c99a2e;animation:sgBand .45s cubic-bezier(.2,1.4,.4,1)}
.sg-cut-band small{display:block;font-weight:900;font-size:13px;color:#f1d79a;letter-spacing:.1em}
.sg-cut-band b{display:block;font-family:var(--game-font);font-size:64px;line-height:1;text-shadow:3px 3px 0 #b8402a}.sg-cut-band b span{font-size:28px;margin-left:4px}
.sg-cut-band em{display:block;font-style:normal;font-weight:900;font-size:14px;margin-top:4px}
.sg-cut.game .sg-cut-band{background:linear-gradient(90deg,transparent,#8a2416 14%,#8a2416 86%,transparent)}.sg-cut.game em{color:#ffd75e;font-size:16px}
@keyframes sgCutIn{from{opacity:0}}@keyframes sgCutOut{to{opacity:0}}@keyframes sgBand{from{transform:translateX(-100%) skewX(-12deg)}to{transform:none}}
.sg-tile.lane{width:28px;height:28px}.sg-tile.lane b{font-size:12px}
.sg-tile.lr .sg-mile-l{left:auto;right:115%}

.sg-cut.sg-cut-bond .sg-cut-band{background:linear-gradient(90deg,transparent,#2f6fa8 12%,#2f6fa8 88%,transparent);position:relative}
.sg-cut.sg-cut-bond{align-content:center}.sg-cut-face{display:block;margin:-70px auto 2px;width:110px;height:110px}.sg-cut-face img,.sg-cut-face svg{height:110px;width:auto;filter:drop-shadow(3px 3px 0 #1a120b)}
.sg-cut-band b.sg-cut-sk{font-size:40px;text-shadow:3px 3px 0 #1a3a5a}

/* ---- 修行の始まりの簡単なストーリー（2026-10-22） ---- */
.tr-intro{position:fixed;inset:0;z-index:960;display:flex;flex-direction:column;justify-content:flex-end;padding:0 10px calc(16px + env(safe-area-inset-bottom));animation:sgCutIn .3s ease-out;cursor:pointer}
.tri-bg{position:absolute;inset:0;background:#2a1f16 center/cover no-repeat}.tri-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(#1b140e33,#1b140e00 40%,#1b140ecc)}
.tri-place{position:absolute;left:10px;top:12px;background:#2a1f16;color:#ffd75e;font-weight:900;font-size:13px;padding:3px 10px;border:2px solid #c99a2e}
.tri-skip{position:absolute;right:10px;top:10px;background:#fff6df;border:3px solid #2a1f16;box-shadow:0 3px 0 #2a1f16;font-weight:900;font-size:14px;padding:5px 14px;z-index:2}
.tri-art{position:relative;align-self:center;margin-bottom:-6px;z-index:1}.tri-art img{height:min(46vh,300px);width:auto;filter:drop-shadow(3px 4px 0 #1a120b)}
.tri-box{position:relative;z-index:2;background:#fff6df;border:4px solid #2a1f16;box-shadow:0 5px 0 #2a1f16;padding:10px 14px 8px;min-height:110px}
.tri-box.narr{background:#2a1f16ee;color:#fff6df;border-color:#c99a2e}
.tri-who{position:absolute;top:-16px;left:10px;background:#b8402a;color:#fff;font-size:13px;padding:2px 10px;border:2px solid #2a1f16}
.tri-box p{margin:6px 0 4px;font-size:16px;line-height:1.65;font-weight:700}
.tri-box small{display:block;text-align:right;font-size:11px;opacity:.6}

/* 商才（時成通りで、仲間がマスに出る多さ） */
.shosai{font-style:normal;font-size:9.5px;font-weight:900;padding:0 4px;border:1.5px solid #2a1f16;background:#f3dfb0;color:#2a1f16}
.pk .shosai{position:absolute;left:2px;bottom:2px}
.shosai.s-S{background:#d18a1c;color:#fff}.shosai.s-A{background:#e8b85a}.shosai.s-B{background:#f3dfb0}.shosai.s-C{background:#e6dcc4}.shosai.s-D{background:#cfc2a6;color:#5a4630}.shosai.s-E{background:#a89a80;color:#fff6df}

/* 2026-10-22 ユーザー：「修行をどうする？」のバランスが悪い → 題を中央、上を詰める、選択肢の重さを形で分ける */
.modal:has(.ask){padding-top:46px}
.ask{display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 4px 6px}
.ask-title{font-family:var(--game-font);font-size:22px;margin:0 0 4px;text-align:center}
.ask-choices{display:grid;grid-template-columns:1fr;gap:8px;width:100%}
.ask-btn{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:74px;margin:0;padding:10px 26px;text-align:center;writing-mode:horizontal-tb!important;width:100%}
.ask-btn b,.ask-btn small{writing-mode:horizontal-tb!important}
.ask-btn b{font-size:19px;line-height:1.2}.ask-btn small{font-size:11px;line-height:1.35;font-weight:700;opacity:.9}
.ask-close{background:none;border:0;border-bottom:2px solid #5a3a22;padding:4px 2px;font-weight:900;font-size:14px;color:#5a3a22;margin-top:2px}

.btn.green:not(.primary):not(.small){background:none;border:0;border-style:solid;border-width:9px 40px 11px;border-image:url(art/ui/btn_green.png) 50 228 56 fill/9px 40px 11px stretch!important;box-shadow:none;filter:drop-shadow(0 3px 0 #2a1f16);color:#fff;text-shadow:1px 1px 0 #1a3a10,-1px -1px 0 #1a3a10,1px -1px 0 #1a3a10,-1px 1px 0 #1a3a10}
.ask-btn{min-height:64px}
/* 2026-10-22 ユーザー：上に「諦める・中断」、下の中央に「続ける」の2段。ボタンは短く */
.ask-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;width:100%;max-width:330px;justify-items:center}
.ask-grid .ask-btn{width:100%;max-width:150px;min-height:60px;padding:8px 6px}
.ask-grid .ask-btn b{font-size:18px}.ask-grid .ask-btn small{font-size:10.5px}
.ask-grid .ask-main{grid-column:1/-1;max-width:170px}
.ask-grid .ask-btn,.ask-grid .ask-btn.primary,.ask-grid .ask-btn.green{border-width:9px 26px 11px!important;height:62px;min-height:0;white-space:nowrap}
.ask-grid .ask-btn b,.ask-grid .ask-btn small{white-space:nowrap}
/* 2026-10-22 ユーザー：題を少し上へ、ボタンを大きくしてすき間を埋める */
.modal:has(.ask){padding-top:38px}
.ask{gap:12px;padding:0 0 4px}
.ask-title{margin:-6px 0 2px}
.ask-grid{max-width:none;gap:12px 10px}
.ask-grid .ask-btn,.ask-grid .ask-btn.primary,.ask-grid .ask-btn.green{max-width:none;height:84px;border-width:10px 28px 12px!important}
.ask-grid .ask-main{max-width:none;width:62%}
.ask-grid .ask-btn b{font-size:24px}.ask-grid .ask-btn small{font-size:12px}
/* 2026-10-22 ユーザー：諦めるが燃えている札なのは変 → 灰色の木札（炎の印なし） */

/* 2026-10-22 ユーザー：緑と灰色の字が見づらい → 灰色は明るい木の灰色に濃い字、緑は白い字に太いふち */
.ask-grid .ask-btn.green{color:#fff;text-shadow:none;-webkit-text-stroke:5px #173d0e;paint-order:stroke fill}
.ask-grid .ask-btn.green small{color:#fff;-webkit-text-stroke:3px #173d0e;paint-order:stroke fill;font-weight:900}
.ask-grid .ask-btn small{font-size:12.5px;font-weight:900}
.ask-grid .ask-btn.primary{color:#fff;text-shadow:none;-webkit-text-stroke:5px #5a160c;paint-order:stroke fill}.ask-grid .ask-btn.primary small{color:#fff;-webkit-text-stroke:3px #5a160c;paint-order:stroke fill}
/* 2026-10-22 ユーザー：はっきりした色でなくていいから軽く色を分ける → 3つとも木札。続けるは少し赤み、諦めるは少し色あせ */
.ask-grid .ask-btn.warm{border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/10px 28px 12px stretch!important}
.ask-grid .ask-btn.quit{background:none!important;border-style:solid!important;border-color:transparent!important;border-image-source:url(art/ui/btn_ash.png)!important;border-image-slice:40 110 46 fill!important;border-image-width:10px 28px 12px!important;border-image-repeat:stretch!important}
/* 2026-10-22 ユーザー：次へが大きすぎる・準備中も下のタブを出す */
.su-foot{bottom:calc(82px + env(safe-area-inset-bottom));padding:6px 12px;background:#2a1f16dd;justify-content:center;gap:10px}
.su-foot .btn.big{flex:0 0 auto;min-width:150px;font-size:18px;padding-top:6px;padding-bottom:6px}
.su-foot .btn{min-width:100px}
.su-body{padding-bottom:150px}
/* 遊び方：ページごとに窓の大きさが変わらないように、説明の高さをそろえる */
body:has(.su-wiz) .overlay{z-index:120}
.howto-body .band{font-size:14px;white-space:nowrap}
/* 2026-10-22 遊び方の窓：全ページを同じ場所に重ね、いちばん長いページで高さが決まる */
.howto-page{display:flex;align-items:center;gap:6px;margin:8px 0 12px}
.howto-who{height:132px;width:auto;flex:0 0 auto;filter:drop-shadow(2px 3px 0 #2a1f16)}
.howto-stack{flex:1;display:grid;min-width:0}
.howto-say{grid-area:1/1;visibility:hidden;position:relative;background:#fffaf0;border:3px solid #2a1f16;box-shadow:4px 4px 0 #2a1f16;padding:10px 14px 12px}
.howto-say.on{visibility:visible}
.howto-say::before{content:'';position:absolute;left:-12px;top:50%;margin-top:-8px;border:8px solid transparent;border-right:10px solid #2a1f16;border-left:0}
.howto-tag{display:inline-block;background:#b8402a;color:#fff;font-size:13px;padding:1px 10px;margin-bottom:6px}
.howto-say p{margin:0;font-size:15px;line-height:1.7;font-weight:700}
.howto-row{justify-content:center;gap:14px}.howto-row .btn{min-width:130px}
.howto-row .btn:disabled{opacity:.45}
.howto-who{height:clamp(84px,24vw,140px)}
@media (max-width:480px){.howto-say{padding:8px 10px 10px}.howto-say p{font-size:14px;line-height:1.6}.howto-page{gap:4px}}
.howto-who{max-width:24%;object-fit:contain}

/* 2026-10-22 ユーザー：しめ縄の紙垂が場所を取りすぎ。枠の中はもっと上から文字を始めたい
   → 枠の絵の紙垂を小さくして縄の帯（上の切り取り 142px）に収めた（tools/frame-shide.py）。中身は縄のすぐ下から */
.modal{border-width:46px 28px 30px;border-image:url(art/ui/frame_v3.png) 142 110 110 fill/46px 28px 30px stretch;padding:2px 10px 8px}
.modal .band{margin-top:0}
.modal:has(.ask){padding-top:6px}
.modal>.close{top:-6px;right:-4px}

/* 2026-10-22 ミッション：窓の高さは決まっていて、タブを変えても変わらない。中の一覧だけ動く。下の段に とじる／まとめて受け取る */
.modal:has(.ms-wrap){height:min(620px,100%);display:flex;flex-direction:column;overflow:hidden}
.ms-wrap{flex:1;min-height:0;display:flex;flex-direction:column;position:relative}
.ms-wrap>.band{margin:0 0 2px}
.ms-wrap .ms-tabs{margin:2px 0 0;flex:0 0 auto}
.ms-wrap .ms-body{flex:1;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;padding:6px 2px 4px;background:#f3e4c2;border:2px solid #5a3a22;border-top:0;box-shadow:inset 0 3px 0 #0001}
.ms-wrap .ms-row,.ms-wrap .ms-sum{display:flex;align-items:center;gap:6px;background:#fbf3df;border:2px solid #5a3a22;box-shadow:0 2px 0 #5a3a2240;padding:5px 6px;margin:0 0 5px;min-height:56px}
.ms-wrap .ms-row.ready{background:#fff0c8;border-color:#b5501e;box-shadow:0 0 0 2px #f2b13a inset,0 2px 0 #5a3a2240}
.ms-wrap .ms-row.got{opacity:1;background:#e6d8bb;filter:saturate(.4)}
.ms-wrap .ms-row.got .ms-mid b{color:#7a6a5a}
.ms-wrap .ms-row.lock{opacity:.6}
/* 報酬：左の札。絵と数 */
.ms-rw{flex:0 0 46px;align-self:stretch;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;background:#3a2414;border:2px solid #2a1f16;box-shadow:inset 0 0 0 1px #c9a24a;padding:2px 0}
.ms-rw span{display:flex;flex-direction:column;align-items:center;line-height:1}
.ms-rw img{width:26px;height:26px;object-fit:contain;image-rendering:auto}
.ms-rw b{font-size:11px;color:#ffe08a;font-weight:900;margin-top:1px;letter-spacing:-.02em}
.ms-rw.two span{flex-direction:row;gap:2px}.ms-rw.two img{width:16px;height:16px}.ms-rw.two b{font-size:10px;margin:0}
/* まん中：文と進み具合 */
.ms-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ms-mid>b{font-size:13px;line-height:1.3;color:#2a1f16}
.ms-prog{display:flex;align-items:center;gap:6px}
.ms-bar{flex:1;height:7px;background:#5a3a22;border:1px solid #2a1f16;display:block;position:relative;overflow:hidden}
.ms-bar>i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#ffd75e,#e8952a)}
.ms-row.ready .ms-bar>i,.ms-sum.ready .ms-bar>i{background:linear-gradient(#ffe98a,#f2b13a)}
.ms-prog small{font-size:11px;font-weight:900;color:#5a3a22;white-space:nowrap;min-width:34px;text-align:right}
.ms-lock{font-size:11px;color:#7a6a5a}
/* 右：受け取る／済／まだ */
.ms-act{flex:0 0 74px;display:flex;justify-content:center;align-items:center}
.ms-act .btn{width:100%;font-size:12px!important;border-width:6px 12px 8px!important;padding:2px 0!important;white-space:nowrap}
.ms-yet{font-style:normal;font-size:11px;font-weight:900;color:#8a7a62}
.ms-stamp{font-style:normal;display:grid;place-items:center;width:34px;height:34px;border:3px solid #b5281a;border-radius:50%;color:#b5281a;font-size:15px;font-weight:900;transform:rotate(-14deg);box-shadow:inset 0 0 0 2px #fbf3df,inset 0 0 0 3px #b5281a88;opacity:.85}
/* 一番上：全達成のまとめの帯 */
.ms-wrap .ms-sum{background:#3a2414;border-color:#2a1f16;box-shadow:inset 0 0 0 2px #c9a24a;color:#fff6df;min-height:52px}
.ms-wrap .ms-sum .ms-mid>b{color:#ffe08a;font-size:12px}
.ms-wrap .ms-sum .ms-prog small{color:#fff6df}
.ms-wrap .ms-sum .ms-rw{order:2;flex-basis:40px;background:#2a1a0e}
.ms-wrap .ms-sum .ms-act{order:3}
.ms-wrap .ms-sum .ms-yet{color:#d9c49a}
.ms-wrap .ms-sum.ready{background:#7a1d10;animation:msGlow 1.4s ease-in-out infinite}
.ms-wrap .ms-sum.got{opacity:.6}
.ms-note{text-align:center;font-size:11px;color:#7a6a5a;margin:4px 0 2px}
.ms-wrap .ms-done{margin:30px 8px;color:#5a3a22}
/* 下の段 */
.ms-foot{flex:0 0 auto;display:flex;gap:8px;justify-content:space-between;padding-top:8px}
.ms-foot .btn{flex:1;margin:0!important;min-width:0}
.ms-foot .ms-allbtn{flex:1.4;width:auto;display:flex;align-items:center;justify-content:center}
.ms-foot .ms-allbtn[disabled]{filter:grayscale(1) brightness(.9);opacity:.6}
/* 受け取ったお知らせ：場所を取らず、上に出て消える */
.ms-toast{position:absolute;left:8px;right:8px;bottom:60px;margin:0;padding:8px 10px;text-align:center;font-weight:900;font-size:13px;color:#fff6df;background:#2a1f16ee;border:2px solid #c9a24a;pointer-events:none;animation:msToast 2.4s ease forwards;z-index:3}
@keyframes msToast{0%{opacity:0;transform:translateY(8px)}10%,75%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-6px)}}
.ms-foot .btn{height:44px;border-width:8px 14px 10px!important;padding:0 2px!important;font-size:15px!important;white-space:nowrap;line-height:1}
.ms-foot .ms-allbtn{flex:1.6}
/* 2026-10-22 遊び方（メニュー）：ページを送っても窓の大きさが変わらない。全ページを重ねて、いちばん長いページの大きさに */
.help-stack{flex:1;display:grid;min-width:0}
.help-stack>.guide-say{grid-area:1/1;visibility:hidden}
.help-stack>.guide-say.on{visibility:visible}
.modal-row .ghost-off{visibility:hidden;pointer-events:none}
/* 2026-10-22 ユーザー：タップで枠の大きさが変わらないように → 「〜を買った」などのお知らせは行を足さず、上に重ねて出して消す */
.toast-msg{position:fixed;left:50%;bottom:calc(104px + env(safe-area-inset-bottom));transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);margin:0;padding:8px 14px;text-align:center;font-weight:900;font-size:13px;color:#fff6df;background:#2a1f16ee;border:2px solid #c9a24a;pointer-events:none;z-index:60;animation:toastMsg 2.6s ease forwards}
.modal .toast-msg{position:absolute;bottom:14px}
@keyframes toastMsg{0%{opacity:0;translate:0 8px}10%,78%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -6px}}
.modal .toast-msg{position:sticky;left:auto;transform:none;bottom:8px;display:block;margin:-38px auto 0;height:38px;box-sizing:border-box;line-height:20px;white-space:nowrap}
.tuto-stack{display:grid}.tuto-stack>p{grid-area:1/1;visibility:hidden}.tuto-stack>p.on{visibility:visible}

/* 2026-10-22 窓は、上の石の表示と下のタブの間に収める（ショップの下がタブに隠れていた） */
body:has(.hud) .overlay{padding-top:calc(56px + env(safe-area-inset-top))}
body:has(.tabbar) .overlay{padding-bottom:calc(86px + env(safe-area-inset-bottom))}
.overlay>.modal{max-height:100%}
/* 1文字だけ次の行に落ちないように。右の札を少し細く */
.ms-mid>b{font-size:12.5px;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
.ms-act{flex-basis:66px}
.ms-rw{flex-basis:42px}

/* 2026-10-22 ユーザー決定：フォントは B ロックンロール（RocknRoll One・フォントワークス製の無料フォント）。
   調べたゲームはどれも1つの太いフォントでタブ・ボタン・文・数字をそろえていた → 見出しも本文も同じにする。
   太さが1つしかないので、太字のにせもの（にじむ）を作らせない。漫画の文字（MgKana）はそのまま */
:root{--game-font:'RocknRoll One','Hiragino Maru Gothic ProN',sans-serif;--body-font:'RocknRoll One','Hiragino Maru Gothic ProN',sans-serif}
body{font-synthesis:none}
#manga,.manga{font-synthesis:weight}

/* 受け取る・まとめて受け取る：金の板の模様に字が溶けて読みづらい → 白い字に太い焦げ茶のふち、下に影。字も少し大きく */
.btn.primary[data-action^="ms-"]{color:#fff!important;-webkit-text-stroke:5px #5a2208!important;paint-order:stroke fill;text-shadow:0 2px 0 #3a1408;letter-spacing:.04em}
.ms-act{flex-basis:72px}
.ms-act .btn{font-size:13px!important;height:34px;display:flex!important;align-items:center;justify-content:center}
.ms-foot .btn{font-size:16px!important}
.ms-mid>b{font-size:12px;word-break:normal;overflow-wrap:normal;text-wrap:balance;letter-spacing:-.01em}
.ms-wrap .ms-row,.ms-wrap .ms-sum{gap:5px;padding:5px}
.ms-act{flex-basis:70px}
/* ロックンロールは字幅が少し広い → 大きいボタンの左右の余白を減らす。折り返すときは2行の長さをそろえる */
.btn{text-wrap:balance}
.btn.big{padding-left:4px!important;padding-right:4px!important;font-size:21px}
/* 最後の行が1文字だけにならないように（全体の保険） */
p,b,small,span,em,div,li,h2,h3{text-wrap:pretty}
.tr-note.fight{display:block;overflow:hidden}
.b3-card>b{display:block;overflow:hidden}
/* イベントの札：描き文字の画像がない札（賭場）も、ほかの札と同じ見え方に */
.event-card .ev-name{position:relative;z-index:1;font-size:21px;line-height:1.1;color:#fff;-webkit-text-stroke:5px #2a1408;paint-order:stroke fill;text-shadow:0 3px 0 #2a1408;letter-spacing:.02em;white-space:nowrap}

/* 2026-10-22 ユーザー：「白い四角の選択肢はバランスが悪い。探して全部直して」
   → 絵を使っていなかったボタン（白・ベタ塗りの四角）を、ぜんぶ赤の国の板で作り直す */
/* 小さいボタン（技・ログ・中断・名前をつける・お別れ・★を上げる など） */
.btn.small:not(.primary){background:none;border:0;border-style:solid;border-width:6px 16px 8px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/6px 16px 8px stretch;box-shadow:none;color:#2a1f16;padding:1px 2px;filter:drop-shadow(0 2px 0 #2a1f16);font-family:var(--game-font)}
.btn.small:not(.primary):disabled{filter:grayscale(1) brightness(.85);opacity:.7}
/* 窓の右上の × ：赤い板の札 */
.modal .close,.overlay .close{width:38px;height:36px;padding:0;background:none;border:0;border-style:solid;border-width:6px 10px 8px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/6px 10px 8px stretch;box-shadow:none;color:#fff;font-size:19px;line-height:1;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;filter:drop-shadow(0 2px 0 #2a1f16);display:grid;place-items:center}
/* 出来事・分かれ道・技を覚えるなどの選択肢：あたたかい木の板。文字は真ん中、説明は下に小さく */
.overlay .gchoice{justify-content:center;flex-direction:column;align-items:center;gap:1px;text-align:center;min-height:54px;margin-top:8px;background:none;border:0;border-style:solid;border-width:8px 22px 10px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/8px 22px 10px stretch;box-shadow:none;color:#2a1f16;padding:2px 4px;filter:drop-shadow(0 3px 0 #2a1f16)}
.overlay .gchoice>b{white-space:normal;font-size:16px;font-weight:400;flex:none}
.overlay .gchoice small{color:#5a3a22;font-weight:400;font-size:11.5px;line-height:1.35}
.overlay .gchoice.danger{border-image-source:url(art/ui/btn_red.png);border-image-slice:50 120 56 fill;color:#fff8e6}
.overlay .gchoice.danger>b{-webkit-text-stroke:3px #3a1408;paint-order:stroke fill}.overlay .gchoice.danger small{color:#ffe2c8}
.overlay .guide-list .gchoice{flex-direction:row;justify-content:flex-start;text-align:left}
/* タブ（ミッション・賭場）：仲間のタブと同じ、木の板／えらんでいる所は赤い板 */
.ms-tabs{border-bottom:0;gap:4px;margin-bottom:4px}
.ms-tab{background:none;border:0;border-style:solid;border-width:5px 12px 7px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/5px 12px 7px stretch;color:#3a2410;padding:3px 0 2px;font-size:12px;font-weight:400;filter:brightness(.88) drop-shadow(0 2px 0 #2a1f16);margin:0}
.ms-tab.on{border-image-source:url(art/ui/btn_red.png);border-image-slice:50 120 56 fill;color:#fff8e6;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;filter:drop-shadow(0 2px 0 #2a1f16);margin:0;padding-bottom:2px}
.ms-wrap .ms-body{border-top:2px solid #5a3a22}
/* ホームのミッションの帯：木の板 */
.ms-strip{background:none;border:0;border-style:solid;border-width:6px 18px 8px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 18px 8px stretch;box-shadow:none;padding:2px 2px;filter:drop-shadow(0 3px 0 #2a1f16)}
.ms-strip.ready{background:none;border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill}
/* お気に入り：小さい木の札／お気に入り中は赤い札 */
.rd-fav{background:none;border:0;border-style:solid;border-width:4px 11px 5px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/4px 11px 5px stretch;padding:0 2px;color:#3a2410;font-weight:400;filter:drop-shadow(0 2px 0 #2a1f16)}
.rd-fav.on{background:none;border-image-source:url(art/ui/btn_red.png);border-image-slice:50 120 56 fill;color:#fff;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
/* すごろく：サイコロをふる＝赤い板、道具＝木の板 */
.sg-roll{background:none;border:0;border-style:solid;border-width:10px 28px 12px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/10px 28px 12px stretch;box-shadow:none;border-radius:0;filter:drop-shadow(0 4px 0 #2a1f16);-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;min-height:62px}
.sg-roll:active{transform:translateY(3px);filter:drop-shadow(0 1px 0 #2a1f16)}
.sg-roll:disabled{filter:grayscale(.8) brightness(.8)}
.sg-roll-die{-webkit-text-stroke:0}
.sg-bagbtn{background:none;border:0;border-style:solid;border-width:8px 16px 10px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/8px 16px 10px stretch;box-shadow:none;border-radius:0;filter:drop-shadow(0 4px 0 #2a1f16)}
.sg-bagbtn{border-width:7px 9px 9px;border-image:url(art/ui/btn_wood.png) 40 60 46 fill/7px 9px 9px stretch;flex-basis:78px;white-space:nowrap}
/* すごろく：マスの結果のお知らせ＝白い四角 → あたたかい木の札 */
.sg-last{background:none;border:0;border-style:solid;border-width:9px 24px 11px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/9px 24px 11px stretch;box-shadow:none;padding:2px 2px;filter:drop-shadow(0 4px 0 #2a1f16);color:#2a1f16}
.sg-last b{color:#8a2410;font-weight:400}

/* 白い四角の箱（押せない所）も赤の国の物で：
   大きいお知らせ（中断中の修行）＝縄の岩の板、カード・行・札＝あたたかい木の板 */
.resume{background:none!important;box-shadow:none!important;border:0!important;border-style:solid!important;border-width:24px 18px 16px!important;border-image:url(art/ui/tr/red_board_v2.png) 100 70 64 70 fill/24px 18px 16px stretch!important;padding:2px 6px 4px!important;filter:drop-shadow(0 4px 0 #0006)}
.it-card,.news li,.lead-note,.mine .mn-info,.tw-floors li,.dv-stat span,.rd-stats>div,.ms-wrap .ms-row{background:none!important;border:0!important;border-style:solid!important;border-width:6px 16px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 16px 8px stretch!important;box-shadow:none!important;filter:drop-shadow(0 2px 0 #2a1f1699)}
.it-card,.ms-wrap .ms-row{padding:2px 0!important}
.news li,.lead-note,.mine .mn-info{padding:2px 4px!important}
.tw-floors li{padding:1px 2px!important}
.tw-floors li.now{border-image-source:url(art/ui/btn_gold.png)!important;border-image-slice:50 120 56 fill!important}
.tw-floors li.mid{border-image-source:url(art/ui/btn_red.png)!important;border-image-slice:50 120 56 fill!important;color:#fff8e6}
.tw-floors li.mid small,.tw-floors li.mid b{color:#fff8e6;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
.dv-stat span{padding:0 4px!important}
.rd-stats>div{padding:2px 0!important}
.ms-wrap .ms-row.ready{border-image-source:url(art/ui/btn_gold.png)!important;border-image-slice:50 120 56 fill!important;border-width:7px 18px 9px!important}
.ms-wrap .ms-row.got{border-image-source:url(art/ui/btn_ash.png)!important;filter:none}
.tower .tw-floors li{border:0!important;border-style:solid!important;border-width:6px 14px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 14px 8px stretch!important;background:none!important;box-shadow:none!important;padding:1px 2px!important}
.tower .tw-floors li.now{border-image:url(art/ui/btn_gold.png) 50 120 56 fill/6px 14px 8px stretch!important}
.tower .tw-floors li.mid{border-image:url(art/ui/btn_red.png) 50 120 56 fill/6px 14px 8px stretch!important}
.tower .tw-floors li.now{outline:0!important;box-shadow:none!important}
.home-resume{background:none!important;box-shadow:none!important;border:0!important;border-style:solid!important;border-width:24px 18px 16px!important;border-image:url(art/ui/tr/red_board_v2.png) 100 70 64 70 fill/24px 18px 16px stretch!important;padding:0 4px 2px!important;filter:drop-shadow(0 4px 0 #0006)}
/* ホームのミッションの帯：1行に収める（長い時は「…」） */
.ms-strip{border-width:6px 14px 8px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 14px 8px stretch}
.ms-strip b{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.ms-strip .ms-more{display:none}
.resume,.home-resume{border-width:30px 20px 20px!important;border-image:url(art/ui/frame_v3.png) 142 110 110 fill/30px 20px 20px stretch!important;padding:0 2px 0!important}
/* 板のふちは細めに（中の文が窮屈にならないように） */
.it-card,.ms-wrap .ms-row{border-width:5px 10px 7px!important}
.ms-wrap .ms-row.ready{border-image-source:url(art/ui/btn_wood_warm.png)!important;border-image-slice:40 110 46 fill!important;border-width:5px 10px 7px!important;filter:drop-shadow(0 0 4px #f2b13a) drop-shadow(0 2px 0 #2a1f1699)}
.ms-mid>b{font-size:12px}
/* 道具カード：名前の行に★、種類は小さい札。説明は下に。右の「持っている／値段」は幅を決める */
.it-body{flex:1;min-width:0}
.it-body>b{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;font-size:14px;font-weight:400;line-height:1.25}
.it-body>b small{font-size:10px;color:#8a5a1a;white-space:nowrap}
.it-body>span{display:block;font-size:11.5px;line-height:1.4;color:#3a2a1a;margin-top:1px}
.it-buy{flex:0 0 70px;align-items:center}
.it-buy small{white-space:nowrap}
.it-buy{flex-basis:76px}
.it-card .it-buy .btn{white-space:nowrap;font-size:12.5px;width:100%;border-width:6px 12px 8px!important}
/* 坑道：まだ入れない層＝灰の板 */
.mn-step.locked{background:none!important;border:0!important;border-style:solid!important;border-width:6px 16px 8px!important;border-image:url(art/ui/btn_ash.png) 40 110 46 fill/6px 16px 8px stretch!important;color:#6a6258!important;box-shadow:none!important;filter:brightness(.8);display:flex;align-items:center;justify-content:center}
/* 連れていく子のカード（出撃準備・塔・坑道・レイド・ぶとうかい）：えらんでいない＝木の板、えらんだ＝金の板 */
button.sb-cand{background:none!important;border:0!important;border-style:solid!important;border-width:7px 14px 9px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/7px 14px 9px stretch!important;box-shadow:none!important;filter:drop-shadow(0 3px 0 #2a1f16)}
button.sb-cand.on{border-image:url(art/ui/btn_gold.png) 50 120 56 fill/7px 14px 9px stretch!important;filter:drop-shadow(0 0 5px #f2b13a) drop-shadow(0 3px 0 #2a1f16)}
button.sb-cand.lead{outline:0}
.cs-body .ms-row{background:none!important;border:0!important;border-style:solid!important;border-width:6px 14px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 14px 8px stretch!important;box-shadow:none!important;padding:2px 2px!important;filter:drop-shadow(0 2px 0 #2a1f1699);min-height:48px}
/* 戦闘前の敵・味方のカード：木の板（敵は赤みの板） */
.b3-card{background:none!important;border:0!important;border-style:solid!important;border-width:6px 12px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 12px 8px stretch!important;box-shadow:none!important;filter:drop-shadow(0 2px 0 #2a1f16)}
/* 修行の準備・確認：育てる子＝縄の岩の板、仲間の小さいカード＝木の板、修行地の札＝赤い板 */
.su-hero{background:none!important;box-shadow:none!important;border:0!important;border-style:solid!important;border-width:28px 20px 20px!important;border-image:url(art/ui/frame_v3.png) 142 110 110 fill/28px 20px 20px stretch!important;padding:0 2px!important}
.su-slot{background:none!important;border:0!important;border-style:solid!important;border-width:4px 7px 5px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/4px 7px 5px stretch!important;box-shadow:none!important}
.su-sum-place{background:none!important;border:0!important;border-style:solid!important;border-width:6px 18px 8px!important;border-image:url(art/ui/btn_red.png) 50 120 56 fill/6px 18px 8px stretch!important;color:#fff8e6!important;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;padding:0 4px!important}
/* 確認画面：中身を上下の真ん中に。育てる子は大きめに */
.su-body:has(>.su-sum){display:flex;flex-direction:column;justify-content:center}
.su-sum .su-hero{padding:6px 4px!important}
.su-sum .su-hero .mon-img,.su-sum .su-hero canvas,.su-sum .su-hero img{transform:scale(1.15);transform-origin:center}
.su-sum .su-slots{margin-top:10px}
/* 窓の下のボタン：右寄せ・大きさばらばら → 左右に同じ幅で並べる（1つだけなら真ん中） */
.modal-actions{display:flex;justify-content:center;flex-wrap:nowrap;gap:8px;margin-top:12px}
.modal-actions>.btn{flex:1 1 0;max-width:220px;margin:0!important;min-width:0;white-space:nowrap}
/* 赤い大きいボタンは両はしに炎の飾り → 余白をもどす。入りきらない時は字を自動で小さく（app.js fitNames） */
.btn.big.primary{padding-left:20px!important;padding-right:20px!important}
.modal-actions>.btn.big{font-size:17px}
/* 窓の下のボタン（決定）：横に2つだと炎の飾りで字が入らない → 同じ幅で縦に並べる */
.modal-actions{flex-direction:column;align-items:center;gap:6px}
.modal-actions>.btn{flex:none;width:100%;max-width:270px}
.modal-actions>.btn.big{font-size:20px}
/* 準備画面の下の段：はみ出さないように、大きいボタンも縮められるように */
.su-foot{gap:8px;padding-left:10px;padding-right:10px;box-sizing:border-box}
.su-foot>.btn{min-width:0;margin:0!important}
.su-foot>.btn.big.primary{flex:1 1 auto;padding-left:14px!important;padding-right:14px!important;font-size:17px}
/* 赤の修行：「バトルまで あと〇日」＝木の札、能力の数字＝小さい木の札 */
.tr-count{background:none!important;border:0!important;border-style:solid!important;border-width:6px 16px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 16px 8px stretch!important;box-shadow:none!important;filter:drop-shadow(0 2px 0 #2a1f16);padding:0 2px!important}
.tr-stats .tr-st{background:none!important;border:0!important;border-style:solid!important;border-width:4px 8px 5px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/4px 8px 5px stretch!important;box-shadow:none!important}
.tr-stats .tr-st{position:relative}
.tr-stats .tr-st::before{content:'';position:absolute;left:0;right:0;top:-3px;height:3px;background:var(--c);border-radius:2px}
/* 赤の修行：練習・出来事の結果の知らせ＝白い四角 → あたたかい木の札 */
.tr-last{background:none!important;border:0!important;border-style:solid!important;border-width:8px 22px 10px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/8px 22px 10px stretch!important;box-shadow:none!important;filter:drop-shadow(0 3px 0 #2a1f16);color:#2a1f16}
.tr-last b{color:#8a2410;font-weight:400}
/* 戦闘の終わりの「つづける」：白い四角 → 赤い板 */
.b3-big button:not(.b3-again){background:none!important;border:0!important;border-style:solid!important;border-width:9px 26px 11px!important;border-image:url(art/ui/btn_red.png) 50 120 56 fill/9px 26px 11px stretch!important;box-shadow:none!important;color:#fff8e6!important;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;font-family:var(--game-font);font-size:20px!important;padding:4px 30px!important;filter:drop-shadow(0 3px 0 #2a1f16)}

/* 2026-10-22 ユーザー：練習の札はゆらさない。絵は大きすぎる → 上がる能力をわかりやすく
   ほかのサクセスゲーム（パワプロ・カムトラ・シャチバト・LINEモンスターファーム・ウマ娘・ブルーロック）のいいところ：
   ・札は小さめ、上がる能力は札の下に色の札で全部（いちばん上がるものを先頭に大きく）
   ・1回目のタップで札が持ち上がり、上の能力の欄に「+28」が出る（ウマ娘・シャチバト・LINEモンスターファーム）
   ・2回目で開始（カムトラ）。案内はゆらさない */
.tr .train.tr-card{flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;gap:2px!important;text-align:center!important;transition:transform .12s ease-out,filter .12s}
.tr-board.red .tr-art{height:auto!important;flex:1 1 auto;min-height:0;max-height:66%;align-self:center;aspect-ratio:267/404;position:relative}
.tr-art .tr-mates{position:absolute;right:-22%;top:6%;display:flex;flex-direction:column;gap:1px;z-index:2}
.tr-art .tr-face{width:18px!important;height:18px!important}
.tr-card .tr-gain-big{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;max-width:100%;flex:0 0 auto}
.tr-card .tr-gain-big .g{font-size:11px!important;line-height:1.2;padding:0 3px!important;border-left-width:4px!important;white-space:nowrap}
.tr-card .tr-gain-big .g.main{font-size:14px!important;padding:0 4px!important;flex-basis:auto}
.tr-card .tr-gain-big .g b{margin-left:1px}
/* えらんだ札：赤い四角はやめて、金色に光って少し持ち上がる。案内の札はゆらさない */
.tr .train.tr-card.armed{outline:0!important;box-shadow:none!important;transform:translateY(-5px);filter:drop-shadow(0 0 6px #ffd25a) drop-shadow(0 0 2px #ffd25a)!important}
.tr .train.tr-card .arm-hint{animation:none!important;transform:translateX(-50%);bottom:auto;top:58%;background:none;border:0;border-style:solid;border-width:4px 11px 5px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/4px 11px 5px stretch;color:#fff8e6;font-size:10.5px;font-weight:400;padding:0 1px;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill;z-index:4}
.arm-hint{animation:none!important}
/* 能力の欄：えらんだ練習で上がる数字を、それぞれの欄の上に大きく */
.tr-stats{position:relative}
.tr-stats .tr-up{position:absolute;left:50%;top:-17px;transform:translateX(-50%);font-style:normal;font-size:15px;line-height:1;color:#ffb12a;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;white-space:nowrap;z-index:5;animation:trUp .22s cubic-bezier(.2,1.6,.4,1)}
.tr-stats.pv .tr-st em{display:none}
.tr-stats.pv .tr-st:has(.tr-up){filter:drop-shadow(0 0 4px #ffb12a)}
@keyframes trUp{from{opacity:0;transform:translateX(-50%) translateY(6px) scale(.6)}to{opacity:1;transform:translateX(-50%) scale(1)}}
.tr .train.tr-card .arm-hint{top:-4px;bottom:auto}

/* 2026-10-22 修行の終わりの評価画面（作り直し）。赤の国の物：リボン・戦旗・縄の枠・木の板・判子 */
.fin{max-width:520px;margin:0 auto;padding:4px 10px 16px;font-family:var(--game-font)}
.fin *{font-family:inherit;font-weight:400}
/* 能力の文字ランクの色（パワプロ・ブルーロックのように色で強さがわかる） */
.gr{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 3px;font-size:17px;line-height:1;color:#fff;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill;border:2px solid #2a1408;border-radius:4px;background:#8d8a84}
.gr-S{background:linear-gradient(#ffe27a,#e8a21a 55%,#c4501a)}.gr-A{background:linear-gradient(#ff9a6a,#d9482b)}.gr-B{background:linear-gradient(#ffc76a,#e88a1a)}
.gr-C{background:linear-gradient(#9bd86a,#4a9a3a)}.gr-D{background:linear-gradient(#8ac4f0,#3a7ac0)}.gr-E{background:linear-gradient(#c9c4bb,#8d8a84)}
/* 見出し：金のリボン */
.fin-ribbon{position:relative;margin:4px -6px 6px;height:52px;background:url(art/ui/ribbon.png) center/100% 100% no-repeat;display:grid;place-items:center;animation:finDrop .45s cubic-bezier(.2,1.5,.4,1) both}
.fin-ribbon span{margin-top:-6px;font-size:17px;color:#fff;-webkit-text-stroke:4px #6a2a08;paint-order:stroke fill;white-space:nowrap;max-width:76%;overflow:hidden;text-overflow:ellipsis}
.fin-lose .fin-ribbon{filter:saturate(.55) brightness(.9)}
/* 舞台：修行地の背景にキャラ大きく、右に戦旗、左下に名札 */
.fin-stage{position:relative;height:250px;background-size:cover;background-position:center 70%;border:0;border-style:solid;border-width:30px 20px 20px;border-image:url(art/ui/frame_v3.png) 142 110 110 fill/30px 20px 20px stretch;overflow:hidden}
.fin-stage::before{content:'';position:absolute;inset:0;background:url(inherit)}
.fin-hero{position:absolute;left:4%;bottom:-2%;width:62%;height:100%;display:flex;align-items:flex-end;justify-content:center;animation:finHero .5s .1s cubic-bezier(.2,1.3,.4,1) both}
.fin-hero .mon-img{max-height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 0 #2a1f1680)}
.fin-flag{position:absolute;right:2%;top:-4%;width:34%;height:104%;background:url(art/ui/banner.png) center top/contain no-repeat;display:flex;flex-direction:column;align-items:center;padding-top:16%;padding-left:12%;box-sizing:border-box;animation:finFlag .6s .35s cubic-bezier(.2,1.6,.4,1) both}
.fin-flag b{font-size:64px;line-height:1;color:#fff4c8;-webkit-text-stroke:7px #3a1408;paint-order:stroke fill;text-shadow:0 4px 0 #3a1408;background:none!important;animation:finStamp .5s .75s cubic-bezier(.2,1.8,.4,1) both}
.fin-flag b.gr-S{color:#ffe27a}.fin-flag b.gr-A{color:#ffb08a}
.fin-flag small{margin-top:4px;font-size:10px;color:#fff1cf;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill}
.fin-flag strong{font-size:20px;color:#fff;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;line-height:1.1}
.fin-plate{position:absolute;left:2%;bottom:2%;display:flex;flex-direction:column;align-items:flex-start;border:0;border-style:solid;border-width:5px 14px 7px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/5px 14px 7px stretch;padding:0 4px;filter:drop-shadow(0 2px 0 #2a1f16)}
.fin-plate i{font-style:normal;font-size:11px;color:#ffd75e;letter-spacing:1px;line-height:1.1;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
.fin-plate b{font-size:18px;color:#fff;-webkit-text-stroke:4px #3a1408;paint-order:stroke fill;line-height:1.1}
/* 次のランクまで */
.fin-next{display:flex;align-items:center;gap:8px;margin:8px 2px 4px;font-size:12.5px;color:#3a2a1a}
.fin-next span{white-space:nowrap}.fin-next .gr{min-width:20px;height:20px;font-size:14px;vertical-align:middle}
.fin-gauge{flex:1;height:10px;background:#3a2414;border:2px solid #2a1f16;border-radius:6px;overflow:hidden;display:block}
.fin-gauge>i{display:block;height:100%;background:linear-gradient(#ffe27a,#e8952a);animation:finGauge .8s .9s ease-out both}
.fin-next.top span{color:#c4501a;font-size:15px}
/* 能力：6角形のグラフ＋色つき文字ランク */
.fin-board{display:flex;align-items:center;gap:4px;margin-top:6px;border:0;border-style:solid;border-width:10px 18px 12px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/10px 18px 12px stretch;padding:2px 0;filter:drop-shadow(0 3px 0 #2a1f1699)}
.fin-chart{flex:0 0 44%}
.fin-radar{width:100%;height:auto;display:block}
.fin-radar .rg{fill:none;stroke:#8a5a2a;stroke-width:1;opacity:.55}.fin-radar .rg0{fill:#fff6df88;stroke-width:1.5;opacity:1}
.fin-radar .ax{stroke:#8a5a2a;stroke-width:.8;opacity:.45}
.fin-radar .val{fill:#e8702a88;stroke:#c4401a;stroke-width:2.5;stroke-linejoin:round;transform-origin:90px 94px;animation:finRadar .7s .5s cubic-bezier(.2,1.4,.4,1) both}
.fin-radar .lb{font-size:11px;fill:#3a2414;text-anchor:middle;font-family:'RocknRoll One',sans-serif}
.fin-stats{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.fin-st{display:grid;grid-template-columns:3.2em 26px 1fr auto;align-items:center;gap:4px;animation:finRow .35s calc(.5s + var(--k)*70ms) ease-out both}
.fin-st-n{font-size:12px;color:#3a2414}
.fin-st strong{font-size:18px;color:#2a1408;text-align:right}
.fin-st em{font-style:normal;font-size:11px;color:#3a8a2a;min-width:2.6em;text-align:right}
/* 戦いの記録：判子 */
.fin-h{margin:12px 2px 4px;font-size:14px;color:#3a1408;display:flex;align-items:center;gap:6px}
.fin-h::before{content:'';width:6px;height:16px;background:#c4401a;border-radius:2px}
.fin-bts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.fin-bt{display:flex;flex-direction:column;align-items:center;border:0;border-style:solid;border-width:5px 10px 7px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/5px 10px 7px stretch;padding:0 0 2px;min-height:64px}
.fin-bt small{font-size:10px;color:#5a3a22}
.fin-bt b{width:30px;height:30px;display:grid;place-items:center;border:3px solid #b5281a;border-radius:50%;color:#b5281a;font-size:16px;transform:rotate(-10deg);box-shadow:inset 0 0 0 2px #fbf3df,inset 0 0 0 3px #b5281a66;background:#fbf3df}
.fin-bt.lose b{border-color:#3a3a6a;color:#3a3a6a;box-shadow:inset 0 0 0 2px #fbf3df,inset 0 0 0 3px #3a3a6a66}
.fin-bt.none b{border-color:#a89a84;color:#a89a84;box-shadow:none;transform:none}
.fin-bt span{font-size:9px;color:#3a2414;line-height:1.2;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 技：色の札 */
.fin-sks{display:flex;flex-wrap:wrap;gap:5px}
.fin-sk{border:0;border-style:solid;border-width:4px 12px 6px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/4px 12px 6px stretch;font-size:12.5px;color:#2a1408;padding:0 2px}
.fin-sk.own{border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill}
.fin-sk i{font-style:normal;color:#c4401a;margin-left:2px}
.fin-sk.none{opacity:.6}
/* 手に入れたもの：1行ずつ */
.fin-gets{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.fin-gets li{display:flex;align-items:center;gap:8px;border:0;border-style:solid;border-width:5px 14px 7px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/5px 14px 7px stretch;padding:0 4px;font-size:13px;color:#2a1408}
.fin-gets li img{width:22px;height:22px;object-fit:contain}
.fin-gets li b{margin-left:auto;font-size:17px;color:#c4401a}
.fin-gets li.note{font-size:11.5px;color:#5a3a22}
.fin-actions{margin-top:14px;display:flex;justify-content:center}
.fin-actions .btn{width:100%;max-width:300px}
@keyframes finDrop{from{opacity:0;transform:translateY(-24px) scale(.9)}to{opacity:1;transform:none}}
@keyframes finHero{from{opacity:0;transform:translateX(-30px) scale(.9)}to{opacity:1;transform:none}}
@keyframes finFlag{from{opacity:0;transform:translateY(-60%)}to{opacity:1;transform:none}}
@keyframes finStamp{0%{opacity:0;transform:scale(2.6) rotate(-14deg)}60%{opacity:1;transform:scale(.9) rotate(-6deg)}100%{opacity:1;transform:rotate(-4deg)}}
@keyframes finGauge{from{width:0}}
@keyframes finRadar{from{transform:scale(.1);opacity:0}to{transform:none;opacity:1}}
@keyframes finRow{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fin *{animation:none!important}}
.fin-stage{border-image:url(art/ui/frame_v3.png) 142 110 110/30px 20px 20px stretch;background-origin:border-box;background-clip:padding-box}
/* 出撃の準備：この話で決まっている子のカードも木の板（えらべる子と同じ） */
.sb-fixed{background:none!important;border:0!important;border-style:solid!important;border-width:7px 16px 9px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/7px 16px 9px stretch!important;box-shadow:none!important;outline:0!important;padding:2px 4px!important;filter:drop-shadow(0 3px 0 #2a1f16);color:#2a1f16;margin-bottom:6px}
.sb-fixed.lead{border-image-source:url(art/ui/btn_gold.png)!important;border-image-slice:50 120 56 fill!important}
.practice-skip{background:none!important;border:0!important;border-style:solid!important;border-width:5px 13px 6px!important;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/5px 13px 6px stretch!important;box-shadow:none!important;color:#2a1f16!important;padding:0 2px!important;filter:drop-shadow(0 2px 0 #2a1f16);font-family:var(--game-font)}
/* 窓の下のボタンは、大きいボタンもふつうのボタンも同じ字の大きさ */
.modal-actions>.btn,.modal-actions>.btn.big{font-size:18px!important;min-height:50px}
/* 木の板のボタンの字は、どれも同じ見え方（焦げ茶の字＋明るいふち）にそろえる */
.btn.primary[data-action="close"],.modal .btn:not(.primary):not(.small){color:#3a2410!important;-webkit-text-stroke:3px #fff6df!important;paint-order:stroke fill;letter-spacing:.03em;text-shadow:none!important}

/* 2026-10-22 ユーザー：「数字とか文字が描いてあるだけ」→ 部品にする
   板は縦に：上に6角形のグラフ（頂点に色の名札＋ランク）、真ん中に次のランクの札、下に能力の行（彫り込んだみぞ・色の名札・ゲージ・ランク札・白い数字） */
.fin-board{flex-direction:column;align-items:stretch;gap:6px;padding:6px 2px 4px}
.fin-chart{flex:none;position:relative;width:min(240px,74%);margin:0 auto}
.fin-radar .rg0{fill:#fff3d6;stroke:#6a3a12;stroke-width:2}
.fin-radar .rg1,.fin-radar .rg2,.fin-radar .rg3{stroke-dasharray:3 3}
.fin-radar .val{fill:url(#none);fill:#f08a2acc;stroke:#b8381a;stroke-width:3}
.fin-radar .dot{stroke:#2a1408;stroke-width:1.5}
.fin-radar .d-hp{fill:var(--hp)}.fin-radar .d-atk{fill:var(--atk)}.fin-radar .d-def{fill:var(--def)}.fin-radar .d-spd{fill:var(--spd)}.fin-radar .d-hit{fill:var(--hit)}.fin-radar .d-spi{fill:var(--spi)}
.fin-ax{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:2px;animation:finRow .3s calc(.9s + var(--k,0)*60ms) ease-out both}
.fin-ax i{font-style:normal;font-size:11px;color:#fff;background:var(--c);border:2px solid #2a1408;border-radius:4px;padding:0 3px;line-height:1.35}
.fin-ax .gr{min-width:20px;height:20px;font-size:14px}
.st-hp{--c:var(--hp)}.st-atk{--c:var(--atk)}.st-def{--c:var(--def)}.st-spd{--c:var(--spd)}.st-hit{--c:var(--hit)}.st-spi{--c:var(--spi)}
/* 次のランク：木の札の中 */
.fin-board .fin-next{margin:0 4px;padding:4px 8px;background:#3a2414;border:2px solid #2a1408;border-radius:6px;box-shadow:inset 0 2px 0 #0006;color:#fff1cf}
.fin-board .fin-next b{color:#ffd75e}
.fin-board .fin-gauge{background:#1e120a;border-color:#6a4a2a}
/* 能力の行：板に彫り込んだ暗いみぞ */
.fin-stats{gap:4px;padding:0 4px}
.fin-st{grid-template-columns:30px 1fr 26px 40px 34px;gap:6px;background:linear-gradient(#2e1c10,#3e2716);border:2px solid #1e120a;border-radius:7px;box-shadow:inset 0 2px 3px #000a,0 1px 0 #ffffff40;padding:3px 6px 3px 4px;min-height:32px}
.fin-st-n{display:grid;place-items:center;height:22px;font-size:12px;color:#fff;background:var(--c);border:2px solid #1e120a;border-radius:5px;-webkit-text-stroke:2px #1e120a;paint-order:stroke fill}
.fin-bar{position:relative;height:12px;background:#140b05;border:1.5px solid #6a4a2a;border-radius:7px;overflow:hidden}
.fin-bar>i{position:absolute;left:0;top:0;bottom:0;border-radius:6px;background:linear-gradient(#fff6,transparent 55%),var(--c);box-shadow:0 0 6px var(--c);animation:finBar .7s calc(.6s + var(--k)*80ms) cubic-bezier(.2,1,.3,1) both}
.fin-bar>u{position:absolute;top:0;bottom:0;width:1.5px;background:#ffffff38;text-decoration:none}
.fin-st .gr{min-width:24px;height:24px;font-size:16px}
.fin-st strong{font-size:19px;color:#fff;-webkit-text-stroke:4px #1e120a;paint-order:stroke fill;text-align:right}
.fin-st em{font-size:11px;color:#7fe05a;-webkit-text-stroke:2px #1e120a;paint-order:stroke fill}
@keyframes finBar{from{width:0}}
.fin-ax{animation:finFade .3s .9s ease-out both}
@keyframes finFade{from{opacity:0}to{opacity:1}}
.fin-chart{width:min(210px,64%)}

/* 2026-10-22 ユーザー：旗に重ねたランクは見づらい／赤い板の名札は見づらい／四角い能力名はAIっぽい／半端な線は何？／最大は1000／無駄なスペース
   → ランクはLINEモンスターファームのように暗い札に大きな色の字。名前は景色の下を暗くした帯に白い大きな字。能力名は色の字だけ。目盛りの線はなし */
.fin-flag{display:none}
.fin-rank{position:absolute;right:3%;top:8%;width:36%;display:flex;flex-direction:column;align-items:center;padding:6px 4px 8px;background:linear-gradient(#2a1408ee,#3e2414ee);border:3px solid #c9a24a;border-radius:10px;box-shadow:0 0 0 2px #2a1408,0 6px 14px #0008;animation:finFlag .5s .3s cubic-bezier(.2,1.6,.4,1) both}
.fin-rank small{font-size:13px;color:#ffe9b0;letter-spacing:.3em}
.fin-rank .rk{font-size:76px;line-height:.95;margin:2px 0;color:#fff;text-shadow:0 0 0 #000;-webkit-text-stroke:0;filter:drop-shadow(0 0 1px #2a1408) drop-shadow(2px 0 0 #2a1408) drop-shadow(-2px 0 0 #2a1408) drop-shadow(0 2px 0 #2a1408) drop-shadow(0 -2px 0 #2a1408) drop-shadow(0 4px 0 #2a1408);animation:finStamp .5s .7s cubic-bezier(.2,1.8,.4,1) both}
.fin-rank .rk-S{color:#ffd44a;background:linear-gradient(#fff6b0,#ffd44a 45%,#e88a1a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank .rk-A{background:linear-gradient(#ffc0a0,#ff6a3a 50%,#c4281a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank .rk-B{background:linear-gradient(#ffe0a0,#ffa22a 50%,#d0701a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank .rk-C{background:linear-gradient(#d8ffb0,#7ad04a 50%,#3a8a2a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank .rk-D{background:linear-gradient(#c8e8ff,#5aa8f0 50%,#2a62b0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank .rk-E{background:linear-gradient(#f0ece4,#b8b2a8 50%,#77726a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fin-rank span{display:flex;flex-direction:column;align-items:center;font-size:11px;color:#ffe9b0;line-height:1.2}
.fin-rank strong{font-size:24px;color:#fff;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
.fin-hero{width:60%}
/* 名前：景色の下を暗くした帯に、白い大きな字 */
.fin-plate{left:0;right:0;bottom:0;border:0;border-image:none;padding:18px 12px 6px;flex-direction:row;align-items:baseline;gap:8px;background:linear-gradient(transparent,#1e120acc 55%);filter:none}
.fin-plate b{font-size:24px;-webkit-text-stroke:5px #1e120a}
.fin-plate i{font-size:15px;letter-spacing:0;-webkit-text-stroke:3px #1e120a;order:2}
/* 6角形：頂点は色の字＋数字＋ランク */
.fin-chart{width:min(300px,92%)}
.fin-ax{gap:3px;white-space:nowrap}
.fin-ax i{background:none;border:0;padding:0;font-size:12px;color:var(--c);-webkit-text-stroke:3px #fff6df;paint-order:stroke fill}
.fin-ax strong{font-size:15px;color:#2a1408;-webkit-text-stroke:3px #fff6df;paint-order:stroke fill}
.fin-ax .gr{min-width:18px;height:18px;font-size:12px}
/* 能力の行：四角い名札はやめて色の字。ゲージは1000が最大 */
.fin-st{grid-template-columns:2.6em 1fr 24px 38px 36px}
.fin-st-n{background:none;border:0;height:auto;font-size:13px;color:var(--c);-webkit-text-stroke:0;filter:brightness(1.35) saturate(1.1);place-items:center start}
.fin-bar>u{display:none}
/* 手に入れたもの：横に並ぶ小さい札（長い板の空きをなくす） */
.fin-gets{flex-direction:row;flex-wrap:wrap;gap:6px}
.fin-gets li{flex:1 1 0;min-width:0;flex-direction:column;align-items:center;gap:0;padding:2px 2px 4px;border-width:6px 12px 8px}
.fin-gets li img{width:30px;height:30px}
.fin-gets li span{font-size:11px;color:#5a3a22;white-space:nowrap}
.fin-gets li b{margin:0;font-size:20px}
.fin-gets li.wide,.fin-gets li.note{flex-basis:100%;flex-direction:row}
.fin-gets li.wide b{margin-left:auto}
/* ランクの字：色つきの字＋太いふち（グラデーションの切り抜きはやめる） */
.fin-rank .rk{-webkit-text-fill-color:currentColor!important;background:none!important;filter:none;-webkit-text-stroke:8px #1e120a;paint-order:stroke fill;text-shadow:0 5px 0 #1e120a}
.fin-rank .rk-S{color:#ffd44a}.fin-rank .rk-A{color:#ff7a4a}.fin-rank .rk-B{color:#ffa83a}.fin-rank .rk-C{color:#8ad85a}.fin-rank .rk-D{color:#6ab4f4}.fin-rank .rk-E{color:#d0cac0}
.fin-chart{width:min(260px,84%)}
/* 手に入れたもの：横並びの札は低く（空きをなくす） */
.fin-gets li{flex-direction:row;justify-content:center;gap:4px;padding:2px 2px}
.fin-gets li img{width:24px;height:24px}
.fin-gets li span{display:none}
.fin-gets li b{font-size:18px}

/* 2026-10-22 ユーザー：無駄なスペース → 6角形と能力の行を横に並べる */
.fin-two{display:flex;align-items:center;gap:2px}
.fin-two .fin-chart{flex:0 0 46%;width:auto;margin:0}
.fin-two .fin-stats{flex:1;min-width:0;padding:0 2px 0 0;gap:3px}
.fin-ax{flex-direction:column;gap:0;line-height:1}
.fin-ax i{font-size:10px}.fin-ax strong{font-size:12.5px}
.fin-two .fin-st{display:grid;grid-template-columns:1fr 20px 34px 30px;grid-template-rows:auto 6px;column-gap:3px;row-gap:2px;padding:3px 5px 4px;min-height:0;border-radius:6px}
.fin-two .fin-st-n{font-size:11.5px}
.fin-two .fin-st .gr{min-width:20px;height:20px;font-size:13px}
.fin-two .fin-st strong{font-size:16px}
.fin-two .fin-st em{font-size:10px;text-align:right}
.fin-two .fin-bar{grid-column:1/-1;height:6px;border-width:1px}
.fin-board .fin-next{margin:0 4px 2px}
.fin-two .fin-chart{flex-basis:49%;margin-left:-4px}
.fin-ax i{font-size:11px}.fin-ax strong{font-size:14px}

/* 2026-10-22 ユーザー：評価画面はスクロールなしで全部見せる（ウマ娘・LINEモンスターファームの完了画面のように1枚に収める）。
   上の「もどる」はなし。下に「ホームへ戻る」「次の修行へ」を固定。キャラと評価は前の半分くらい */
body:has(.fin) .back-float{display:none}
.fin{height:100dvh;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;padding:6px 8px calc(70px + env(safe-area-inset-bottom));overflow:hidden}
.fin-ribbon{flex:0 0 auto;height:36px;margin:0 -4px}
.fin-ribbon span{font-size:14px;margin-top:-4px}
.fin-stage{flex:0 0 auto;height:118px;border-width:20px 14px 14px;border-image-width:20px 14px 14px}
.fin-hero{width:52%;left:0;bottom:-6%}
.fin-rank{top:4%;right:2%;width:auto;min-width:30%;height:92%;box-sizing:border-box;flex-direction:row;justify-content:center;gap:8px;padding:2px 10px;border-width:2px}
.fin-rank small{display:none}
.fin-rank .rk{font-size:44px;-webkit-text-stroke:6px #1e120a;text-shadow:0 3px 0 #1e120a;margin:0}
.fin-rank span{font-size:10px}
.fin-rank strong{font-size:20px}
.fin-plate{padding:10px 8px 2px}
.fin-plate b{font-size:17px;-webkit-text-stroke:4px #1e120a}
.fin-plate i{font-size:12px}
.fin-board{flex:1 1 auto;min-height:0;margin-top:0;padding:2px 0;border-width:8px 14px 10px;border-image-width:8px 14px 10px;gap:4px}
.fin-board .fin-next{padding:2px 8px;font-size:11.5px}
.fin-two{flex:1;min-height:0}
.fin-two .fin-stats{gap:2px}
.fin-two .fin-st{padding:2px 5px 3px;row-gap:1px;grid-template-rows:auto 5px}
.fin-two .fin-st strong{font-size:15px}
.fin-two .fin-st .gr{min-width:18px;height:18px;font-size:12px}
.fin-two .fin-bar{height:5px}
.fin-ax i{font-size:10px}.fin-ax strong{font-size:12.5px}
.fin-h{margin:2px 2px 2px;font-size:12px}
.fin-h::before{height:12px;width:5px}
.fin-bts{gap:4px}
.fin-bt{min-height:0;flex-direction:row;justify-content:center;gap:3px;border-width:4px 8px 5px;padding:0}
.fin-bt small{font-size:9.5px}
.fin-bt b{width:22px;height:22px;font-size:12px;border-width:2px}
.fin-bt span{display:none}
.fin-sks{gap:4px}.fin-sk{font-size:11.5px;border-width:3px 10px 5px}
.fin-gets li{border-width:4px 10px 6px}
.fin-gets li img{width:20px;height:20px}.fin-gets li b{font-size:15px}
/* 下に固定：ホームへ戻る／次の修行へ */
.fin-actions{position:fixed;left:0;right:0;bottom:0;z-index:30;margin:0;display:flex;gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(#2a1f1600,#2a1f16 30%)}
.fin-actions .btn{flex:1;max-width:none;margin:0!important;height:52px;min-width:0;white-space:nowrap}
.fin-actions .btn:not(.primary){flex:0 0 38%;font-size:16px}
.fin-actions .btn.big.primary{font-size:19px}
.fin-pair{display:flex;gap:8px;flex:0 0 auto}
.fin-pair>div{flex:1;min-width:0}
.fin-pair .fin-gets{flex-wrap:nowrap;gap:3px}
.fin-pair .fin-gets li{border-width:4px 7px 6px;gap:2px;padding:0}
.fin-pair .fin-gets li img{width:16px;height:16px}.fin-pair .fin-gets li b{font-size:13px}
body:has(.fin) main,body:has(.fin) #app{padding:0!important;margin:0!important}
html:has(.fin),body:has(.fin){overflow:hidden}
.fin-board{flex:0 0 auto}.fin-two{flex:none}
.fin-pair>div:first-child{flex:0 0 42%}
.fin-pair .fin-gets li{flex:1 1 auto}
.fin-pair .fin-gets li img{width:14px;height:14px}.fin-pair .fin-gets li b{font-size:12px;letter-spacing:-.02em}
.fin-stage{height:128px}
.fin-stage{height:min(160px,calc(100dvh - 622px))}
/* 画面が低くてもキャラをつぶさない：舞台は120〜170px。入りきらない時だけスクロール */
.fin-stage{height:clamp(120px,calc(100dvh - 622px),170px)!important;flex-shrink:0}
.fin{height:auto;min-height:100dvh;overflow:visible}
html:has(.fin),body:has(.fin){overflow:auto}
.fin{padding-bottom:calc(86px + env(safe-area-inset-bottom))}

/* 2026-10-22 評価画面：舞台と能力の板を合体。左＝キャラ（評価は左上・評価点）＋6角形、右＝能力 */
.fin-main{padding:4px 2px 6px}
.fin-main .fin-two{align-items:stretch;gap:6px}
.fin-left{flex:0 0 48%;min-width:0;display:flex;flex-direction:column;gap:4px}
.fin-hero2{position:relative;height:118px;border-radius:8px;border:2px solid #1e120a;box-shadow:inset 0 0 0 2px #c9a24a;background-size:cover;background-position:center 75%;overflow:hidden}
.fin-hero2 .fin-hero{position:absolute;left:18%;right:0;bottom:6px;top:4px;width:auto;height:auto}
.fin-rk{position:absolute;left:4px;top:0;z-index:2}
.fin-rk .rk{font-size:44px;line-height:1;-webkit-text-stroke:6px #1e120a;paint-order:stroke fill;text-shadow:0 3px 0 #1e120a;display:block;animation:finStamp .5s .5s cubic-bezier(.2,1.8,.4,1) both}
.fin-rk .rk-S{color:#ffd44a}.fin-rk .rk-A{color:#ff7a4a}.fin-rk .rk-B{color:#ffa83a}.fin-rk .rk-C{color:#8ad85a}.fin-rk .rk-D{color:#6ab4f4}.fin-rk .rk-E{color:#d0cac0}
.fin-score{position:absolute;right:4px;top:4px;z-index:2;display:flex;flex-direction:column;align-items:center;background:#1e120acc;border:1.5px solid #c9a24a;border-radius:6px;padding:1px 6px 2px;line-height:1.1}
.fin-score small{font-size:9px;color:#ffe9b0}.fin-score strong{font-size:17px;color:#fff}
.fin-hero2 .fin-plate{position:absolute;left:0;right:0;bottom:0;padding:12px 6px 2px;background:linear-gradient(transparent,#1e120ad0 55%);display:flex;align-items:baseline;gap:4px;border:0}
.fin-hero2 .fin-plate b{font-size:15px;color:#fff;-webkit-text-stroke:4px #1e120a;paint-order:stroke fill}
.fin-hero2 .fin-plate i{font-style:normal;font-size:11px;color:#ffd75e;-webkit-text-stroke:2px #1e120a;paint-order:stroke fill}
.fin-main .fin-chart{flex:none;width:100%;margin:0}
/* 6角形の数字：小さい暗い札にのせる */
.fin-ax{flex-direction:row;gap:3px;background:#2a1a0eee;border:1.5px solid #c9a24a;border-radius:10px;padding:1px 6px 1px 5px;box-shadow:0 2px 0 #1e120a}
.fin-ax i{font-size:10px;-webkit-text-stroke:0;filter:brightness(1.4)}
.fin-ax strong{font-size:12px;color:#fff;-webkit-text-stroke:0}
/* 右の能力：ランクなし */
.fin-main .fin-stats{justify-content:space-between}
.fin-main .fin-st{grid-template-columns:1fr auto 34px;grid-template-rows:auto 6px;padding:4px 6px 5px;flex:1}
.fin-main .fin-st strong{font-size:18px}
.fin-main .fin-st-n{font-size:12px}
/* 技：戦闘の技の札と同じ */
.fin-pair{gap:6px;align-items:stretch}
.fin-skw{flex:1 1 60%!important;min-width:0}
.fin-gw{flex:0 0 38%!important;min-width:0}
.fin-skg{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.fin-skb{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:40px;border:0;border-style:solid;border-width:6px 14px 8px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/6px 14px 8px stretch;filter:drop-shadow(0 2px 0 #1a120c);line-height:1.1;padding:0 2px}
.fin-skb b{font-size:12.5px;color:#2a1f16}.fin-skb b i{font-style:normal;color:#c4401a;margin-left:2px}
.fin-skb small{font-size:9px;color:#6b4a2a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.fin-skb.own{border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill}
.fin-skb.empty{opacity:.4;filter:grayscale(1)}
.fin-skb.empty b{font-size:11px}
/* 手に入れたもの：絵・名前・数を1行ずつ */
.fin-gets2{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.fin-gets2 li{display:flex;align-items:center;gap:5px;background:#2a1a0e;border:2px solid #1e120a;border-radius:6px;box-shadow:inset 0 0 0 1px #c9a24a88;padding:2px 6px}
.fin-gets2 li img{width:22px;height:22px;object-fit:contain}
.fin-gets2 li span{font-size:11px;color:#ffe9b0;white-space:nowrap}
.fin-gets2 li b{margin-left:auto;font-size:16px;color:#ffd75e;-webkit-text-stroke:3px #1e120a;paint-order:stroke fill}
.fin-note{font-size:11px;color:#5a3a22;margin:2px}
.fin-stage,.fin-bts{display:none}
.fin-hero2{height:clamp(118px,calc(100dvh - 590px),190px)}
.fin-skb{min-height:46px}
.fin-skb.empty b{font-size:13px}
.fin-hero2{height:clamp(118px,calc(100dvh - 512px),230px)}

/* 2026-10-22 ユーザー：6角形がAIっぽい → 札・色の点・点線をやめて、板に墨で描いたような素朴な図に */
.fin-radar .rg0{fill:#f6e2b8;stroke:#4a2a12;stroke-width:1.6}
.fin-radar .rg1,.fin-radar .rg2,.fin-radar .rg3{stroke-dasharray:none;stroke:#4a2a12;stroke-width:.7;opacity:.3;fill:none}
.fin-radar .ax{stroke:#4a2a12;opacity:.25;stroke-width:.7}
.fin-radar .val{fill:#c8401a66;stroke:#a02a10;stroke-width:2;stroke-linejoin:round}
.fin-ax{flex-direction:column;align-items:center;gap:0;background:none;border:0;box-shadow:none;padding:0;line-height:1.05}
.fin-ax i{font-size:10px;color:var(--c);filter:none;-webkit-text-stroke:2.5px #f6e2b8;paint-order:stroke fill}
.fin-ax strong{font-size:13px;color:#2a1408;-webkit-text-stroke:2.5px #f6e2b8;paint-order:stroke fill}

/* 2026-10-22 ユーザー：キャラの札がバランス悪い・AIっぽい → 絵の上には何も重ねない。下に羊皮紙の帯（名前・★・評価点）＋ランクの判子 */
.fin-hero2{height:clamp(110px,calc(100dvh - 560px),190px);border:2px solid #4a2a12;box-shadow:none;border-radius:6px}
.fin-hero2 .fin-hero{left:0;right:0;top:6%;bottom:2%;display:flex;justify-content:center;align-items:flex-end}
.fin-id{position:relative;display:flex;align-items:center;gap:6px;margin-top:-10px;padding:12px 8px 6px;background:#f6e2b8;border:2px solid #4a2a12;border-top:0;border-radius:0 0 6px 6px}
.fin-nm{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:4px;line-height:1.15}
.fin-nm b{font-size:17px;color:#2a1408}
.fin-nm i{font-style:normal;font-size:12px;color:#d08a10}
.fin-nm small{flex-basis:100%;font-size:11px;color:#6a4a2a}
.fin-nm small strong{font-size:17px;color:#2a1408;margin-left:2px}
/* 判子：朱肉で押した四角い印 */
.fin-seal{flex:0 0 auto;width:50px;height:50px;display:grid;place-items:center;border:3px solid #c0281a;border-radius:6px;box-shadow:inset 0 0 0 2px #f6e2b8,inset 0 0 0 4px #c0281a;transform:rotate(-8deg);margin:-14px 0 -4px;animation:finSeal .45s .6s cubic-bezier(.2,1.6,.4,1) both}
.fin-seal b{font-size:32px;line-height:1;color:#c0281a}
.fin-seal.sl-S{border-color:#c0281a;background:radial-gradient(#ffe68a55,transparent 70%)}
.fin-seal.sl-D b,.fin-seal.sl-E b{color:#8a3a2a}.fin-seal.sl-D,.fin-seal.sl-E{border-color:#8a3a2a;box-shadow:inset 0 0 0 2px #f6e2b8,inset 0 0 0 4px #8a3a2a}
@keyframes finSeal{0%{opacity:0;transform:scale(2.4) rotate(-20deg)}60%{opacity:1;transform:scale(.92) rotate(-8deg)}100%{opacity:1;transform:rotate(-8deg)}}
.fin-rk,.fin-score,.fin-hero2 .fin-plate{display:none}
.fin-skg{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.fin-skb{min-width:0}
.fin-skb small{display:block;width:100%}

/* 2026-10-22 右の能力の行が左に合わせて間延び → 行は自然な高さ。左右は上ぞろえ、余りは左の6角形が受ける */
.fin-main .fin-two{align-items:flex-start}
.fin-main .fin-stats{justify-content:flex-start;gap:4px}
.fin-main .fin-st{flex:none;padding:3px 6px 4px}
.fin-main .fin-st strong{font-size:17px}
.fin-main .fin-chart{flex:1 1 auto;min-height:0;display:flex;align-items:center}
.fin-left{align-self:stretch}
/* 右の列：能力の下に「手に入れたもの」。下の段は技だけ横1列 */
.fin-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;align-self:stretch}
.fin-right .fin-gw{flex:1;display:flex;flex-direction:column;justify-content:flex-end}
.fin-right .fin-h{margin:4px 0 2px;color:#3a1408}
.fin-right .fin-gets2 li{padding:1px 6px}
.fin-skw{flex:0 0 auto}
.fin-skg{grid-template-columns:repeat(4,minmax(0,1fr))}
.fin-skb{min-height:40px}
.fin-skb small{font-size:8.5px}

/* 2026-10-22 見直し：ガチャの画面が29pxはみ出してブンタの吹き出しがタブに隠れていた → 高さをぴったりに */
.gacha3{box-sizing:border-box;min-height:100dvh}
/* 仲間一覧のカード：白い四角 → あたたかい木の板。「+4」は重ねの数だとわかるように */
.owned-card{background:none!important;border:0!important;border-style:solid!important;border-width:8px 16px 10px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/8px 16px 10px stretch!important;box-shadow:none!important;filter:drop-shadow(0 3px 0 #2a1f16);padding:2px 2px 4px!important;gap:2px!important}
.owned-card .dupe::before{content:'重ね';font-size:10px;-webkit-text-stroke:0;color:#6d5a40;margin:0 1px 0 4px;letter-spacing:0}
/* ガチャ：画面の高さに合わせて1画面に収める（幕の絵の高さで調整。小さい画面ほど幕を低く） */
.g3-banner{height:clamp(170px,calc(100dvh - 540px),268px)}
.g3-banner>img,.g3-banner .g3-art{height:100%;width:100%;object-fit:cover;object-position:center 30%}
.g3-guide .g2-bunta{height:78px}
/* ミッションの窓：高さは固定のまま、5行ぶんに縮めて空きを減らす（タブで大きさは変わらない） */
.modal:has(.ms-wrap){height:min(500px,100%)}
/* ゆぐら登り：強敵の階のごほうびが3行に折り返していた → 1行に収めて、入りきらない分は「…」 */
.tower .tw-floors li small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;max-width:100%}
/* 2026-10-22 ユーザー：技は2×2の2段に */
.fin-skg{grid-template-columns:repeat(2,minmax(0,1fr))}
.fin-skb{min-height:44px}
.fin-skb small{font-size:9.5px}
.fin-hero2{height:clamp(110px,calc(100dvh - 612px),190px)}
/* 2026-10-22 ユーザー：手に入れたものは一番下。技は右の列の能力の下 */
.fin-right .fin-skw{flex:1;display:flex;flex-direction:column;justify-content:flex-end}
.fin-right .fin-skg{gap:3px}
.fin-right .fin-skb{min-height:38px;border-width:5px 10px 7px}
.fin-right .fin-skb b{font-size:11px}.fin-right .fin-skb small{font-size:8.5px}
.fin>.fin-gw .fin-gets2{flex-direction:row;gap:5px}
.fin>.fin-gw .fin-gets2 li{flex:1;min-width:0;justify-content:center;padding:3px 4px}
.fin>.fin-gw .fin-gets2 li b{margin-left:4px;font-size:17px}
.fin>.fin-gw .fin-gets2 li span{font-size:10.5px}
.fin-hero2{height:clamp(110px,calc(100dvh - 575px),190px)}
.fin-hero2{height:clamp(110px,calc(100dvh - 492px),260px)}
.fin-right .fin-skb{min-height:44px}
.fin-right .fin-stats{flex:1;justify-content:space-between}
.fin-right .fin-skw{flex:none}
/* 2026-10-22 技の段：見出しの上だけ空いていた → 能力のすぐ下に見出し、札は残りの高さに均等に広がる */
.fin-right .fin-stats{flex:none;justify-content:flex-start;gap:4px}
.fin-right .fin-skw{flex:1;display:flex;flex-direction:column;min-height:0;padding-bottom:4px}
.fin-right .fin-skw .fin-h{margin:6px 0 4px}
.fin-right .fin-skg{flex:1;grid-auto-rows:1fr;gap:5px}
.fin-right .fin-skb{min-height:0;height:100%;box-sizing:border-box}

/* 2026-10-22 ユーザー：能力の行はモンスターファームのように横一列（名前・太いゲージ・数字・上がった分）。ゲージを太く */
.fin-main .fin-st{grid-template-columns:2.4em 1fr 2.6em auto;grid-template-rows:auto;align-items:center;column-gap:6px;padding:5px 7px;min-height:36px}
.fin-main .fin-st-n{font-size:12px}
.fin-main .fin-bar{grid-column:auto;height:16px;border-radius:9px;border:1.5px solid #7a5a3a;box-shadow:inset 0 2px 3px #000a}
.fin-main .fin-bar>i{border-radius:8px;background:linear-gradient(#fff8 0,transparent 50%,#0003 100%),var(--c)}
.fin-main .fin-st strong{font-size:17px;text-align:right}
.fin-main .fin-st em{font-size:11px;min-width:3em;text-align:right}
/* 能力の行：上の段＝名前・数字・上がった分、下の段＝太いゲージを横いっぱい（モンスターファームの形） */
.fin-main .fin-st{grid-template-columns:1fr auto auto;grid-template-rows:auto auto;column-gap:5px;row-gap:3px;padding:4px 7px 6px;min-height:0}
.fin-main .fin-st-n{grid-column:1;grid-row:1;font-size:12.5px}
.fin-main .fin-st strong{grid-column:2;grid-row:1;font-size:18px;line-height:1}
.fin-main .fin-st em{grid-column:3;grid-row:1;min-width:2.8em}
.fin-main .fin-bar{grid-column:1/-1;grid-row:2;height:15px}
.fin-right .fin-skb{max-height:64px}
.fin-right .fin-skg{align-content:space-evenly}
/* 2026-10-22 6角形の頂点：数字は小さな木の札に（ほかの画面と同じ板の絵。丸い暗い札は使わない） */
.fin-ax{flex-direction:column;gap:0;line-height:1;padding:1px 2px 2px;background:none;border:0;border-style:solid;border-width:4px 9px 5px;border-image:url(art/ui/btn_wood.png) 40 110 46 fill/4px 9px 5px stretch;box-shadow:none;filter:drop-shadow(0 2px 0 #2a1f16);min-width:30px;animation:finFade .3s .9s ease-out both}
.fin-ax i{font-size:9.5px;-webkit-text-stroke:0;filter:saturate(1.2) brightness(.95)}
.fin-ax strong{font-size:13px;color:#2a1408;-webkit-text-stroke:0}
.fin-radar .rg0{fill:#efd9a8}
/* 2026-10-22 技の段：見出しは布の札、技は羊皮紙の短冊（木の板に頼りすぎない）。下の札が板の縁にかからないように */
.fin-right .fin-skw{padding:0 0 10px}
.fin-right .fin-skw .fin-h{margin:6px 0 5px;padding:0;gap:0}
.fin-right .fin-skw .fin-h::before{display:none}
.fin-right .fin-skw .fin-h span,.fin-right .fin-skw .fin-h{font-size:11.5px}
.fin-right .fin-skw .fin-h{display:inline-flex;align-items:center;background:#5a3a22;color:#fff6df;padding:1px 10px 2px;border-radius:2px 8px 8px 2px;box-shadow:2px 2px 0 #2a1408;letter-spacing:.2em;align-self:flex-start}
.fin-right .fin-skg{gap:6px;align-content:stretch}
.fin-right .fin-skb{border:2px solid #4a2a12;border-image:none;background:#f6e2b8;box-shadow:inset 0 0 0 2px #fff3d6,2px 2px 0 #2a140880;filter:none;border-radius:2px;max-height:none;padding:2px 4px}
.fin-right .fin-skb b{font-size:12px;color:#2a1408}
.fin-right .fin-skb small{font-size:9px;color:#6a4a2a}
.fin-right .fin-skb.own{background:#ffe9a8;border-color:#a06a10}
.fin-right .fin-skb.empty{opacity:1;filter:none;background:#e4d2ad;border-style:dashed;border-color:#9a7a52;box-shadow:none}
.fin-right .fin-skb.empty b{color:#9a7a52}.fin-right .fin-skb.empty small{color:#b09a74}
/* 2026-10-22 ユーザー：暗い丸いカード＋光る棒はAIっぽい → 羊皮紙の帳簿に墨の線、ゲージは10のます目（100ごと） */
.fin-main .fin-stats{background:#f6e2b8;border:2px solid #4a2a12;border-radius:2px;box-shadow:inset 0 0 0 2px #fff3d6,2px 2px 0 #2a140880;padding:2px 6px;gap:0}
.fin-main .fin-st{background:none;border:0;border-bottom:1.5px solid #4a2a1240;border-radius:0;box-shadow:none;padding:4px 2px 5px;row-gap:3px}
.fin-main .fin-st:last-child{border-bottom:0}
.fin-main .fin-st-n{font-size:12.5px;filter:none}
.fin-main .fin-st strong{color:#2a1408;-webkit-text-stroke:0;font-size:18px}
.fin-main .fin-st em{color:#3a7a2a;-webkit-text-stroke:0;font-size:11px}
.fin-main .fin-bar{height:12px;border:1.5px solid #4a2a12;border-radius:0;box-shadow:none;background:repeating-linear-gradient(90deg,#e6d2a6 0 calc(10% - 2px),#4a2a12 calc(10% - 2px) 10%);overflow:hidden}
.fin-main .fin-bar>i{border-radius:0;box-shadow:none;background:repeating-linear-gradient(90deg,var(--c) 0 calc(10% - 2px),#4a2a12 calc(10% - 2px) 10%);background-size:var(--bw,100%) 100%}
.fin-right .fin-skb small{white-space:normal;text-overflow:clip;line-height:1.2}
/* 2026-10-22 ユーザー：木目の上の小さい色字は読みにくい → 6角形は能力の帳簿と同じ羊皮紙に載せ、頂点の字は札なしで紙に直接書く */
.fin-main .fin-chart{background:#f6e2b8;border:2px solid #4a2a12;border-radius:2px;box-shadow:inset 0 0 0 2px #fff3d6,2px 2px 0 #2a140880;padding:4px 2px;box-sizing:border-box}
.fin-radar .rg0{fill:#fff6e0;stroke:#4a2a12;stroke-width:1.6}
.fin-ax{border:0;border-image:none;background:none;filter:none;box-shadow:none;padding:0;min-width:0;gap:1px}
.fin-ax i{font-size:11px;filter:none;font-weight:400}
.fin-ax strong{font-size:14px;color:#2a1408}
.fin-main .fin-chart{padding:8px 2px 10px}

/* 2026-10-22 ユーザー：世界観を反映。上がった分の数字はなし。
   帳簿＝ふちの焦げた古い紙（赤の国の火山の土地）、仕切りは朱の線、能力の名前は墨、色はます目だけ */
.fin-main .fin-stats,.fin-main .fin-chart{background:radial-gradient(ellipse at 50% 40%,#f7e6c2 0,#efd9a8 70%,#d9b980 100%);border:0;border-radius:3px;box-shadow:inset 0 0 0 1.5px #5a3a1a,inset 0 0 0 4px #efd9a8,inset 0 0 0 5.5px #a0602a66,2px 3px 0 #2a140880}
.fin-main .fin-stats{padding:3px 8px}
.fin-main .fin-st{border-bottom:1.5px solid #a0602a55;grid-template-columns:1fr auto;padding:4px 0 5px}
.fin-main .fin-st-n{color:#3a1c08;font-size:12.5px}
.fin-main .fin-st strong{grid-column:2;font-size:18px;color:#2a1408}
.fin-main .fin-st em{display:none}
.fin-main .fin-bar{border:1.5px solid #5a3a1a;background:repeating-linear-gradient(90deg,#efe0bf 0 calc(10% - 1.5px),#a0602a calc(10% - 1.5px) 10%)}
.fin-main .fin-bar>i{background:repeating-linear-gradient(90deg,var(--c) 0 calc(10% - 1.5px),#5a3a1a calc(10% - 1.5px) 10%);background-size:var(--bw,100%) 100%}
.fin-radar .rg0{fill:#fff4dc;stroke:#5a3a1a}
.fin-radar .rg1,.fin-radar .rg2,.fin-radar .rg3,.fin-radar .ax{stroke:#a0602a;opacity:.45}
.fin-radar .val{fill:#c8401a66;stroke:#8a2410}
.fin-ax i{color:#3a1c08}.fin-ax strong{color:#2a1408}
/* 2026-10-22 6角形＝縄で組んだしめ縄の図。外の輪は太い縄、軸と内の輪は細い縄、頂点に結び目。値は朱の布。字は紙の上に墨 */
.fin-radar .rope{fill:none;stroke:url(#rope);stroke-width:5;stroke-linejoin:round}
.fin-radar .rg{fill:none;stroke:#b08a4a;stroke-width:1.2;stroke-dasharray:none;opacity:.8}
.fin-radar .ax{stroke:#b08a4a;stroke-width:1.2;opacity:.8}
.fin-radar .val{fill:#c8401acc;stroke:#7a1a08;stroke-width:1.5;stroke-linejoin:round}
.fin-radar .knot{fill:#c9a24a;stroke:#5a3a1a;stroke-width:1.2}
.fin-radar .knot2{fill:#5a3a1a}
.fin-ax{background:#fff4dc;border:1px solid #a0602a;padding:0 3px;border-radius:2px;flex-direction:row;gap:3px;align-items:baseline;box-shadow:1px 1px 0 #5a3a1a66}
.fin-ax i{font-size:10px;color:var(--c);filter:saturate(1.1)}
.fin-ax strong{font-size:13px}

/* 2026-10-22 評価画面の部品をチャッピーの絵に（art/ui/fin/）。帳簿・しめ縄の網・判子・見出しの札・技の短冊・手に入れたものの札 */
/* 帳簿：絵の上に6段。1段目の枠 y=82〜201（絵 618×856）、以後 118 ずつ。名前枠 x=57〜403、数字枠 x=420〜560、ます目の帯 y=137〜174（段の中の相対 55〜92）、x=63〜556 */
.fin-main .fin-stats{position:relative;background:url(art/ui/fin/ledger.png) center/100% 100% no-repeat;border:0;box-shadow:none;padding:0;gap:0;aspect-ratio:618/856;display:block}
.fin-main .fin-st{position:absolute;left:0;right:0;top:calc((82px + var(--k) * 118px) / 856 * 100%);height:calc(119 / 856 * 100%);display:block;border:0;padding:0;background:none}
.fin-main .fin-st-n{position:absolute;left:11%;top:4%;height:40%;display:flex;align-items:center;font-size:12.5px;color:#3a1c08}
.fin-main .fin-st strong{position:absolute;right:11%;top:4%;height:40%;display:flex;align-items:center;font-size:17px;color:#2a1408}
.fin-main .fin-bar{position:absolute;left:10.5%;right:10.5%;top:47.5%;height:29%;border:0;background:none;box-shadow:none;border-radius:0}
.fin-main .fin-bar>i{position:absolute;left:0;top:14%;bottom:14%;border-radius:2px;background:var(--c);opacity:.82;box-shadow:none}
/* しめ縄の網 */
.fin-main .fin-chart{background:url(art/ui/fin/web.png) center/100% 100% no-repeat;border:0;box-shadow:none;padding:0;aspect-ratio:643/507}
.fin-radar{position:absolute;inset:0;width:100%;height:100%}
.fin-radar .val{fill:#c8401ab8;stroke:#7a1a08;stroke-width:4;stroke-linejoin:round}
.fin-ax{background:none;border:0;box-shadow:none;padding:0;flex-direction:row;gap:3px;align-items:baseline;width:19%;justify-content:center}
.fin-ax i{font-size:10px;color:var(--c)}
.fin-ax strong{font-size:13px;color:#2a1408}
/* 判子 */
.fin-seal{width:54px;height:54px;border:0;border-radius:0;box-shadow:none;background:none;transform:rotate(-6deg);margin:-14px 0 -4px;object-fit:contain;animation:finSeal .45s .6s cubic-bezier(.2,1.6,.4,1) both}
/* 見出しの布の札 */
.fin-right .fin-skw .fin-h,.fin>.fin-gw .fin-h{background:url(art/ui/fin/tag_s.png) left center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;padding:4px 26px 6px 18px;color:#fff6df;letter-spacing:.15em;min-width:64px;justify-content:flex-start;-webkit-text-stroke:2px #1e0e10;paint-order:stroke fill}
.fin>.fin-gw .fin-h{background-image:url(art/ui/fin/tag_l.png);min-width:120px}
/* 技の短冊 */
.fin-right .fin-skb{background:url(art/ui/fin/skill_a.png) center/100% 100% no-repeat;border:0;box-shadow:none;border-radius:0;padding:6px 14px;aspect-ratio:630/134;max-height:none;height:auto}
.fin-right .fin-skb.own{background-image:url(art/ui/fin/skill_own.png)}
.fin-right .fin-skb.empty{background-image:url(art/ui/fin/skill_empty.png);opacity:1;filter:none;border:0}
.fin-right .fin-skb.empty b{color:#8a7a62}
.fin-right .fin-skb b{font-size:12px}.fin-right .fin-skb small{font-size:8.5px;line-height:1.15}
.fin-right .fin-skg{align-content:space-evenly}
/* 手に入れたものの札 */
.fin>.fin-gw .fin-gets2 li{background:url(art/ui/fin/get_b.png) center/100% 100% no-repeat;border:0;box-shadow:none;border-radius:0;padding:8px 14px 8px 12px;aspect-ratio:214/102;justify-content:flex-start;gap:6px}
.fin>.fin-gw .fin-gets2 li:first-child{background-image:url(art/ui/fin/get_a.png)}
.fin>.fin-gw .fin-gets2 li:last-child{background-image:url(art/ui/fin/get_c.png)}
.fin>.fin-gw .fin-gets2 li img{width:26px;height:26px;flex:0 0 26px}
.fin>.fin-gw .fin-gets2 li span{display:none}
.fin>.fin-gw .fin-gets2 li b{margin-left:auto;font-size:16px;color:#ffe08a;-webkit-text-stroke:3px #1e0e08;paint-order:stroke fill}
/* 位置の計算を % でそろえる（calc の px/856 は使えないため）。1段目 y=82/856=9.58%、段の高さ 118/856=13.79% */
.fin-main .fin-st{top:calc(9.58% + var(--k) * 13.79%);height:13.9%}
/* 帳簿の中の文字は、幅に合わせて大きさを変える */
.fin-main .fin-st-n{font-size:clamp(9px,3.1vw,12.5px);left:12%;top:5%;height:38%}
.fin-main .fin-st strong{font-size:clamp(12px,4.2vw,17px);right:12%;top:3%;height:40%}
/* 技の短冊：高さは絵の比率で */
.fin-right .fin-skb{aspect-ratio:630/134!important;height:auto!important;min-height:0!important;max-height:none!important;padding:0 12px}
.fin-right .fin-skg{align-content:start;gap:4px}
.fin-right .fin-skw{padding-bottom:0}
/* しめ縄の網：左の列の幅いっぱい */
.fin-main .fin-chart{width:100%;margin:0}
.fin-left{gap:2px}
/* 網の札の文字は絵の札の位置に。技の短冊は高さを padding で出す（grid の 1fr に負けないように） */
.fin-ax{width:auto;min-width:0;white-space:nowrap;gap:2px}
.fin-ax i{font-size:9.5px}.fin-ax strong{font-size:12.5px}
.fin-right .fin-skg{grid-template-rows:none;grid-auto-rows:auto;align-content:start}
.fin-right .fin-skb{aspect-ratio:auto!important;height:auto!important;padding:5px 12px 7px!important;min-height:38px!important;box-sizing:border-box}
/* 網：名前と数字は頂点の外の紙の札に（札は小さいので、札の上に生成りの帯を重ねて読めるように） */
.fin-main .fin-chart{overflow:visible}
.fin-ax{background:#fff4dc;border:1.5px solid #a0602a;border-radius:2px;padding:0 4px;box-shadow:1px 1px 0 #5a3a1a66;gap:3px}
.fin-ax i{font-size:10px}.fin-ax strong{font-size:13px}
/* 空きの短冊：背景の大きさが auto に戻っていた */
.fin-right .fin-skb.empty,.fin-right .fin-skb.own{background-size:100% 100%!important;background-position:center!important;background-repeat:no-repeat!important}
.fin-main .fin-chart{margin-top:10px}

/* 2026-10-22 ユーザー：下のボタンのバランス。板は文字に合わせる。炎（緑の板の左右の縁40pxの中）に字をかぶせない */
.fin-actions{justify-content:center;gap:10px}
.fin-actions .btn,.fin-actions .btn:not(.primary),.fin-actions .btn.big.primary{flex:none!important;width:auto!important;max-width:none;height:52px;font-size:17px!important;letter-spacing:.04em;display:flex;align-items:center;justify-content:center}
.fin-actions .btn:not(.primary){padding:0 14px!important}
.fin-actions .btn.big.primary{padding:0 16px!important}

/* 帳簿：字は絵の枠の内側に（名前枠 y=2〜44%・x=12〜、数字枠 右=12.6%〜）。ます目の帯は y=47.5〜78%・x=12.3〜90% */
.fin-main .fin-st-n{left:14%;top:4%;height:38%}
.fin-main .fin-st strong{right:14%;top:3%;height:38%}
/* ます目：丸い棒をやめ、ます目の上に色を「染める」（掛け合わせで、絵の朱の線はそのまま見える） */
.fin-main .fin-bar{left:12.3%;right:10%;top:49%;height:28%;overflow:hidden}
.fin-main .fin-bar>i{top:0;bottom:0;border-radius:0;opacity:1;background:var(--c);mix-blend-mode:multiply;filter:saturate(1.2)}

/* 見出しの旗：引き伸ばさない（文字の長さぶん） */
.fin-right .fin-skw .fin-h,.fin>.fin-gw .fin-h{width:fit-content;display:inline-flex}
.fin>.fin-gw .fin-h{background-size:100% 100%;padding-right:34px}

/* 技の札：説明は1行に */
.fin-right .fin-skb{padding:4px 9px 6px!important}
.fin-right .fin-skb small{white-space:nowrap;font-size:8px;overflow:hidden;text-overflow:ellipsis}
.fin-actions .btn,.fin-actions .btn:not(.primary),.fin-actions .btn.big.primary{font-size:15.5px!important;height:48px}
.fin-actions .btn:not(.primary){padding:0 8px!important}
.fin-actions .btn.big.primary{padding:0 10px!important}
.fin-actions{gap:14px}

/* ===== 2026-10-22 修行の評価画面（作り直し）：390×640 の1枚。app.js fitFin で画面に合わせて拡大・縮小 ===== */
.fz-screen{position:fixed;inset:0;z-index:50;overflow:hidden;background-color:var(--paper);background-image:radial-gradient(#6b4f2a14 1px,transparent 1.2px);background-size:7px 7px}
body:has(.fz-screen) .back-float,body:has(.fz-screen) .tabbar{display:none}
.fz{position:absolute;left:0;top:0;width:390px;height:640px;transform-origin:0 0;font-family:var(--game-font);color:#2a1408}
.fz *{box-sizing:border-box;font-weight:400}
.fz>*,.fz-board>*{position:absolute}
/* 見出しのリボン */
.fz-ribbon{left:0;top:2px;width:390px;height:36px;background:url(art/ui/ribbon.png) center/100% 100% no-repeat;display:grid;place-items:center}
.fz-ribbon span{margin-top:-5px;font-size:14px;color:#fff;-webkit-text-stroke:4px #6a2a08;paint-order:stroke fill;white-space:nowrap}
.fz-lose .fz-ribbon{filter:saturate(.55) brightness(.9)}
/* 板 */
.fz-board{left:6px;top:40px;width:378px;height:436px;border:solid;border-width:10px 18px 12px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/10px 18px 12px stretch;filter:drop-shadow(0 3px 0 #2a1f1699)}
.fz-next{left:0;top:0;width:342px;height:24px;display:flex;align-items:center;gap:8px;padding:0 8px;background:#3a2414;border:2px solid #1e120a;border-radius:4px;color:#fff1cf;font-size:11px;white-space:nowrap}
.fz-next b{color:#ffd75e}
.fz-gauge{flex:1;height:8px;background:#1e120a;border:1px solid #6a4a2a;border-radius:4px;overflow:hidden;display:block}
.fz-gauge>i{display:block;height:100%;background:#e8a21a}
/* キャラ：絵と、名前・評価点・判子の帯 */
.fz-hero{left:0;top:30px;width:168px;height:242px;border:2px solid #4a2a12;border-radius:4px;overflow:hidden;background:#f6e2b8}
.fz-pic{position:absolute;left:0;top:0;right:0;height:194px;background-size:cover;background-position:center 75%;display:flex;align-items:flex-end;justify-content:center}
.fz-pic .mon-img{width:92%;height:92%;object-fit:contain;object-position:center bottom}
.fz-id{position:absolute;left:0;right:0;bottom:0;height:46px;padding:4px 6px;border-top:2px solid #4a2a12;background:#f6e2b8}
.fz-id b{display:block;font-size:15px;line-height:1.1;color:#2a1408;white-space:nowrap}
.fz-id b i{font-style:normal;font-size:11px;color:#d08a10;margin-left:3px}
.fz-id small{display:block;font-size:10px;color:#6a4a2a;margin-top:2px}
.fz-id small strong{font-size:15px;color:#2a1408}
.fz-seal{position:absolute;right:4px;bottom:3px;width:44px;height:44px;object-fit:contain;transform:rotate(-6deg);animation:finSeal .45s .5s cubic-bezier(.2,1.6,.4,1) both}
/* しめ縄の網：絵の上に値の形。数字は絵の紙の札の中に直接書く */
.fz-web{left:0;top:278px;width:168px;height:136px;background:url(art/ui/fin/web.png) center/100% 100% no-repeat}
.fz-web svg{position:absolute;inset:0;width:100%;height:100%}
.fz-web polygon{fill:#c8401ab0;stroke:#7a1a08;stroke-width:5;stroke-linejoin:round}
.fz-tag{position:absolute;transform:translate(-50%,-50%);font-size:9.5px;line-height:1;color:#2a1408;white-space:nowrap}
.fz-tag i{font-style:normal;font-size:8px;color:var(--c);margin-right:1px}
/* 帳簿：絵の上に名前・数字・ます目の色 */
.fz-ledger{left:174px;top:30px;width:168px;height:226px;background:url(art/ui/fin/ledger.png) center/100% 100% no-repeat}
.fz-ledger>span{position:absolute}
.fz-ln{display:flex;align-items:center;font-size:10.5px;color:#3a1c08}
.fz-lv{display:flex;align-items:center;font-size:14px;color:#2a1408}
.fz-cells{inset:0}
.fz-cells i{position:absolute;background:var(--c);mix-blend-mode:multiply;opacity:.85}
.st-hp{--c:var(--hp)}.st-atk{--c:var(--atk)}.st-def{--c:var(--def)}.st-spd{--c:var(--spd)}.st-hit{--c:var(--hit)}.st-spi{--c:var(--spi)}
/* 見出しの旗 */
.fz-h{height:22px;padding:0 22px 0 16px;display:flex;align-items:center;font-size:11px;color:#fff6df;letter-spacing:.12em;background:url(art/ui/fin/tag_s.png) left center/100% 100% no-repeat;-webkit-text-stroke:2px #1e0e10;paint-order:stroke fill}
.fz-h-sk{left:174px;top:260px;width:70px}
.fz-h-get{left:6px;top:482px;width:150px;background-image:url(art/ui/fin/tag_l.png)}
/* 技の短冊 2×2 */
.fz-skills{left:174px;top:286px;width:168px;height:128px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:6px}
.fz-sk{background:url(art/ui/fin/skill_a.png) center/100% 100% no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 9px;line-height:1.15;min-width:0}
.fz-sk.own{background-image:url(art/ui/fin/skill_own.png)}
.fz-sk.empty{background-image:url(art/ui/fin/skill_empty.png)}
.fz-sk b{font-size:11px;white-space:nowrap}.fz-sk b i{font-style:normal;color:#c4401a;margin-left:2px}
.fz-sk small{font-size:7.5px;color:#6a4a2a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.fz-sk.empty b{color:#8a7a62}
/* 手に入れたもの */
.fz-gets{left:6px;top:508px;width:378px;height:54px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.fz-get{position:relative;background-size:100% 100%;background-repeat:no-repeat}
.fz-get img{position:absolute;left:9%;top:22%;width:23%;height:56%;object-fit:contain}
.fz-get b{position:absolute;left:36%;right:6%;top:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:15px;color:#ffe08a;-webkit-text-stroke:3px #1e0e08;paint-order:stroke fill}
.fz-note{left:6px;top:563px;width:378px;margin:0;font-size:9.5px;color:#5a3a22;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 下のボタン：同じ大きさ */
.fz-foot{left:0;top:570px;width:390px;height:70px;display:flex;justify-content:center;align-items:center;gap:10px;background:linear-gradient(#2a1f1600,#2a1f16 35%)}
.fz .fz-btn{position:static;width:170px!important;height:50px!important;margin:0!important;padding:0!important;flex:none!important;font-size:15.5px!important;display:flex;align-items:center;justify-content:center;white-space:nowrap;min-width:0}
/* 技：絵の比率（630×134）に近い横長で1列4段。名前と説明を1行に */
.fz-skills{grid-template-columns:1fr;grid-template-rows:repeat(4,1fr);gap:3px}
.fz-sk{flex-direction:row;gap:6px;padding:0 16px;justify-content:flex-start}
.fz-sk b{font-size:11.5px}
.fz-sk small{font-size:8.5px}
.fz-tag{font-size:9px}
.fz-sk{padding:0 14px 0 22px}
/* 2026-10-23 網の札の字がはみ出す → 左の列を広げて網を大きく（190×153）、右の列は152に */
.fz-hero{width:190px;height:225px}
.fz-pic{height:179px}
.fz-web{width:190px;height:153px;top:261px}
.fz-ledger{left:196px;width:146px;height:197px}
.fz-h-sk{left:196px;top:233px}
.fz-skills{left:196px;width:146px;top:259px;height:155px}
.fz-ln{font-size:10px}.fz-lv{font-size:12.5px}
.fz-tag{font-size:9.5px}.fz-tag i{font-size:8.5px}
.fz-sk{padding:0 10px 0 18px}.fz-sk b{font-size:11px}.fz-sk small{font-size:8px}

/* 2026-10-23 連れていく子のカード（くだり・登り・坑道・レイド・ぶとうかい・出撃準備）：大きすぎて縦に長い → 3列の小さい札に */
div.sb-cands{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
button.sb-cand{border-width:6px 10px 8px!important;border-image-width:6px 10px 8px!important;padding:2px 0 4px!important;gap:0;min-width:0}
.sb-cand img{width:44px;height:44px}
.sb-cand b{font-size:12px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sb-cand small{font-size:9.5px;line-height:1.3;white-space:normal;text-align:center}
.sb-cand.lead::before{left:2px;top:2px;font-size:8px;padding:0 3px}
/* 挑む・潜るボタン：横いっぱいの朱の板、エナジーは同じ行の右に */
[data-action=dv-start].btn,[data-action=tw-go].btn,[data-action=mn-go].btn,[data-action=rd-go].btn,[data-action=ar-go].btn{display:flex!important;width:100%;max-width:360px;margin:12px auto 0!important;height:56px;align-items:center;justify-content:center;gap:10px;font-size:20px}
[data-action=dv-start].btn small,[data-action=tw-go].btn small,[data-action=mn-go].btn small,[data-action=rd-go].btn small,[data-action=ar-go].btn small{display:inline;font-size:12px;margin:0;opacity:.95}
/* 「いちばん深く」の札と「連れていく子」の見出しを1行に並べる（板1枚に1行は空きが多い） */
.dive .dv-stat{display:inline-flex;margin:8px 0 4px}
/* ぶとうかい：相手の一覧の白い箱 → 木の札（えらんだ相手は金の札） */
button.ar-opp{background:none!important;border:0!important;border-style:solid!important;border-width:6px 14px 8px!important;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/6px 14px 8px stretch!important;box-shadow:none!important;filter:drop-shadow(0 2px 0 #2a1f16);padding:0 2px!important}
button.ar-opp.on{border-image-source:url(art/ui/btn_gold.png)!important;border-image-slice:50 120 56 fill!important}

/* 2026-10-23 ユーザー：リーダーの札（板1枚に2行）は無駄 → 板をやめて1行の注記に（リーダーの名前・技・効果を横並び） */
p.lead-note{background:none!important;border:0!important;border-image:none!important;filter:none!important;padding:0!important;margin:2px 0 6px!important;display:flex;align-items:baseline;gap:4px;font-size:11.5px;white-space:nowrap;overflow:hidden}
p.lead-note small{display:inline;font-size:10.5px;color:#6a4a2a;overflow:hidden;text-overflow:ellipsis}
p.lead-note i{flex:none}

/* 2026-10-23 ユーザー：評価画面の網の数字と帳簿の文字をもう少し大きく */
.fz-tag{font-size:11px}.fz-tag i{font-size:9.5px}
.fz-ln{font-size:12px}.fz-lv{font-size:15px}
.fz-tag{font-size:10.5px}.fz-tag i{font-size:9px}
/* 2026-10-23 下地を木の板だけにしない（チャッピーの素材 art/ui/mat/）。場所ごとに物を決める
   和紙＝お知らせ・品物／鉄の板＝坑道・ぶとうかい／骨の札＝根の国／溶岩＝塔／藍の布＝レイド・評価の台／石碑＝出撃のキャラ／和紙＝ミッション／朱塗り＝今の階・受け取れる */
.news li,.it-card{border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/6px 14px 6px stretch!important;color:#3a1c08}
.cs-body .ms-row{border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/6px 14px 6px stretch!important}
.mine .mn-info{border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch!important;color:#f3e2c0}
.mine .mn-info b,.mine .mn-info small{color:#f3e2c0}
.dv-stat span{border-image:url(art/ui/mat/bone.png) 30 76 30 76 fill/6px 18px 6px stretch!important;color:#3a1c08}
.rd-stats>div{border-image:url(art/ui/mat/indigo.png) 46 50 46 50 fill/8px 10px 8px stretch!important;color:#fff3dc}
.rd-stats>div *{color:#fff3dc}
.tower .tw-floors li{border-image:url(art/ui/mat/lava.png) 36 100 36 100 fill/6px 18px 6px stretch!important;color:#f6e2b8}
.tower .tw-floors li b,.tower .tw-floors li small{color:#f6e2b8}
.tower .tw-floors li.now{border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/6px 14px 6px stretch!important;filter:drop-shadow(0 0 4px #f2b13a)}
.tower .tw-floors li.now b,.tower .tw-floors li.now small{color:#fff8e6;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
.ms-wrap .ms-row{border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/6px 14px 6px stretch!important}
.ms-wrap .ms-row.ready{border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/6px 12px 6px stretch!important}
.ms-wrap .ms-row.ready .ms-mid b{color:#fff8e6;-webkit-text-stroke:3px #3a1408}
.ms-wrap .ms-row.got{border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/6px 12px 6px stretch!important;filter:saturate(.3) brightness(.92)}
button.sb-cand{border-image:url(art/ui/mat/stele.png) 132 34 30 34 fill/14px 8px 6px stretch!important;border-width:14px 8px 6px!important;color:#2a1408}
button.sb-cand.on{border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/8px 10px 8px stretch!important;border-width:8px 10px 8px!important}
button.sb-cand.on b,button.sb-cand.on small{color:#fff8e6;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill}
button.ar-opp{border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch!important;color:#f3e2c0}
button.ar-opp *{color:#f3e2c0}
button.ar-opp.on{border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/6px 14px 6px stretch!important}
.fz-board{border-image:url(art/ui/mat/indigo.png) 46 50 46 50 fill/10px 12px 10px stretch;border-width:10px 12px 10px}
.fz-web{background-image:url(art/ui/mat/web2.png)}
.fz-tag{font-size:12.5px;letter-spacing:-.02em}.fz-tag i{font-size:10px}
.fz-ln{font-size:13px}.fz-lv{font-size:16.5px}
.tower .tw-floors li.mid{border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch!important}
.tower .tw-floors li.mid b,.tower .tw-floors li.mid small{color:#f3e2c0;-webkit-text-stroke:0}
.tower .tw-floors li.mid b::after{color:#ff8a5a}
.arena-pg button.ar-opp .ar-who small{color:#e8c890}
main .arena-pg .ar-rank{background:none;border:0;border-style:solid;border-width:8px 22px 8px;border-image:url(art/ui/mat/lava.png) 36 100 36 100 fill/8px 22px 8px stretch;filter:drop-shadow(0 2px 0 #2a1f1699)}
main .arena-pg .ar-rank div{border-left:0;padding:3px 2px}
main .arena-pg .ar-warn{background:none;border:0;border-style:solid;border-width:6px 14px 6px;border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/6px 14px 6px stretch;color:#3a1c08;padding:4px 6px}
main .raid-pg .rd-boss{background:none;border:0;border-style:solid;border-width:10px 12px 10px;border-image:url(art/ui/mat/indigo.png) 46 50 46 50 fill/10px 12px 10px stretch;filter:drop-shadow(0 2px 0 #2a1f1699)}
/* 2026-10-23 坑道をえらぶ札：プリコネのダンジョン・ブルアカの場所えらびのように、入口の絵を札の顔にする（チャッピーの絵 art/ui/mine/） */
main .mine .mn-place{border-width:7px 9px 8px;border-image:url(art/ui/mat/lava.png) 36 100 36 100 fill/7px 9px 8px stretch;padding:0 0 4px;gap:3px;filter:brightness(.6) saturate(.55) drop-shadow(0 3px 0 #2a1f16);color:#f6e2b8}
main .mine .mn-place.on{filter:drop-shadow(0 0 7px #ff9a3a) drop-shadow(0 4px 0 #2a1f16)}
.mine .mn-pic{position:relative;display:block;aspect-ratio:520/323;background:center/cover no-repeat;border:2px solid #2a1408;margin:0 -2px}
.mine .mn-pic b{position:absolute;left:4px;bottom:2px;font-size:17px;color:#fff6df;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
main .mine .mn-place small{color:#f6e2b8;font-size:11px;padding:0 3px}
main .mine .mn-sets{gap:2px 6px;padding:0 3px}
main .mine .mn-sets i{display:inline-flex;align-items:center;gap:2px;background:none;padding:0;font-size:11px;color:#fff6df}
main .mine .mn-raimei .mn-sets i{background:none}
.mine .mn-sets img{width:18px;height:18px}
main .mine .mn-place em{color:#e8c890;padding:0 3px}
main .mine .mn-place.on::after{content:"ここに入る";right:6px;top:-22px;width:72px;height:38px;padding:17px 0 0;box-sizing:border-box;text-align:center;font-size:11px;color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill;background:url(art/ui/mine/sign.png) center/100% 100% no-repeat;transform:rotate(3deg)}
main .mine .mn-info p,main .mine .mn-info p b,main .mine .mn-odds td{color:#f3e2c0}
main .mine .mn-odds th{color:#ffc46a;background:none}
main .mine .mn-odds td.none{color:#a08868}
main .mine .mn-info small{color:#d8c098;opacity:1}
/* 2026-10-23 ストーリーの話えらび：プリコネ・ブルアカのように、漫画のコマを札の顔いっぱいに。題は絵の上に縁取りの字 */
main .chapters{gap:10px}
main .chapter{display:block;padding:0;background:none!important;box-shadow:none!important;border:0;border-style:solid;border-width:7px 9px 8px;border-image:url(art/ui/mat/lava.png) 36 100 36 100 fill/7px 9px 8px stretch;filter:drop-shadow(0 3px 0 #2a1f1699)}
main .chapter:active{transform:translateY(2px);box-shadow:none}
main .chapter .ch-cover{display:block!important;width:100%!important;height:auto!important;aspect-ratio:2.7/1;flex:none!important;min-height:0;border:2px solid #2a1408;background-position:center 35%!important}
main .chapter .ch-cover i{position:absolute;left:12px;top:10px;font-size:11px;padding:1px 6px;background:#2a1408;color:#fff6df}
main .chapter .ch-body{position:absolute;left:12px;right:12px;bottom:10px;display:flex;align-items:flex-end;justify-content:space-between;gap:6px;pointer-events:none}
main .chapter .ch-body b{font-size:20px;color:#fff6df;-webkit-text-stroke:5px #2a1408;paint-order:stroke fill;line-height:1.15}
main .chapter .ch-body small{flex:none;font-size:10.5px;color:#fff6df;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
main .chapter .hanko{top:8px;right:12px;font-size:12px;background:#fff6df}
main .chapter.locked{opacity:1;filter:grayscale(1) brightness(.7)}
main .chapter.locked .ch-cover{aspect-ratio:4.6/1}
/* 根の国の入口：絵（チャッピー art/ui/dive_gate.jpg）の上に、いちばん深い層を大きく（メメントモリの「第○階」のように） */
.dv-gate{position:relative;aspect-ratio:2.4/1;margin:6px 0 4px;background:url(art/ui/dive_gate.jpg) center 40%/cover no-repeat;border:0;border-style:solid;border-width:7px 9px 8px;border-image:url(art/ui/mat/lava.png) 36 100 36 100 /7px 9px 8px stretch;box-shadow:inset 0 0 0 2px #2a1408;filter:drop-shadow(0 3px 0 #2a1f1699)}
.dv-gate span{position:absolute;left:10px;bottom:40px;font-size:12px;color:#fff6df;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.dv-gate b{position:absolute;left:8px;bottom:2px;font-family:var(--game-font);font-size:40px;line-height:1;color:#fff6df;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill}
.dv-gate b small{font-size:16px;margin-left:2px;-webkit-text-stroke:4px #2a1408}
/* 2026-10-23 ゆぐら登り：ドラクエタクトの塔のように、ゆぐらの幹から出た枝に、その階の敵が立つ1枚の絵（チャッピー art/ui/tower/） */
.tw-tree{list-style:none;margin:4px 0 8px;padding:10px 0 4px;position:relative;background:url(art/ui/tower/trunk.jpg) center top/58px auto repeat-y}
.tw-tree::before,.tw-tree::after{content:"";position:absolute;top:0;bottom:0;width:3px;left:calc(50% - 30px);background:#2a1408}
.tw-tree::after{left:calc(50% + 27px)}
.tw-tree li{position:relative;height:120px;margin-top:-44px;z-index:1}
.tw-tree li:first-child{margin-top:0}
.tw-tree .tw-br{position:absolute;top:20px;width:170px;height:119px;background:url(art/ui/tower/branch.png) 0 0/100% 100% no-repeat}
.tw-tree li.r .tw-br{left:calc(50% + 22px)}
.tw-tree li.l .tw-br{right:calc(50% + 22px);transform:scaleX(-1)}
.tw-tree .tw-foe{position:absolute;top:-8px;height:52px;width:auto;max-width:70px;object-fit:contain;filter:drop-shadow(0 2px 0 #2a1408)}
.tw-tree li.r .tw-foe{left:calc(50% + 70px)}
.tw-tree li.l .tw-foe{right:calc(50% + 70px)}
.tw-tree li.boss .tw-foe{height:66px;top:-22px;max-width:90px}
.tw-tree .tw-tag{position:absolute;top:99px;width:100px;height:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1;text-align:center;color:#3a1c08}
.tw-tree li.r .tw-tag{left:calc(50% + 22px + 26px)}
.tw-tree li.l .tw-tag{right:calc(50% + 22px + 26px)}
.tw-tree .tw-tag b{font-size:14px}
.tw-tree .tw-tag b i{font-style:normal;font-size:10px;margin-left:3px;padding:0 3px;color:#fff6df;background:#a8321a}
.tw-tree .tw-tag small{font-size:8.5px;max-width:92px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-tree .tw-st{position:absolute;top:2px;width:62px;height:32px;padding-top:7px;box-sizing:border-box;font-style:normal;font-size:11px;text-align:center;color:#fff6df;-webkit-text-stroke:3px #3a1408;paint-order:stroke fill;background:center/100% 100% no-repeat}
.tw-tree .tw-st.clear{background-image:url(art/ui/tower/tag_clear.png);height:28px;padding-top:6px;top:8px;color:#3a1c08;-webkit-text-stroke:0}
.tw-tree .tw-st.next{background-image:url(art/ui/tower/tag_new.png);top:-14px;transform:rotate(-6deg)}
.tw-tree li.r .tw-st{left:calc(50% + 74px)}
.tw-tree li.l .tw-st{right:calc(50% + 74px)}
.tw-tree li.r .tw-st.next{left:calc(50% + 130px)}
.tw-tree li.l .tw-st.next{right:calc(50% + 130px)}
.tw-tree li.now .tw-br{filter:drop-shadow(0 0 6px #ffb040)}
.tw-tree li.done .tw-br{filter:brightness(.8) saturate(.7)}
main .chapter.unread::after{content:"未読";position:absolute;top:-6px;right:6px;width:64px;height:42px;padding-top:15px;box-sizing:border-box;text-align:center;font-size:12px;color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill;background:url(art/ui/tower/tag_new.png) center/100% 100% no-repeat;transform:rotate(-5deg)}
main .chapter.locked{filter:drop-shadow(0 3px 0 #2a1f1699)}
main .chapter.locked .ch-cover{background:url(art/ui/mat/washi.png) center/100% 100% no-repeat!important;border:0;filter:grayscale(.6) brightness(.85)}
main .chapter.locked .ch-cover i{background:#6a5a48}
main .chapter.locked .ch-body b,main .chapter.locked .ch-body small{color:#5a4a3a;-webkit-text-stroke:0}
main .chapter.locked .ch-body{left:34px;right:34px;bottom:12px}main .chapter.locked .ch-cover i{left:34px;top:12px}main .chapter.locked .ch-cover{aspect-ratio:5.2/1}
/* 2026-10-23 黄の国の賭場：入口の絵にコインの数を大きく。両替は巾着・升・宝箱の3枚札、景品は景品台に物をのせた札（チャッピー art/ui/casino/） */
.cs-gate{position:relative;aspect-ratio:2.3/1;margin:4px 0 6px;background:url(art/ui/casino/gate.jpg) center 45%/cover no-repeat;border:0;border-style:solid;border-width:7px 9px 8px;border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 /7px 9px 8px stretch;box-shadow:inset 0 0 0 2px #2a1408;filter:drop-shadow(0 3px 0 #2a1f1699)}
.cs-gate>span{position:absolute;color:#fff6df;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill;line-height:1}
.cs-gate .cs-name{left:8px;top:7px;font-family:var(--game-font);font-size:16px}
.cs-gate .cs-coins{left:6px;bottom:6px;display:flex;align-items:flex-end;gap:3px}
.cs-gate .cs-coins img{width:34px;height:34px;filter:drop-shadow(0 2px 0 #2a1408)}
.cs-gate .cs-coins b{font-family:var(--game-font);font-size:34px;color:#ffe08a;-webkit-text-stroke:6px #2a1408}
.cs-gate .cs-coins small{font-size:13px;margin-bottom:3px}
.cs-gate .cs-leaf{right:8px;bottom:8px;font-size:11.5px;display:flex;align-items:center;gap:2px}
.cs-gate .cs-leaf .ico,.cs-price .ico,.cs-pack b .ico,.cs-bar .cs-coins .ico{width:18px;height:18px;vertical-align:-4px}
.cs-packs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.cs-pack{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 2px 6px;font:inherit;background:none;border:0;border-style:solid;border-width:8px 10px 8px;border-image:url(art/ui/mat/indigo.png) 46 50 46 50 fill/8px 10px 8px stretch;color:#fff6df;filter:drop-shadow(0 3px 0 #2a1f1699);cursor:pointer}
.cs-pack:disabled{filter:grayscale(.7) brightness(.7)}
.cs-pack>img{width:76px;height:76px;object-fit:contain}
.cs-pack b{font-family:var(--game-font);font-size:17px;color:#ffe08a;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
.cs-pack em{position:absolute;top:-12px;right:-6px;font-style:normal;font-size:10px;padding:5px 8px 3px 14px;color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill;background:url(art/ui/tower/tag_new.png) center/100% 100% no-repeat;transform:rotate(6deg);white-space:nowrap}
.cs-price{display:inline-flex;align-items:center;gap:2px;padding:2px 8px 2px 16px;font-size:13px;font-weight:900;color:#3a1c08;background:url(art/ui/casino/tag.png) center/100% 100% no-repeat;-webkit-text-stroke:0}
.cs-prizes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.cs-prize{display:flex;flex-direction:column;align-items:center;gap:1px;padding:2px 1px 4px;font:inherit;text-align:center;background:none;border:0;border-style:solid;border-width:7px 9px 7px;border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/7px 9px 7px stretch;color:#3a1c08;filter:grayscale(.5) brightness(.85) drop-shadow(0 3px 0 #2a1f1699);cursor:pointer;min-width:0}
.cs-prize.can{filter:drop-shadow(0 3px 0 #2a1f1699)}
.cs-prize.pick{border-image-source:url(art/ui/mat/lacquer.png);border-image-slice:50 60 50 60 fill;color:#fff6df;filter:drop-shadow(0 0 6px #ffb040)}
.cs-prize.pick small{color:#fff0d0}
.cs-stand{display:flex;align-items:flex-start;justify-content:center;width:84px;height:56px;background:url(art/ui/casino/stand.png) center bottom/100% auto no-repeat}
.cs-stand img{width:40px;height:40px;object-fit:contain;margin-top:-2px;filter:drop-shadow(0 2px 0 #2a1408)}
.cs-prize b{font-size:11.5px;line-height:1.2;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-prize small{font-size:8.5px;line-height:1.25;height:2.5em;overflow:hidden;color:#6a4a2a}
/* 台の下の小さなボタン（オート・目押し助け・音）：角丸の四角をやめて、鉄の板（入）と朱塗り（入っている） */
#sl-host .sx-opt{border-radius:0;background:none;border:0;border-style:solid;border-width:5px 12px 5px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 12px 5px stretch;color:#c8b08a;padding:2px 4px;font-size:11.5px}
#sl-host .sx-opt.on{border-image-source:url(art/ui/mat/lacquer.png);border-image-slice:50 60 50 60 fill;color:#fff6df;-webkit-text-stroke:2px #5a1408;paint-order:stroke fill}
/* 2026-10-23 ぶとうかい：スクロールなしで。ハナカグラは溶岩の台のよこに小さく立って、ひとことだけ。タブは大きな札（1つ1つが大きな入口なので） */
main .arena-pg .ar-head{position:relative;display:grid;grid-template-columns:78px 1fr;grid-template-rows:auto auto;column-gap:4px;margin:2px 0 6px}
.arena-pg .ar-guide{grid-row:1/3;align-self:end;width:86px;height:auto;margin:0 -6px -4px -4px;z-index:2;filter:drop-shadow(0 2px 0 #2a1f1699)}
.arena-pg .ar-say{position:relative;margin:0 0 6px;padding:5px 8px;font-size:12px;line-height:1.35;color:#2a1408;background:#fffaf0;border:2px solid #2a1408;box-shadow:3px 3px 0 #2a1408}
.arena-pg .ar-say::before{content:"";position:absolute;left:-9px;bottom:8px;border:5px solid transparent;border-right:8px solid #2a1408}
main .arena-pg .ar-head .ar-rank{position:relative;margin:0;padding-bottom:12px}
main .arena-pg .ar-rank b{font-size:19px}
main .arena-pg .ar-head .ar-next{position:absolute;left:0;right:0;bottom:-2px;margin:0;font-size:10px;color:#e8c890;text-align:center}
main .arena-pg .ar-tabs{display:grid;grid-template-columns:repeat(3,1fr)!important;gap:6px;margin:0 0 8px}
.ar-tabb{position:relative;height:50px;font:inherit;font-family:var(--game-font);font-size:18px;color:#f3e2c0;background:none;border:0;border-style:solid;border-width:7px 16px 7px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/7px 16px 7px stretch;filter:drop-shadow(0 3px 0 #2a1f1699);cursor:pointer;padding:0;white-space:nowrap}
.ar-tabb.on{border-image-source:url(art/ui/mat/lacquer.png);border-image-slice:50 60 50 60 fill;color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill;filter:drop-shadow(0 0 5px #ffb040) drop-shadow(0 3px 0 #2a1f1699)}
.ar-tabb em{position:absolute;top:-12px;right:-12px;width:46px;height:26px;padding-top:6px;box-sizing:border-box;font-style:normal;font-size:10px;color:#fff6df;-webkit-text-stroke:2px #5a1408;paint-order:stroke fill;background:url(art/ui/tower/tag_new.png) center/100% 100% no-repeat;transform:rotate(8deg)}
main .arena-pg .ar-oh{display:flex;align-items:center;gap:6px;margin:0 0 4px}
.arena-pg .ar-oh b{font-family:var(--game-font);font-size:16px;color:#2a1408}
.arena-pg .ar-oh small{flex:1;font-size:11px;color:#6b4a2a}
main .arena-pg .ar-oh .ar-refresh{margin:0;font-size:12px;width:auto}
main .arena-pg .ar-opps{gap:5px}
main .arena-pg button.ar-opp{min-height:0;padding:0 4px!important}
main .arena-pg .ar-team img{width:36px;height:36px}
.ar-vs{display:flex;align-items:center;gap:8px;margin:4px 0 8px;padding:4px 6px;border:0;border-style:solid;border-width:6px 16px 6px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch;color:#f3e2c0}
.ar-vs .ar-who{flex:1;display:flex;flex-direction:column}.ar-vs .ar-who b{font-size:16px}.ar-vs .ar-who small{font-size:11px;color:#e8c890}
.ar-vs .ar-team{display:flex;gap:2px}.ar-vs .ar-team img{width:40px;height:40px;object-fit:contain}
.modal .ar-go{width:100%;margin-top:8px}
main .arena-pg .ar-head{grid-template-columns:96px 1fr}
.arena-pg .ar-guide{width:110px;margin:0 -10px -6px -8px}
.arena-pg .ar-say{font-size:12.5px}
.modal p.lead-note{display:flex!important;flex-wrap:nowrap;white-space:nowrap;font-size:11px}
.modal p.lead-note b{flex:none}
.modal p.lead-note small{white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;min-width:0;display:block!important}
@media (max-height:700px){.ar-tabb{height:42px;font-size:16px}main .arena-pg .ar-tabs{gap:4px;margin-bottom:5px}main .arena-pg .ar-team img{width:30px;height:30px}.arena-pg .ar-say{font-size:11.5px;padding:3px 7px}main .arena-pg .ar-opps{gap:3px}}
/* 2026-10-23 相手の行：まん中が空いて、相手のモンスターが小さかった → モンスターを大きく、板からはみ出すくらいに */
main .arena-pg button.ar-opp{overflow:visible}
main .arena-pg button.ar-opp .ar-who b{font-size:17px}
main .arena-pg button.ar-opp .ar-team{gap:0;margin:-10px 0 -6px}
main .arena-pg button.ar-opp .ar-team img{width:58px;height:58px;filter:drop-shadow(0 2px 0 #1a0f08)}
@media (max-height:700px){main .arena-pg button.ar-opp .ar-team img{width:50px;height:50px}main .arena-pg button.ar-opp .ar-team{margin:-8px 0 -6px}}
@media (max-height:700px){main .arena-pg button.ar-opp .ar-team img{width:46px;height:46px}main .arena-pg button.ar-opp .ar-team{margin:-10px 0 -10px}}
@media (max-height:700px){main .arena-pg button.ar-opp .ar-who b{font-size:15px;line-height:1.2}main .arena-pg button.ar-opp .ar-who small{line-height:1.2}}
/* まん中が空く → 3体を行いっぱいに広げ、右はしに「勝てば +ポイント」 */
main .arena-pg button.ar-opp .ar-who{flex:0 0 74px;min-width:0}
main .arena-pg button.ar-opp .ar-who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
main .arena-pg button.ar-opp .ar-team{flex:1;justify-content:space-evenly}
main .arena-pg button.ar-opp .ar-team img{width:62px;height:62px}
.arena-pg .ar-gain{flex:none;display:flex;flex-direction:column;align-items:center;line-height:1.05;padding:2px 6px 3px;background:#2a1408;border:2px solid #8a6a3a}
.arena-pg .ar-gain small{font-size:9px;color:#e8c890!important}
.arena-pg .ar-gain b{font-family:var(--game-font);font-size:16px;color:#ffd76a!important}
@media (max-height:700px){main .arena-pg button.ar-opp .ar-team img{width:50px;height:50px}}
main .arena-pg button.ar-opp .ar-who{flex:0 0 84px}
main .arena-pg button.ar-opp .ar-who small{white-space:nowrap;font-size:10.5px}
.arena-pg .ar-gain{background:none;border:0;padding:0 2px}
.arena-pg .ar-gain b{font-size:19px;-webkit-text-stroke:4px #1a0f08;paint-order:stroke fill}
/* 2026-10-23 ユーザー「キャラを広げただけで無駄なスペースは減ってない」→ 横長の板をやめて2列のカード。3体がカードの幅をちょうど埋める。6枠目に入れかえる */
main .arena-pg .ar-opps{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important}
main .arena-pg button.ar-opp{display:grid!important;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:start;gap:0 4px;padding:2px 2px 0!important;border-width:7px 10px 7px!important;border-image-width:7px 10px 7px!important;text-align:left}
main .arena-pg button.ar-opp .ar-who{flex:none;min-width:0}
main .arena-pg button.ar-opp .ar-who b{font-size:15px;line-height:1.2}
main .arena-pg button.ar-opp .ar-who small{font-size:10px}
main .arena-pg button.ar-opp .ar-gain{align-items:flex-end}
main .arena-pg button.ar-opp .ar-gain b{font-size:17px}
main .arena-pg button.ar-opp .ar-team{grid-column:1/3;display:flex;justify-content:center;gap:0;margin:-4px 0 -2px}
main .arena-pg button.ar-opp .ar-team img{width:54px;height:54px}
main .arena-pg button.ar-refresh-card{display:flex!important;align-items:center;justify-content:center;text-align:center;font-family:var(--game-font);font-size:15px;line-height:1.3;color:#f3e2c0;min-height:0}
@media (max-height:700px){main .arena-pg button.ar-opp .ar-team img{width:48px;height:48px}}
@media (min-height:760px){main .arena-pg button.ar-opp .ar-team img{width:60px;height:66px;object-fit:contain}main .arena-pg button.ar-opp .ar-team{margin:2px 0 4px}main .arena-pg .ar-opps{gap:8px!important}main .arena-pg button.ar-opp .ar-who b{font-size:16px}}
/* 2026-10-23 ユーザー：セリフはハナカグラの絵の上にぎゅっと。ランク・ポイント・順位をもっと大きく派手に */
main .arena-pg .ar-head{grid-template-columns:118px 1fr;grid-template-rows:auto 1fr;column-gap:6px;align-items:stretch}
main .arena-pg .ar-say{grid-column:1;grid-row:1;margin:0 0 2px;padding:3px 5px;font-size:10px;line-height:1.3;box-shadow:2px 2px 0 #2a1408;z-index:3}
main .arena-pg .ar-say::before{left:auto;right:auto;left:40%;bottom:-9px;border:5px solid transparent;border-top:7px solid #2a1408}
main .arena-pg .ar-guide{grid-column:1;grid-row:2;align-self:end;justify-self:center;width:96px;margin:-6px 0 -4px}
main .arena-pg .ar-head .ar-rank{grid-column:2;grid-row:1/3;align-self:stretch;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr auto;padding:4px 4px 0;border-width:10px 22px 10px;border-image-width:10px 22px 10px}
main .arena-pg .ar-head .ar-rank>div{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}
main .arena-pg .ar-head .ar-rank>div:first-child{grid-column:1/3}
main .arena-pg .ar-rank small{font-size:10.5px;color:#e8c890;opacity:1}
main .arena-pg .ar-rank b{font-family:var(--game-font);font-size:30px;line-height:1.05;color:#ffd76a;-webkit-text-stroke:5px #3a0e04;paint-order:stroke fill;text-shadow:0 0 10px #ff8a2a,0 3px 0 #1a0802}
main .arena-pg .ar-rank>div:first-child b{font-size:34px;color:#fff1b0;letter-spacing:.08em}
main .arena-pg .ar-head .ar-next{position:static;grid-column:1/3;font-size:10.5px;padding:0 0 2px}
main .arena-pg .ar-head{grid-template-columns:128px 1fr}main .arena-pg .ar-say{font-size:9.8px;white-space:nowrap;letter-spacing:-.02em}main .arena-pg .ar-guide{width:100px}
/* ランクは小さく1行、ポイントと順位を大きく（2026-10-23 ユーザー） */
main .arena-pg .ar-head .ar-rank{grid-template-rows:auto 1fr auto}
main .arena-pg .ar-head .ar-rank>div:first-child{flex-direction:row;gap:6px;align-items:baseline}
main .arena-pg .ar-rank>div:first-child b{font-size:15px;letter-spacing:.04em;-webkit-text-stroke:3px #3a0e04;text-shadow:none}
main .arena-pg .ar-rank>div:not(:first-child) b{font-size:42px;line-height:1}
main .arena-pg .ar-head .ar-rank{grid-template-columns:1.3fr 1fr}
main .arena-pg .ar-rank b{white-space:nowrap}
main .arena-pg .ar-rank b i{font-style:normal;font-size:.5em;margin-left:1px}
main .arena-pg .ar-rank>div:not(:first-child) b{font-size:40px}
main .arena-pg .ar-head .ar-rank{column-gap:10px}
main .arena-pg .ar-rank>div:not(:first-child) b{font-size:36px}
main .arena-pg .ar-head .ar-rank>div:nth-child(3){border-left:2px solid #6a3a1a99}
/* 2026-10-23 ユーザー：枠の大きさはそのまま、文字は角に寄せて、キャラを大きく。文字は縁取りしてキャラの上に重ねる */
main .arena-pg button.ar-opp:not(.ar-refresh-card){position:relative;display:block!important;height:123px;padding:0!important}
main .arena-pg button.ar-opp .ar-who{position:absolute;left:2px;top:0;z-index:2;line-height:1.1}
main .arena-pg button.ar-opp .ar-who b,main .arena-pg button.ar-opp .ar-who small{-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
main .arena-pg button.ar-opp .ar-gain{position:absolute;right:0;top:0;z-index:2}
main .arena-pg button.ar-opp .ar-gain small{-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
main .arena-pg button.ar-opp .ar-team{position:absolute;left:0;right:0;bottom:-2px;margin:0!important;display:flex;justify-content:center;align-items:flex-end}
main .arena-pg button.ar-opp .ar-team img{width:78px!important;height:78px!important;margin:0 -10px;object-fit:contain}
@media (max-height:760px){main .arena-pg button.ar-opp:not(.ar-refresh-card){height:88px}main .arena-pg button.ar-opp .ar-team img{width:62px!important;height:62px!important;margin:0 -7px}}
/* 2026-10-23 ユーザー：見習いの下に数字、その下に「勝てば +16」。文字は左に縦に積み、キャラは右に */
main .arena-pg button.ar-opp .ar-who{display:flex;flex-direction:column}
main .arena-pg button.ar-opp .ar-who .ar-pt{font-size:13px;font-weight:900}
main .arena-pg button.ar-opp .ar-gain{right:auto;left:2px;top:auto;bottom:2px;align-items:flex-start}
main .arena-pg button.ar-opp .ar-team{left:auto;right:-4px;justify-content:flex-end}
main .arena-pg button.ar-opp .ar-team{left:42px;right:-2px;justify-content:space-between}
main .arena-pg button.ar-opp .ar-team img{width:60px!important;height:84px!important;margin:0 -8px;object-fit:contain;object-position:center bottom}
@media (max-height:760px){main .arena-pg button.ar-opp .ar-team img{width:52px!important;height:64px!important;margin:0 -7px}main .arena-pg button.ar-opp .ar-who b{font-size:13px}main .arena-pg button.ar-opp .ar-who small{font-size:9px}main .arena-pg button.ar-opp .ar-who .ar-pt{font-size:11px}main .arena-pg button.ar-opp .ar-gain b{font-size:14px}}
@media (min-height:761px){main .arena-pg button.ar-opp .ar-team{left:46px;right:2px;justify-content:center}main .arena-pg button.ar-opp .ar-team img{width:74px!important;height:92px!important;margin:0 -16px}}
@media (min-height:761px){main .arena-pg button.ar-opp .ar-team{left:60px;right:4px}main .arena-pg button.ar-opp .ar-team img{width:66px!important;height:96px!important;margin:0 -16px}}
/* 2026-10-23 ユーザー：キャラは大きく、重ならず、すき間もあけない → 字の列の右を3等分して、絵の透明なふちの分だけ食いこませる */
main .arena-pg button.ar-opp .ar-team{left:56px!important;right:0!important;top:2px;bottom:-2px;display:grid!important;grid-template-columns:repeat(3,1fr);align-items:end;justify-items:center;gap:0}
main .arena-pg button.ar-opp .ar-team img{width:calc(100% + 22px)!important;height:auto!important;max-height:100%;margin:0 -11px!important;object-fit:contain;object-position:center bottom}
main .arena-pg .ar-refresh-top{display:none}
/* 背の高い画面は1列：横幅が広いぶん、キャラを大きく出せる。カードの高さは画面の残りを5等分 */
@media (min-height:800px){
 main .arena-pg .ar-opps{grid-template-columns:1fr!important;gap:5px!important}
 main .arena-pg button.ar-opp:not(.ar-refresh-card){height:calc((100dvh - 432px)/5)!important;min-height:62px}
 main .arena-pg button.ar-refresh-card{display:none!important}
 main .arena-pg .ar-refresh-top{display:inline-block}
 main .arena-pg button.ar-opp .ar-who{flex-direction:row!important;align-items:baseline;gap:6px;top:1px}
 main .arena-pg button.ar-opp .ar-who b{font-size:16px!important}
 main .arena-pg button.ar-opp .ar-who small{font-size:10.5px!important}
 main .arena-pg button.ar-opp .ar-who .ar-pt{font-size:12px!important}
 main .arena-pg button.ar-opp .ar-gain{flex-direction:row!important;align-items:baseline;gap:3px;bottom:1px}
 main .arena-pg button.ar-opp .ar-gain b{font-size:20px!important}
 main .arena-pg button.ar-opp .ar-team{left:150px!important;right:0!important}
}
@media (min-height:800px){
 main .arena-pg button.ar-opp .ar-who{flex-direction:column!important;align-items:flex-start;gap:0}
 main .arena-pg button.ar-opp .ar-who b{font-size:17px!important}
 main .arena-pg button.ar-opp .ar-gain{bottom:0}
}
/* 700〜799px（iPhoneのSafariでよくある高さ）：1列で、字は2行（名前・ランク・ポイント／勝てば） */
@media (min-height:700px) and (max-height:799px){
 main .arena-pg .ar-opps{grid-template-columns:1fr!important;gap:4px!important}
 main .arena-pg button.ar-opp:not(.ar-refresh-card){height:calc((100dvh - 418px)/5)!important;min-height:56px}
 main .arena-pg button.ar-refresh-card{display:none!important}
 main .arena-pg .ar-refresh-top{display:inline-block}
 main .arena-pg button.ar-opp .ar-who{flex-direction:row!important;align-items:baseline;gap:5px;top:0}
 main .arena-pg button.ar-opp .ar-who b{font-size:15px!important}
 main .arena-pg button.ar-opp .ar-who small{font-size:10px!important}
 main .arena-pg button.ar-opp .ar-who .ar-pt{font-size:11.5px!important}
 main .arena-pg button.ar-opp .ar-gain{flex-direction:row!important;align-items:baseline;gap:3px;bottom:0}
 main .arena-pg button.ar-opp .ar-gain b{font-size:18px!important}
 main .arena-pg button.ar-opp .ar-team{left:150px!important;right:0!important}
 main .arena-pg button.ar-opp .ar-team img{max-height:none;height:calc((100dvh - 418px)/5 + 4px)!important;width:auto!important;margin:0 -6px!important}
}
/* 2026-10-23 ユーザー「スペースあるよ」→ ポイントと順位を台いっぱいに */
main .arena-pg .ar-rank>div:not(:first-child) b{font-size:clamp(36px,13vw,54px)!important;line-height:.95}
main .arena-pg .ar-head .ar-rank{column-gap:4px;padding-top:2px}
main .arena-pg .ar-rank small{font-size:10px}
main .arena-pg .ar-rank>div:not(:first-child) b{font-size:44px!important}main .arena-pg .ar-head .ar-rank{column-gap:12px}
main .arena-pg .ar-head{grid-template-columns:128px minmax(0,1fr)!important}main .arena-pg .ar-head .ar-rank{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)!important;min-width:0}main .arena-pg .ar-rank>div:not(:first-child) b{font-size:40px!important}
main .arena-pg .ar-head{grid-template-columns:112px minmax(0,1fr)!important}main .arena-pg .ar-guide{width:96px}main .arena-pg .ar-say{font-size:9px}main .arena-pg .ar-rank>div:not(:first-child) b{font-size:38px!important}
main .arena-pg .ar-say{letter-spacing:-.05em}@media (max-width:380px){main .arena-pg .ar-rank>div:not(:first-child) b{font-size:35px!important}}
main .arena-pg .ar-head .ar-back{position:absolute;top:-4px;right:-4px;z-index:5;font-size:12px;padding:2px 6px;min-height:0}
/* 2026-10-23 国あて：字を減らし、絵で見せる */
main .arena-pg .ar-vote-head{justify-content:space-between;align-items:center;background:none;border:0;border-style:solid;border-width:6px 16px 6px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch;padding:2px 4px;margin:0 0 6px}
.arena-pg .ar-vote-head>span{display:flex;align-items:center;gap:3px}
.arena-pg .ar-vote-head small{color:#e8c890}
.arena-pg .ar-close{font-size:12px;color:#f3e2c0}
.arena-pg .ar-hit{display:flex;align-items:center;gap:10px;margin:0 0 6px;padding:0 4px;font-weight:900;font-size:15px;color:#2a1408}
.arena-pg .ar-hit small{font-size:11px;padding:1px 6px;color:#fff6df;background:#a8321a}
.arena-pg .ar-hit span{display:flex;align-items:center;gap:2px}
.arena-pg .ar-hit .ico{width:24px;height:24px}
main .arena-pg .ar-ctry-btn{aspect-ratio:3/2;justify-content:flex-end;padding:4px 4px 6px;background:var(--c) center/cover no-repeat;border:0;box-shadow:none;filter:drop-shadow(0 3px 0 #2a1f1699)}
main .arena-pg .ar-ctry-btn b{font-size:21px;-webkit-text-stroke:5px #1a0f08}
main .arena-pg .ar-ctry-btn small{background:none;font-size:10.5px;color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
main .arena-pg .ar-ctry-btn em{top:-6px;right:-4px;width:46px;height:26px;padding-top:6px;box-sizing:border-box;border:0;font-size:11px;color:#fff6df;-webkit-text-stroke:2px #5a1408;paint-order:stroke fill;background:url(art/ui/tower/tag_new.png) center/100% 100% no-repeat;transform:rotate(8deg)}
main .arena-pg .ar-ctry-btn{aspect-ratio:330/306;background:center/100% 100% no-repeat;padding:0 0 4%;justify-content:flex-end;gap:2px;filter:drop-shadow(0 3px 0 #2a1f1699)}
main .arena-pg .ar-ctry-btn small{order:-1;margin-bottom:5%}
main .arena-pg .ar-ctry-btn b{margin-bottom:2%}
main .arena-pg .ar-ctry-btn{flex-direction:row!important;align-items:flex-end;justify-content:center;gap:6px}
main .arena-pg .ar-ctry-btn small{order:0;margin:0 0 4.5%;font-size:12px}
main .arena-pg .ar-ctry-btn b{margin:0 0 3%}
main .arena-pg .ar-ctry-btn:disabled{filter:brightness(.82) drop-shadow(0 3px 0 #2a1f1699)}
main .arena-pg .ar-head .ar-tops{position:absolute;top:-4px;right:-4px;z-index:5;display:flex;gap:3px}
main .arena-pg .ar-head .ar-tops .ar-back{position:static}
main .arena-pg .ar-head .ar-tops .navbtn{font-size:11.5px;padding:2px 5px;min-height:0}
main .arena-pg .ar-head .ar-rank>div:first-child{justify-content:flex-start;padding-left:4px}
.arena-pg .ar-left{margin:0 0 6px;font-size:12px;font-weight:900;color:#6b4a2a;text-align:right}
/* 2026-10-23 ユーザー：リーダーの札が赤なので、えらんだ仲間の札は緑に */
button.sb-cand.on{border-image:url(art/ui/btn_green.png) 50 120 56 fill/8px 10px 8px stretch!important;border-width:8px 10px 8px!important;filter:drop-shadow(0 0 5px #7ad04a) drop-shadow(0 3px 0 #2a1f16)!important}
button.sb-cand.on b,button.sb-cand.on small{color:#fff8e6;-webkit-text-stroke:2px #1a3a10;paint-order:stroke fill}
/* 2026-10-23 出撃準備の相手の板：空きをなくす。高さを詰めて、3体を大きく重ねて右いっぱいに */
.modal .ar-vs{position:relative;height:64px;margin:2px 0 6px;padding:0 4px;border-width:5px 14px 5px;border-image-width:5px 14px 5px;overflow:visible}
.modal .ar-vs .ar-who{flex:none;line-height:1.15;z-index:2}
.modal .ar-vs .ar-who b{font-size:17px;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.modal .ar-vs .ar-team{flex:1;display:flex;justify-content:flex-end;align-items:flex-end;align-self:stretch;margin:-14px -6px -4px 0}
.modal .ar-vs .ar-team img{width:84px;height:76px;margin:0 -10px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 2px 0 #1a0f08)}
.sb-cand small .sb-rk{font-size:1.25em;color:inherit}
button.sb-cand>img{width:64px!important;height:58px!important;object-fit:contain;margin:-4px 0 -2px}button.sb-cand>b{font-size:13px!important}button.sb-cand>small{font-size:11px!important;white-space:nowrap}
/* 塔の敵の並び：白い箱をやめて、3体を横に並べる（絵＋名前） */
.tower .tw-next{margin:4px 0 2px;font-size:14px}
.tower .tw-next b{font-size:16px}
.tower .tw-foes{display:grid!important;grid-template-columns:repeat(3,1fr);gap:0;margin:0 0 6px;padding:2px 0;border:0;border-style:solid;border-width:6px 16px 6px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 16px 6px stretch}
.tower .tw-foes li{display:flex!important;flex-direction:column;align-items:center;gap:0;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;font-size:11px;color:#f3e2c0;white-space:nowrap}
.tower .tw-foes li img{width:56px!important;height:50px!important;object-fit:contain}
.tower .tw-foes li .b3-chip{display:none}
.tower .tw-foes li.boss img{width:64px!important;height:56px!important}
/* 2026-10-23 ユーザー：幹が細い・「つぎ」がどこかわからない・字のバランス・迫力がない・キャラが浮いている → 組み直し
   幹は太く／敵は大きく、枝の上の面に足をつける／札は階の数を大きく、報酬はアイコン／挑む階は枝ごと光らせ、敵の頭の上に「ここに挑む」 */
.tw-tree{--tk:96px;--bw:172px;--bh:120px;--top:40px;padding:6px 0 0;background:url(art/ui/tower/trunk.jpg) center top/var(--tk) auto repeat-y}
.tw-tree::before{left:calc(50% - var(--tk)/2 - 3px)}.tw-tree::after{left:calc(50% + var(--tk)/2)}
.tw-tree li{height:calc(var(--top) + var(--bh));margin-top:-78px}
.tw-tree li:first-child{margin-top:0}
.tw-tree .tw-br{top:var(--top);width:var(--bw);height:var(--bh)}
.tw-tree li.r .tw-br{left:calc(50% + var(--tk)/2 - 20px)}
.tw-tree li.l .tw-br{right:calc(50% + var(--tk)/2 - 20px)}
/* 枝の上の面は絵の上から28%。敵の足をそこにつける */
.tw-tree .tw-foe{top:auto;bottom:calc(var(--bh) - var(--bh)*.3);height:86px;max-width:100px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 3px 0 #2a1408)}
.tw-tree li.boss .tw-foe{top:auto;height:100px;max-width:120px}
.tw-tree li.r .tw-foe{left:calc(50% + var(--tk)/2 - 20px + var(--bw)*.58);transform:translateX(-50%)}
.tw-tree li.l .tw-foe{right:calc(50% + var(--tk)/2 - 20px + var(--bw)*.58);transform:translateX(50%)}
/* 札（枝の絵に描かれた白木の札の上） */
.tw-tree .tw-tag{top:calc(var(--top) + var(--bh)*.64);width:calc(var(--bw)*.62);height:calc(var(--bh)*.32);justify-content:center;gap:1px}
.tw-tree li.r .tw-tag{left:calc(50% + var(--tk)/2 - 20px + var(--bw)*.14)}
.tw-tree li.l .tw-tag{right:calc(50% + var(--tk)/2 - 20px + var(--bw)*.14)}
.tw-tree .tw-tag b{display:flex;align-items:baseline;gap:1px;font-family:var(--game-font);font-size:20px;line-height:1}
.tw-tree .tw-tag b small{font-size:11px;max-width:none}
.tw-tree .tw-tag b i{align-self:center;font-size:10px;margin-left:4px;padding:1px 4px}
.tw-tree .tw-rw{display:flex;gap:5px;font-size:11px;font-weight:900;line-height:1}
.tw-tree .tw-rw span{display:flex;align-items:center;gap:1px}
.tw-tree .tw-rw img{width:14px;height:14px}
/* 登った：敵のかわりに金の札を枝の上に */
.tw-tree .tw-st.clear{top:auto;bottom:calc(var(--bh)*.7 + 2px);width:70px;height:30px}
.tw-tree li.r .tw-st.clear{left:calc(50% + var(--tk)/2 - 20px + var(--bw)*.58);transform:translateX(-50%)}
.tw-tree li.l .tw-st.clear{right:calc(50% + var(--tk)/2 - 20px + var(--bw)*.58);transform:translateX(50%)}
/* 挑む階：枝と札を光らせ、敵の頭の上に下向きの札 */
.tw-tree li.now .tw-br{filter:drop-shadow(0 0 10px #ffb040) drop-shadow(0 0 4px #ffe08a)}
.tw-tree li.now .tw-tag b{color:#a8321a}
.tw-tree .tw-st.next{top:auto;bottom:calc(var(--bh)*.7 + 90px);width:96px;height:34px;padding-top:9px;font-size:12px;transform:translateX(-50%);animation:twBob 1.2s ease-in-out infinite}
.tw-tree li.boss .tw-st.next{bottom:calc(var(--bh)*.7 + 104px)}
.tw-tree .tw-st.next::after{content:"";position:absolute;left:50%;bottom:-9px;margin-left:-7px;border:7px solid transparent;border-top:9px solid #a8321a;border-bottom:0}
.tw-tree li.r .tw-st.next{left:calc(50% + var(--tk)/2 - 20px + var(--bw)*.58)}
.tw-tree li.l .tw-st.next{right:auto;left:calc(50% - var(--tk)/2 + 20px - var(--bw)*.58)}
@keyframes twBob{50%{translate:0 -4px}}
.tw-tree li.done .tw-br{filter:brightness(.75) saturate(.6)}
.tw-tree{--bw:160px}
/* 「ここに挑む」は幹の上に、挑む敵のほうを指す札で */
.tw-tree .tw-st.next{bottom:calc(var(--bh)*.7 + 28px)!important;width:92px;height:34px;transform:none;z-index:3}
.tw-tree li.r .tw-st.next{left:calc(50% - 46px)!important;right:auto}
.tw-tree li.l .tw-st.next{left:calc(50% - 46px)!important;right:auto}
.tw-tree .tw-st.next::after{left:auto;bottom:auto;top:50%;margin:-7px 0 0;border:7px solid transparent}
.tw-tree li.r .tw-st.next::after{right:-12px;border-left:10px solid #a8321a;border-right:0}
.tw-tree li.l .tw-st.next::after{left:-12px;border-right:10px solid #a8321a;border-left:0}
@keyframes twBob{50%{translate:4px 0}}
.tw-tree li.l .tw-st.next{animation-name:twBobL}
@keyframes twBobL{50%{translate:-4px 0}}
.tw-tree li.r .tw-st.next::after{right:-4px}.tw-tree li.l .tw-st.next::after{left:-4px}
.tw-tree li.now .tw-tag b{color:#c0301a;-webkit-text-stroke:0}
.tw-tree li.mid .tw-tag b,.tw-tree li.boss .tw-tag b{font-size:17px}
/* 塔の出撃準備（窓）：敵3体は鉄の板に横並び、すき間なく */
.tw-pfoes{display:flex;justify-content:space-around;align-items:flex-end;margin:2px 0 6px;padding:0 4px;border:0;border-style:solid;border-width:5px 14px 5px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 14px 5px stretch}
.tw-pfoes span{display:flex;flex-direction:column;align-items:center;line-height:1}
.tw-pfoes img{width:64px;height:58px;object-fit:contain;object-position:center bottom;margin-top:-10px;filter:drop-shadow(0 2px 0 #1a0f08)}
.tw-pfoes span.boss img{width:76px;height:68px}
.tw-pfoes small{font-size:10.5px;color:#f3e2c0;margin:1px 0 2px}
.tw-tree li.now{cursor:pointer}
.modal .ar-go small{display:inline;white-space:nowrap;margin-left:8px}
/* 2026-10-23 塔をチャッピーの描き直しの絵に（太い幹・切り株の舞台・主の舞台・枝葉の背景） */
.tw-tree{--tk:104px;--bw:158px;--bh:107px;--sy:.24;--sx:.575;--fh:86px;
 margin:4px -4px 6px;padding:8px 0 4px;border:3px solid #2a1408;
 background:url(art/ui/tower/trunk3.jpg) center top/var(--tk) auto repeat-y,url(art/ui/tower/bg2.jpg) center top/100% auto repeat-y}
.tw-tree::before,.tw-tree::after{display:none}
.tw-tree li{--top:calc(var(--fh) - var(--bh)*var(--sy) + 4px);height:calc(var(--top) + var(--bh));margin-top:-74px}
.tw-tree li.boss{--bh:137px;--sy:.43;--sx:.55;--fh:100px}
.tw-tree .tw-br{background-image:url(art/ui/tower/branch2.png)}
.tw-tree li.boss .tw-br{background-image:url(art/ui/tower/branch_boss2.png)}
.tw-tree li.r .tw-br{left:calc(50% + var(--tk)/2 - 26px)}
.tw-tree li.l .tw-br{right:calc(50% + var(--tk)/2 - 26px)}
.tw-tree .tw-foe,.tw-tree li.boss .tw-foe{top:calc(var(--top) + var(--bh)*var(--sy) - var(--fh) + 4px);bottom:auto;height:var(--fh);max-width:110px}
.tw-tree li.r .tw-foe{left:calc(50% + var(--tk)/2 - 26px + var(--bw)*var(--sx))}
.tw-tree li.l .tw-foe{right:calc(50% + var(--tk)/2 - 26px + var(--bw)*var(--sx))}
.tw-tree .tw-tag{top:calc(var(--top) + var(--bh)*.70);height:calc(var(--bh)*.26);width:calc(var(--bw)*.67)}
.tw-tree li.boss .tw-tag{top:calc(var(--top) + var(--bh)*.735);height:calc(var(--bh)*.23)}
.tw-tree li.r .tw-tag{left:calc(50% + var(--tk)/2 - 26px + var(--bw)*.16)}
.tw-tree li.l .tw-tag{right:calc(50% + var(--tk)/2 - 26px + var(--bw)*.16)}
.tw-tree li.boss .tw-tag b,.tw-tree li.boss .tw-rw{color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill}
.tw-tree .tw-tag{flex-direction:row;align-items:center;gap:6px}
.tw-tree .tw-st.clear{top:calc(var(--top) + var(--bh)*var(--sy) - 30px);bottom:auto}
.tw-tree li.r .tw-st.clear{left:calc(50% + var(--tk)/2 - 26px + var(--bw)*var(--sx))}
.tw-tree li.l .tw-st.clear{right:calc(50% + var(--tk)/2 - 26px + var(--bw)*var(--sx))}
.tw-tree .tw-st.next{top:calc(var(--top) + var(--bh)*var(--sy) - 40px);bottom:auto!important}
.tw-tree li.now .tw-br{filter:drop-shadow(0 0 10px #ffd060) drop-shadow(0 0 3px #fff2a0)}
/* 塔の上の段：ノボリは小さく左、右にエナジーと今月の階。1画面に収める */
.tower .tw-head:not(.ev-head){position:relative;display:grid;grid-template-columns:84px 1fr;grid-template-rows:auto auto;column-gap:4px;margin:0 0 4px}
.tower .tw-head:not(.ev-head) .tw-guide{grid-row:2;grid-column:1;width:84px;align-self:end;filter:drop-shadow(0 2px 0 #2a1f1699)}
.tower .tw-head:not(.ev-head) .tw-say{grid-row:1;grid-column:1/3;justify-self:start;max-width:250px;margin:0 0 2px;padding:3px 7px;font-size:11px;line-height:1.35;color:#2a1408;background:#fffaf0;border:2px solid #2a1408;box-shadow:2px 2px 0 #2a1408;position:relative}
.tower .tw-head:not(.ev-head) .tw-say::before{content:"";position:absolute;left:30px;bottom:-9px;border:5px solid transparent;border-top:7px solid #2a1408}
.tower .tw-head:not(.ev-head) .tw-info{grid-row:2;grid-column:2;display:flex;flex-direction:column;gap:4px;justify-content:flex-end}
.tower .tw-info .stam-bar{margin:0}
.tower .tw-info .dv-stat{margin:0!important;display:flex!important;gap:4px}
.tower .tw-head:not(.ev-head) .tw-back{position:absolute;top:0;right:0;font-size:12px;padding:2px 6px;min-height:0}
.tw-tree li.boss .tw-tag{flex-direction:column;gap:1px}
.tw-tree li.boss .tw-tag b{font-size:15px}
.tw-tree li{margin-top:-50px}.tw-tree li:first-child{margin-top:0}.tw-tree{padding-top:14px}
.modal.still,.overlay.still{animation:none!important}
section.dive,section.mine{position:relative}.pg-back{position:absolute;top:2px;right:2px;z-index:6;font-size:12px;padding:2px 6px;min-height:0}
/* 2026-10-23 出撃準備の窓：画面に収める。仲間の札だけスクロール、×と「やめる・挑む」は固定 */
.modal.prep{display:flex;flex-direction:column;overflow:hidden!important;max-height:100%}
.modal.prep>*{flex:none}
.modal.prep .prep-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;margin:0 -4px;padding:2px 4px}
.modal.prep .prep-foot{display:flex;gap:6px;margin-top:6px}
.modal.prep .prep-foot .prep-no{flex:0 0 30%;margin:0}
.modal.prep .prep-foot .ar-go{flex:1;width:auto!important;margin:0!important}
.modal.prep .close{position:absolute;z-index:10}
.tw-pfoes{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:0;overflow:hidden}
.tw-pfoes span{position:relative;min-width:0}
.tw-pfoes img{width:52px;height:50px}
.tw-pfoes span.boss img{width:60px;height:56px}
.tw-pfoes small{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px}
.tw-pfoes em{position:absolute;right:2px;top:20px;font-style:normal;font-size:12px;font-weight:900;color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.tw-pfoes span.boss small{color:#ffb07a}
.modal.prep .prep-foot{min-width:0}
.modal.prep .prep-foot .btn{min-width:0!important;white-space:nowrap;writing-mode:horizontal-tb}
.modal.prep .prep-foot .prep-no{flex:0 0 88px!important;border-width:8px 14px 9px!important;padding:0!important;font-size:15px}
.modal.prep .prep-foot .ar-go{flex:1 1 0!important;border-width:8px 16px 9px!important;padding:0 4px!important;font-size:18px}
.modal.prep .prep-foot .ar-go small{font-size:10px}
.modal.prep .prep-foot .ar-go{overflow:hidden}.tw-pfoes small{font-size:9px;letter-spacing:-.04em;text-overflow:clip}
/* 2026-10-23 ユーザー：案内のキャラはぶとうかいと同じ形に（小さなキャラの頭の上に、名前なしの小さなフキダシ） */
main .guide{display:inline-flex;flex-direction:column;align-items:flex-start;min-height:0;margin:0 0 4px;max-width:100%}
main .guide .mon-img{order:2;width:84px!important;height:auto!important;margin:0 0 -2px 4px}
main .guide .guide-say{order:1;flex:none;max-width:260px;margin:0 0 6px;padding:3px 8px;box-shadow:2px 2px 0 #2a1408;border-width:2px}
main .guide .guide-say b{display:none}
main .guide .guide-say p{margin:0;font-size:11.5px;line-height:1.35}
main .guide .guide-say::before,main .guide .guide-say::after{left:28px!important;right:auto!important;top:auto!important;bottom:-9px!important;border:5px solid transparent!important;border-top:7px solid #2a1408!important;border-bottom:0!important;transform:none!important}
main .guide .guide-say::after{display:none}
/* 案内キャラの右の空きをなくす：キャラは左に浮かせ、次の物を右に並べる */
main .guide{float:left;margin:0 6px 2px 0;max-width:150px}
main .guide .guide-say{max-width:none;width:max-content;max-width:300px;position:relative;z-index:3}
main .guide+*,main .guide~.stam-bar{overflow:hidden}
main section::after,main .arena-pg::after{content:"";display:block;clear:both}
.story-top{display:block}
.story-top .guide{float:left}
.story-top>.navbtn{float:right}
.story-band{clear:both}
.dive .dv-gate{clear:both}
.dive .guide{max-width:none}
.dive .guide+.stam-bar{margin-top:46px}
.mine .guide{float:none;display:flex;flex-direction:row;align-items:flex-end;max-width:none;gap:4px}.mine .guide .mon-img{order:0;width:64px!important}.mine .guide .guide-say{order:1;margin:0 0 10px}.mine .guide .guide-say::before{left:-9px!important;bottom:8px!important;border:5px solid transparent!important;border-right:7px solid #2a1408!important;border-top-color:transparent!important}
/* 2026-10-23 ユーザー「これここの中にうまいこと収めて」：坑道の案内は上の絵の中、手持ちの帯の上の右に。キャラは右、フキダシは左 */
.mine .mn-hero .guide{position:absolute;right:4px;bottom:38px;margin:0;z-index:2}
.mine .mn-hero .guide .mon-img{order:2;width:58px!important;filter:drop-shadow(0 2px 0 #2a1f16)}
.mine .mn-hero .guide .guide-say{order:1;margin:0 4px 8px 0;max-width:190px}
.mine .mn-hero .guide .guide-say p{font-size:11.5px;line-height:1.35}
.mine .mn-hero .guide .guide-say::before{left:auto!important;right:-9px!important;bottom:8px!important;border:5px solid transparent!important;border-left:8px solid #fffaf0!important;border-right:0!important;filter:drop-shadow(1px 0 0 #2a1408)}
/* 2026-10-23 坑道：坑道の札はどちらも明るく（押すと出撃準備の窓）。窓は ar-prep/tw-prep と同じ形 */
main .mine .mn-place{filter:drop-shadow(0 3px 0 #2a1f16)}
.mn-modal .mn-phead{position:relative;height:64px;margin:0 0 6px;display:flex;align-items:flex-end;justify-content:space-between;padding:0 8px 6px;background-size:cover;background-position:center 60%;border:0;border-style:solid;border-width:5px 10px;border-image:url(art/ui/mat/lava.png) 36 100 36 100/5px 10px stretch;background-clip:padding-box}
.mn-modal .mn-phead b{font-family:var(--game-font);font-size:22px;color:#fff6df;-webkit-text-stroke:4px #1a0f08;paint-order:stroke fill}
.mn-modal .mn-phead .mn-sets{display:flex;align-items:center;gap:2px}.mn-modal .mn-phead .mn-res{margin-right:30px;font-style:normal;font-family:var(--game-font);font-size:20px;color:#fff6df;-webkit-text-stroke:4px #1a0f08;paint-order:stroke fill}.mn-modal .mn-phead .mn-sets img{width:26px;height:26px;filter:drop-shadow(0 1px 0 #1a0f08)}
.mn-modal .mn-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.mn-modal .mn-step{position:relative;min-height:0!important;height:36px;font-size:14px;padding:0!important;margin:0!important;border-width:5px 8px 6px!important;white-space:nowrap}
.mn-modal .mn-step.locked{display:flex;align-items:center;justify-content:center;font-family:var(--game-font);font-weight:900;font-size:14px;height:36px;border-width:5px 8px 6px!important;border-image-width:5px 8px 6px!important}
.mn-modal .mn-done{position:absolute;right:-6px;top:-8px;width:18px;height:18px;border-radius:50%;background:#c0392b;color:#fff6df;font-style:normal;font-size:10px;line-height:18px;text-align:center;border:2px solid #fff6df;transform:rotate(-12deg);-webkit-text-stroke:0}
.mn-modal .mn-info{margin:6px 0 2px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 14px 5px stretch!important;border-width:5px 14px 5px!important;color:#f3e2c0}
.mn-modal .mn-info p{margin:0;font-size:12px}.mn-modal .mn-info p b{font-family:var(--game-font);font-size:16px;color:#f3e2c0}
.mn-modal .mn-odds{width:100%;border-collapse:collapse;text-align:center;font-size:13px}
.mn-modal .mn-odds th{font-size:11px;color:#ffc46a;padding:0}.mn-modal .mn-odds td{font-family:var(--game-font);font-weight:900;color:#f3e2c0;border-top:2px solid #8a6a3a;padding:1px}
.mn-modal .mn-odds td.none{color:#a08868;font-weight:500}
.mn-modal .mn-info p{display:flex;align-items:center;gap:4px}
.mn-modal .mn-rep{margin:0 0 0 auto!important;min-height:0!important;height:28px;padding:0 6px!important;border-width:5px 10px 6px!important;font-size:11.5px;white-space:nowrap;display:flex;align-items:center}
.mn-modal .mn-rep .ico{width:18px;height:18px;margin:0 2px 0 0}
.mn-modal .mn-info{padding:1px 6px!important}
.mn-modal .prep-foot .prep-no{flex:0 0 76px!important}
/* 2026-10-23 ユーザー「やめるか右上のバツどっちかに統一」：やめるをなくし×だけ。挑むは横いっぱい。消費エナジーは瓶＋大きな数字の札 */
.modal.prep .prep-foot .ar-go{display:flex!important;align-items:center;justify-content:center;gap:10px;height:60px!important;font-size:21px!important}
.go-cost{display:inline-flex;align-items:center;gap:3px;padding:2px 8px 2px 4px;background:#2a1408;border:2px solid #e8b860;border-radius:4px;line-height:1;-webkit-text-stroke:0}
.go-cost img{width:28px;height:28px}
.go-cost b{font-family:var(--game-font);font-size:24px;color:#ffd76a;-webkit-text-stroke:0}
.go-cost small{display:block!important;align-self:flex-end;font-size:10px!important;color:#e8d8b8;margin:0 0 2px 2px!important;opacity:1!important}
.go-cost.short b{color:#ff8a7a}
/* 2026-10-23 ユーザー「バランス悪い。もう少し横幅も短く」：挑むボタンは真ん中に、幅を控えめに */
.modal.prep .prep-foot{justify-content:center}
.modal.prep .prep-foot .ar-go{flex:0 1 300px!important;max-width:300px!important;margin:0 auto!important}
/* 2026-10-23 ユーザー「戻るボタンの点線なに？」：窓を開くと×に自動で付くキーボード用の点線を出さない（スマホでは常に出さない） */
.modal .close:focus-visible{outline:none}
@media (hover:none){button:focus-visible{outline:none}}
/* 2026-10-23 ユーザー「ボタンには消費エナジーだけ。今のエナジーと最大は隣に」 */
.modal.prep .prep-foot{align-items:center}
.modal.prep .stam-have{flex:none;display:flex;flex-direction:column;align-items:center;line-height:1;padding:4px 6px;border:0;border-style:solid;border-width:5px 10px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 10px stretch;color:#e8d8b8;font-size:11px;font-weight:900}
.modal.prep .stam-have img{width:24px;height:24px;margin-bottom:1px}
.modal.prep .stam-have b{font-family:var(--game-font);font-size:18px;color:#ffd76a}
.modal.prep .prep-foot .stam-have+.ar-go{flex:0 1 250px!important;max-width:250px!important;margin:0!important}
.modal.prep .prep-foot .stam-have+.ar-go{flex:1 1 auto!important;max-width:260px!important;font-size:18px!important;gap:6px!important;padding:0 2px!important}
.modal.prep .prep-foot .ar-go .go-cost{padding:1px 6px 1px 2px}.modal.prep .prep-foot .ar-go .go-cost img{width:24px;height:24px}
/* 2026-10-23 ユーザー「ここ意味なさすぎる」：層の説明の板をなくし、札の「結果だけ」は仲間の見出しの右に */
.mn-modal .mn-sub{display:flex;align-items:center;gap:4px;margin:6px 0 2px}
.mn-modal .mn-boss{margin:4px 0 0;padding:3px 7px;font-size:11px;line-height:1.35;background:#efe2c4;border:1px solid #8a6a44;border-radius:4px;color:#3a2a1c}.mn-modal .mn-boss b{margin-right:4px;color:#7a2a18}.mn-modal .mn-boss span{display:block;font-weight:bold}
.mn-modal .mn-steps{margin-top:2px}
/* 2026-10-23 エナジー回復の窓。エナジーの札・帯は押せる */
.stam-have,.stam-bar{cursor:pointer}
.stam-now{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px 0 2px}
.stam-now img{width:52px;height:52px}
.stam-now b{font-family:var(--game-font);font-size:44px;color:#c0392b;-webkit-text-stroke:0}
.stam-now i{font-style:normal;font-size:18px;font-weight:900;color:#6b4a2a;align-self:flex-end;margin-bottom:8px}
.stam-time{text-align:center;font-size:13px;margin:0 0 10px}.stam-time b{color:#c0392b}
.stam-buy{display:flex;flex-direction:column;align-items:center;gap:4px}
.stam-buy .btn{display:flex!important;align-items:center;gap:4px;font-size:20px;min-width:220px;justify-content:center}
.stam-buy .btn .ico{width:26px;height:26px}
.stam-buy small{font-size:12px;color:#6b4a2a}
/* 2026-10-23 くだりの入口は押せる札（押すと出撃準備の窓）。仲間えらびが窓に移った分、絵を大きく */
.dive .dv-gate{display:block;width:100%;aspect-ratio:1/1;background-position:center 45%!important;padding:0;font:inherit;cursor:pointer;margin-top:10px}
.dive .dv-gate em{position:absolute;right:8px;bottom:8px;width:96px;height:50px;padding:22px 0 0;box-sizing:border-box;text-align:center;font-style:normal;font-family:var(--game-font);font-size:17px;color:#fff6df;-webkit-text-stroke:3px #5a1408;paint-order:stroke fill;background:url(art/ui/mine/sign.png) center/100% 100% no-repeat;transform:rotate(-3deg)}
/* 2026-10-23 ユーザー「この背景クロードっぽい」：消費エナジーの四角い枠をやめ、瓶と縁取りの数字を板の上にじかに置く */
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{background:none!important;border:0!important;border-radius:0!important;padding:0!important;gap:1px}
.go-cost img{filter:drop-shadow(0 2px 0 #3a0e06)}
.go-cost b{font-size:26px!important;color:#ffe08a!important;-webkit-text-stroke:5px #3a0e06!important;paint-order:stroke fill}
.go-cost.short b{color:#ffb0a0!important}
/* 2026-10-23 ユーザー「無しじゃなくて違うのに」：消費エナジーは和紙の小札（板に貼った紙）。数字は墨色 */
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{border:0!important;border-style:solid!important;border-width:4px 10px!important;border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/4px 10px stretch!important;padding:0 2px!important;transform:rotate(-2deg)}
.go-cost img{filter:none}
.go-cost b{color:#3a1a0a!important;-webkit-text-stroke:0!important;font-size:24px!important}
.go-cost.short b{color:#c0392b!important}
/* 2026-10-23 ユーザー「2で」：消費エナジーはボタン右端の焦げ茶の小板（左に縄の区切り・チャッピー作 art/ui/cost_plate.png）にのせる */
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{border:0!important;border-image:none!important;transform:none!important;background:url(art/ui/cost_plate.png) center/100% 100% no-repeat!important;width:84px;height:48px;box-sizing:border-box;padding:0 4px 0 20px!important;margin:0 -12px 0 auto;justify-content:center;gap:1px}
.modal.prep .prep-foot .ar-go{justify-content:space-between!important;padding-left:14px!important}
.go-cost img{width:24px!important;height:24px!important}
.go-cost b{color:#ffe08a!important;-webkit-text-stroke:4px #2a1006!important;paint-order:stroke fill;font-size:24px!important}
.go-cost.short b{color:#ff9a8a!important}
.modal.prep .prep-foot .ar-go{overflow:visible!important}
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{width:80px;height:44px;margin:0 -8px 0 auto!important;padding:0 2px 0 20px!important}
.go-cost b{font-size:22px!important}.go-cost img{width:22px!important;height:22px!important}
/* 2026-10-23 ユーザー「デカすぎ」：入口の絵は横長に戻す */
.dive .dv-gate{aspect-ratio:2.1/1!important}
.dive .dv-gate em{width:80px;height:42px;padding-top:18px;font-size:15px}
/* 2026-10-23 ユーザー「題をボタンの中に。もうちょい大きく。ボタンの中の文字ももっと存在感」 */
.dive .dv-gate strong{position:absolute;left:10px;top:6px;font-family:var(--game-font);font-size:30px;line-height:1;color:#fff6df;-webkit-text-stroke:7px #2a1408;paint-order:stroke fill;letter-spacing:.02em}
.dive .dv-gate span{font-size:15px!important;bottom:54px!important;left:12px!important;-webkit-text-stroke:4px #2a1408!important}
.dive .dv-gate b{font-size:56px!important;-webkit-text-stroke:8px #2a1408!important;bottom:0!important;left:10px!important}
.dive .dv-gate b small{font-size:22px!important;-webkit-text-stroke:5px #2a1408!important}
.dive .dv-gate em{width:104px!important;height:54px!important;padding-top:23px!important;font-size:20px!important}
.dive .guide+.stam-bar{margin-top:44px!important}
.dive>.pg-back{top:0!important}
section.dive{display:flow-root}
/* 2026-10-23 ユーザー「配置がしっくりこない。のぼりもだけど」：塔・くだり共通の見出し。左にキャラ（2段ぶん）、右上にフキダシ（左向きのしっぽ）ともどる、右下にエナジーと記録 */
.ev-head{position:relative;display:grid!important;grid-template-columns:72px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:6px;row-gap:4px;align-items:center;margin:0 0 8px}
.ev-head .tw-guide{grid-row:1/3;grid-column:1;width:72px!important;align-self:end;filter:drop-shadow(0 2px 0 #2a1f1699)}
.ev-head .tw-say{grid-row:1;grid-column:2;justify-self:start;position:relative;max-width:100%;margin:0 0 0 6px!important;padding:3px 8px;font-size:11.5px;line-height:1.35;color:#2a1408;background:#fffaf0;border:2px solid #2a1408;box-shadow:2px 2px 0 #2a1408}
.ev-head .tw-say::before{content:"";position:absolute;left:-9px!important;top:auto;bottom:8px!important;border:5px solid transparent!important;border-right:7px solid #2a1408!important;border-left:0!important}
.ev-head .tw-back{grid-row:1;grid-column:3;position:static!important;align-self:start;margin:0!important}
.ev-head .tw-info{grid-row:2;grid-column:2/4;display:flex;align-items:center;gap:6px;min-width:0}
.ev-head .stam-bar{flex:1 1 auto;min-width:0;margin:0!important;padding:3px 8px!important;gap:6px;border-width:2px}
.ev-head .stam-bar>b{display:none}
.ev-head .stam-bar .stam-ico{width:22px;height:22px}
.ev-head .stam-bar em{font-size:17px;white-space:nowrap}
.ev-head .dv-stat{display:flex;gap:4px;margin:0!important;flex:none}
.ev-head .dv-stat span{margin:0!important;padding:1px 8px!important;font-size:11px;white-space:nowrap}
.ev-head .dv-stat b{font-size:16px}
.ev-head .dv-stat span{border-width:4px 10px!important}
.tower .ev-head .stam-gauge{display:none}
.tower .ev-head .stam-bar{flex:none}
.tower .ev-head .dv-stat{flex:1 1 auto;justify-content:space-between;min-width:0}
.tower .ev-head .dv-stat span{flex:1 1 0;text-align:center;padding:1px 2px!important}
.tower .ev-head .dv-stat span{white-space:nowrap!important;border-width:4px 8px!important;font-size:10.5px!important;letter-spacing:-.02em}
.tower .ev-head .dv-stat b{font-size:15px!important}
.tower .ev-head .dv-stat span{border:2px solid #c8442b!important;border-image:none!important;background:#2a1f16!important;color:#e8d8b8!important;box-shadow:0 3px 0 #1d1510;padding:4px 4px!important;font-size:11px!important}
.tower .ev-head .dv-stat b{color:#fff6df!important;font-size:17px!important}
.tower .ev-head .dv-stat span{display:flex!important;flex-wrap:nowrap!important;align-items:baseline;justify-content:center;gap:2px;padding:4px 2px!important}
/* 2026-10-23 ユーザー「そのクロードっぽい（黒地に赤枠の四角）を変えて」：エナジーの帯と塔の記録は鉄の札（art/ui/mat/iron.png） */
.stam-bar,.tower .ev-head .dv-stat span{background:none!important;box-shadow:none!important;border:0!important;border-style:solid!important;border-width:5px 14px!important;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 14px stretch!important;filter:drop-shadow(0 2px 0 #1d1510)}
.ev-head .stam-bar{padding:2px 2px!important}
.tower .ev-head .dv-stat span{padding:3px 0!important;border-width:5px 10px!important;border-image-width:5px 10px!important}
/* 2026-10-23 ユーザー「太い幹の途中でステージになってるみたいな絵に」：太い幹（trunk4）＋幹から張り出した足場（ledge / ledge_boss、チャッピー作）。足場の左端は樹皮なので幹に重ねて貼る */
.tw-tree{--tk:176px;--bw:136px;--bh:129px;--sy:.36;--sx:.6;--ov:44px;
 background:url(art/ui/tower/trunk4.jpg) center top/var(--tk) auto repeat-y,url(art/ui/tower/bg2.jpg) center top/100% auto repeat-y!important}
.tw-tree li.boss{--bw:150px;--bh:124px;--sy:.36;--sx:.6;--fh:96px}
.tw-tree .tw-br{background-image:url(art/ui/tower/ledge.png)!important;background-size:100% 100%}
.tw-tree li.boss .tw-br{background-image:url(art/ui/tower/ledge_boss.png)!important}
.tw-tree li.r .tw-br{left:calc(50% + var(--tk)/2 - var(--ov))!important}
.tw-tree li.l .tw-br{right:calc(50% + var(--tk)/2 - var(--ov))!important}
.tw-tree li.r .tw-foe{left:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*var(--sx))!important}
.tw-tree li.l .tw-foe{right:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*var(--sx))!important}
.tw-tree .tw-tag{top:calc(var(--top) + var(--bh)*.72)!important}
.tw-tree li.r .tw-tag{left:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*.2)!important}
.tw-tree li.l .tw-tag{right:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*.2)!important}
.tw-tree li.r .tw-st.clear{left:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*var(--sx))!important}
.tw-tree li.l .tw-st.clear{right:calc(50% + var(--tk)/2 - var(--ov) + var(--bw)*var(--sx))!important}
.tw-tree .tw-br{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 34%);mask-image:linear-gradient(to right,transparent 0,#000 34%)}
.tw-tree .tw-tag{top:calc(var(--top) + var(--bh)*.8)!important;height:30px!important;width:auto!important;min-width:84px;padding:0 6px;box-sizing:border-box;border:0;border-style:solid;border-width:5px 14px 6px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/5px 14px 6px stretch;filter:drop-shadow(0 2px 0 #2a1408);z-index:2}
.tw-tree li.boss .tw-tag{height:44px!important;border-image-source:url(art/ui/btn_red.png)}
.tw-tree li.boss.r .tw-tag{left:auto!important;right:2px!important}
.tw-tree li.boss.l .tw-tag{right:auto!important;left:2px!important}
.tw-tree li.boss .tw-tag{padding:0 2px!important;border-width:5px 10px 6px!important}
.tower .ev-head .dv-stat{flex-wrap:nowrap!important;flex-direction:row!important}
.tower .ev-head .dv-stat span{min-width:0;border-width:5px 8px!important;border-image-width:5px 8px!important}
.tower .ev-head .stam-bar{border-width:5px 10px!important;border-image-width:5px 10px!important}
/* 2026-10-23 ユーザー「もっとステージ大きく。幹の中心くらいからステージの端が始まってる感じ」：階は等間隔（--P）。足場は幹の真ん中から外へ大きく張り出す */
.tower .tw-tree{--P:150px;--bw:200px;--bt:30px;--in:.2}
.tower .tw-tree li{height:var(--P)!important;margin-top:0!important;--bh:calc(var(--bw)*.95);--fh:90px}
.tower .tw-tree li.boss{--bh:calc(var(--bw)*.83);--fh:104px}
.tower .tw-tree li .tw-br{top:var(--bt)!important;width:var(--bw)!important;height:var(--bh)!important}
.tower .tw-tree li.r .tw-br{left:calc(50% - var(--bw)*var(--in))!important;right:auto!important}
.tower .tw-tree li.l .tw-br{right:calc(50% - var(--bw)*var(--in))!important;left:auto!important}
.tower .tw-tree li .tw-foe{top:calc(var(--bt) + var(--bh)*.36 - var(--fh))!important;bottom:auto!important;height:var(--fh)!important;max-width:120px!important}
.tower .tw-tree li.r .tw-foe{left:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;right:auto!important;transform:translateX(-50%)!important}
.tower .tw-tree li.l .tw-foe{right:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;left:auto!important;transform:translateX(50%)!important}
.tower .tw-tree li .tw-tag{top:calc(var(--bt) + var(--bh)*.62)!important}
.tower .tw-tree li.r .tw-tag{left:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;right:auto!important;transform:translateX(-50%)!important}
.tower .tw-tree li.l .tw-tag{right:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;left:auto!important;transform:translateX(50%)!important}
.tower .tw-tree li .tw-st.clear{top:calc(var(--bt) + var(--bh)*.36 - 34px)!important}
.tower .tw-tree li.r .tw-st.clear{left:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;right:auto!important;transform:translateX(-50%)!important}
.tower .tw-tree li.l .tw-st.clear{right:calc(50% - var(--bw)*var(--in) + var(--bw)*.6)!important;left:auto!important;transform:translateX(50%)!important}
.tower .tw-tree li .tw-st.next{top:calc(var(--bt) + var(--bh)*.36 - 30px)!important}
.tower .tw-tree li.r .tw-st.next{left:calc(50% - var(--bw)*var(--in) - 70px)!important}
.tower .tw-tree li.l .tw-st.next{left:auto!important;right:calc(50% - var(--bw)*var(--in) - 70px)!important}
.tower .tw-tree li.boss.r .tw-tag,.tower .tw-tree li.boss.l .tw-tag{}
.tower .tw-tree{overflow:hidden}
/* 2026-10-23 ユーザー「ステージの大きさは5の倍数が中くらい、10の倍数が大きめ」 */
.tower .tw-tree li{--bw:168px;--fh:80px}
.tower .tw-tree li.mid{--bw:198px;--fh:92px}
.tower .tw-tree li.boss{--bw:226px;--fh:108px}
/* 幹は「根のらせん道」付き（trunk5・チャッピー作）。絵1枚＝2階分。道の右端・左端が足場の高さに来るように縦位置を合わせる */
.tower .tw-tree{--P:150px;--off:-80px;background:url(art/ui/tower/trunk5.jpg) center var(--off)/calc(var(--P)*2*500/566) calc(var(--P)*2) repeat-y,url(art/ui/tower/bg2.jpg) center top/100% auto repeat-y!important}
.tower .tw-tree{--off:-62px}
/* 2026-10-23 ユーザー「小さめと大きめの違いが少なすぎる」：小140・中190・大250 */
.tower .tw-tree li{--bw:140px;--fh:70px}
.tower .tw-tree li.mid{--bw:190px;--fh:92px}
.tower .tw-tree li.boss{--bw:250px;--fh:118px;--in:.26}
/* 2026-10-23 ユーザー「スクロールなしで表示」：4階分の高さを画面の高さから決める（1階＝--P）。足場・敵の大きさも--Pに合わせる */
.tower .tw-tree{--P:clamp(96px,calc((100svh - 222px)/4),150px);padding-bottom:0!important}
.tower .tw-tree li{--bw:calc(var(--P)*.93);--fh:calc(var(--P)*.47);--bt:calc(var(--P)*.2)}
.tower .tw-tree li.mid{--bw:calc(var(--P)*1.27);--fh:calc(var(--P)*.61)}
.tower .tw-tree li.boss{--bw:calc(var(--P)*1.67);--fh:calc(var(--P)*.79)}
.tower .tw-tree li .tw-tag{transform-origin:center top}
/* 2026-10-23 ユーザー「見せる階は2つくらいにして太く見せよう」：次の階とその上の2階だけ。1階＝画面の高さの半分。足場は横幅に対する割合で大・中・小 */
.tower .tw-tree{--P:clamp(150px,calc((100svh - 222px)/2),330px);background:url(art/ui/tower/trunk5.jpg) center var(--off)/74% auto repeat-y,url(art/ui/tower/bg2.jpg) center top/100% auto repeat-y!important;--off:-40px}
.tower .tw-tree li{--bw:min(46vw,calc(var(--P)*.9));--fh:calc(var(--bw)*.5);--bt:calc(var(--P)*.22)}
.tower .tw-tree li.mid{--bw:min(62vw,calc(var(--P)*1.2));--fh:calc(var(--bw)*.48)}
.tower .tw-tree li.boss{--bw:min(80vw,calc(var(--P)*1.55));--fh:calc(var(--bw)*.46)}
.tower .tw-tree li .tw-foe{max-width:none!important}
.tower .tw-tree li .tw-tag{font-size:15px}
.tower .tw-tree li.mid{--bw:min(56vw,calc(var(--P)*1.15));--in:.24}
.tower .tw-tree li.boss{--bw:min(68vw,calc(var(--P)*1.45));--in:.3}
/* 2026-10-23 ユーザー「何階なのか見えてない」：階の札を足場の正面（上の面のすぐ下）に大きく。下にはみ出して切れないように */
.tower .tw-tree li .tw-tag{top:calc(var(--bt) + var(--bh)*.40)!important;z-index:4!important;height:auto!important;min-height:36px;padding:2px 8px!important}
.tower .tw-tree li .tw-tag b{font-size:22px!important}
.tower .tw-tree li.boss .tw-tag b{font-size:22px!important}
/* 2026-10-23 ユーザー「ボタンに情報詰めすぎ」：階の札は階と主だけ。ごほうびは出撃準備の窓に */
.tw-prew{display:flex;align-items:center;justify-content:center;gap:6px;margin:2px 0 6px;font-size:12px;font-weight:900;color:#5a3a22}
.tw-prew .tw-rw{display:inline-flex;align-items:center;gap:2px;font-size:15px}
.tw-prew .tw-rw span{display:inline-flex;align-items:center;gap:1px;margin:0 3px}.tw-prew img{width:22px!important;height:22px!important;object-fit:contain}
/* 2026-10-23 仲間の札：評価の判子を右上、点数は藍の布札（tag_s）の上に白い数字 */
.sb-cand{position:relative}
.sb-cand .sb-seal{position:absolute;top:2px;right:2px;width:30px;height:31px;transform:rotate(8deg);filter:drop-shadow(0 1px 0 #2a1408);z-index:2}
.sb-cand small{display:flex!important;justify-content:center;align-items:center;gap:4px}
.sb-cand .sb-sc{display:inline-block;min-width:58px;padding:1px 14px 1px 16px;font-style:normal;font-family:var(--game-font);font-size:15px;line-height:1.3;color:#fff6df;-webkit-text-stroke:3px #1a1030;paint-order:stroke fill;background:url(art/ui/fin/tag_s.png) center/100% 100% no-repeat}
/* 消費エナジー：縄の小板をやめ、文字のすぐ右に朱塗りの小さな札で控えめに */
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{background:none!important;width:auto!important;height:auto!important;margin:0 0 0 2px!important;padding:0 6px 0 2px!important;border:0!important;border-style:solid!important;border-width:3px 8px!important;border-image:url(art/ui/mat/lacquer.png) 30 60 30 60 fill/3px 8px stretch!important;transform:none!important}
.modal.prep .prep-foot .ar-go{justify-content:center!important;padding-left:4px!important}
.go-cost img{width:20px!important;height:20px!important}
.go-cost b{font-size:19px!important}
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{position:relative;border:0!important;border-image:none!important;padding:2px 8px 2px 4px!important;isolation:isolate}
.go-cost::before{content:'';position:absolute;inset:0;z-index:-1;border-style:solid;border-width:4px 10px 5px;border-image:url(art/ui/btn_red.png) 50 120 56 fill/4px 10px 5px stretch;filter:brightness(.55) saturate(.8)}
.sb-cand .sb-seal{width:26px;height:27px;top:-3px;right:-3px}
/* 2026-10-23 ユーザー「しめ縄と紙邪魔かも」：仲間の札は縄なしの石（stele_plain） */
button.sb-cand:not(.on){border-image:url(art/ui/mat/stele_plain.png) 32 34 30 34 fill/7px 8px 6px stretch!important;border-width:7px 8px 6px!important}
.sb-cand .sb-seal{width:30px!important;height:30px!important;object-fit:contain;transform:none!important;top:-4px!important;right:-4px!important}
/* 2026-10-23 ユーザー「もうちょい大きく」 */
.go-cost img{width:28px!important;height:28px!important}
.go-cost b{font-size:26px!important}
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{padding:2px 10px 2px 4px!important}
.modal.prep .prep-foot .stam-have+.ar-go{font-size:17px!important;gap:4px!important;padding:0!important}.modal.prep .stam-have{padding:4px 2px!important}
/* 2026-10-23 ユーザー「評価ランクの文字見づらい」：印を大きく（飾りが多いぶん40px）、角から少し外に */
.sb-cand .sb-seal{width:40px!important;height:40px!important;top:-9px!important;right:-9px!important;filter:drop-shadow(0 2px 0 #1a0f08) contrast(1.15)}
.modal .sb-cand .sb-seal{width:34px!important;height:34px!important;top:-6px!important;right:-6px!important}
/* 2026-10-23 ユーザー「キャラ絵の割合が小さい」：絵を札の幅いっぱいに大きく、名前は絵の下の方に重ねる（縁取りの字） */
.sb-cand>img:not(.sb-seal){width:100%!important;height:80px!important;max-width:none!important;object-fit:contain;margin:-4px 0 -18px!important;position:relative;z-index:0}
.sb-cand>b{position:relative;z-index:1;font-size:12px!important;color:#fff6df!important;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill;line-height:1.1}
.sb-cand>small{position:relative;z-index:1;margin-top:1px}
.sb-cand>small{position:static!important}.sb-cand .sb-sc{position:relative;z-index:1}.sb-cand .sb-seal{z-index:3!important}
/* 2026-10-23 ユーザー「評価点は枠の下段ぴったりでもいい」：点数の布札を札の下の縁いっぱいに */
button.sb-cand{padding-bottom:0!important}
.sb-cand>small{width:calc(100% + 12px);margin:1px -6px -6px!important;align-self:center}
.sb-cand .sb-sc{display:block;width:100%;box-sizing:border-box;text-align:center;padding:2px 0!important;background-size:100% 100%!important;font-size:16px!important}
/* 2026-10-23 ユーザー「選択した時としてない時でボタンの大きさが変わるのが問題」：枠の太さを同じにそろえる */
button.sb-cand,button.sb-cand.on{border-width:7px 8px 6px!important;border-image-width:7px 8px 6px!important;transform:none!important}
/* 2026-10-23 ユーザー「スクロールなしで表示」：勝ち負けの一言は幹の上に重ねて、数秒で消す（場所を取らない） */
section.tower{position:relative}
section.tower>.tw-result{position:absolute;left:50%;top:110px;z-index:8;transform:translateX(-50%);width:max-content;max-width:90%;margin:0;pointer-events:none;animation:twToast 4s ease forwards}
@keyframes twToast{0%{opacity:0;transform:translate(-50%,-8px)}8%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;visibility:hidden}}
/* 2026-10-23 ユーザー「イベントタイトルは必ず入れる。他のイベントも」：縁取りの題字。場所を取らないよう絵の上に重ねる */
.ev-ttl{margin:0;font-family:var(--game-font);font-size:22px;line-height:1;color:#fff6df;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill;letter-spacing:.02em;white-space:nowrap;pointer-events:none}
.tower .tw-body{position:relative}
.tower .tw-body>.ev-ttl{position:absolute;left:10px;top:8px;z-index:6;font-size:26px}
.raid-pg{position:relative}
.raid-pg>.ev-ttl{position:absolute;right:6px;top:-38px;z-index:6}
.ar-tops .ev-ttl{font-size:18px;-webkit-text-stroke:5px #2a1408;margin-right:auto;align-self:center}
.cs-stage{position:relative}
.cs-stage>.ev-ttl{position:absolute;left:10px;top:10px;z-index:6}
/* 塔の記録は「現在○階、のこり○日」を1枚の札に */
.tower .ev-head .dv-stat.tw-now span{flex:1 1 auto;gap:3px!important}
.tower .ev-head .dv-stat.tw-now i{width:10px;display:inline-block}
.cs-stage>.ev-ttl{top:30px;left:18px}.ar-next b{color:#ffd76a}
main .arena-pg .ar-rank>div:first-child .ev-ttl{font-size:16px;-webkit-text-stroke:4px #2a1408;margin-right:6px}
main .arena-pg .ar-head .ar-next b{display:inline!important;font-size:inherit!important;line-height:inherit!important;font-family:inherit!important;-webkit-text-stroke:0!important}
main .arena-pg .ar-head .ar-next{white-space:nowrap;letter-spacing:-.03em}
/* 題字は一番上の真ん中に扁額（title_plate） */
.ev-top{display:flex;justify-content:center;margin:0 0 4px;position:relative;z-index:4}
.ev-top .ev-ttl{position:static!important;display:flex;align-items:center;justify-content:center;min-width:min(250px,64vw);height:46px;padding:0 34px 2px;box-sizing:border-box;background:url(art/ui/title_plate.png) center/100% 100% no-repeat;font-size:20px!important;-webkit-text-stroke:5px #1a0f08!important;color:#fff3cf}
/* ぶとうかいのポイント板は落ち着いた黒漆（board_dark） */
main .arena-pg .ar-rank{border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/10px 18px 10px stretch!important}
.tower .tw-tree{--P:clamp(140px,calc((100svh - 272px)/2),330px)}
.raid-pg>.ev-top{margin-top:-46px;pointer-events:none}
.raid-pg>.ev-top{justify-content:flex-end;padding-right:4px}.raid-pg>.ev-top .ev-ttl{min-width:0}
/* 2026-10-23 ユーザー：ぶとうかいは題字を左寄せ、遊び方・もどるも同じ一番上の段に */
section.ar-pg{position:relative}
section.ar-pg>.ev-top{justify-content:flex-start}
section.ar-pg>.ar-tops{position:absolute;top:6px;right:0;z-index:5;display:flex;gap:4px}
section.ar-pg>.ar-tops .navbtn{position:static;font-size:12px;padding:2px 6px;min-height:0}
/* 題字の段が増えた分、相手のカードを縮める */
@media (min-height:800px){main .arena-pg button.ar-opp:not(.ar-refresh-card){height:calc((100dvh - 466px)/5)!important;min-height:56px}}
@media (min-height:700px) and (max-height:799px){main .arena-pg button.ar-opp:not(.ar-refresh-card){height:calc((100dvh - 452px)/5)!important;min-height:50px}}
@media (max-height:699px){main .arena-pg button.ar-opp{height:82px!important;min-height:0!important;overflow:hidden}}
/* 札が低くても字が切れないよう、ランクとポイント・「勝てば」と数を横並びに（3行） */
main .arena-pg button.ar-opp .ar-who{display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:baseline;column-gap:4px;row-gap:0}
main .arena-pg button.ar-opp .ar-who b{flex-basis:100%}
main .arena-pg button.ar-opp .ar-gain{display:flex!important;flex-direction:row!important;align-items:baseline;gap:2px}
/* 2026-10-23 ユーザー「キャラが切れちゃってる」：相手のキャラは札の高さに収まる大きさで、足元そろえ */
main .arena-pg button.ar-opp .ar-team{top:3px!important;bottom:3px!important;display:flex!important;align-items:flex-end;justify-content:flex-end;gap:0;margin:0!important}
main .arena-pg button.ar-opp .ar-team img{height:100%!important;width:auto!important;max-width:36%!important;max-height:none!important;object-fit:contain;object-position:center bottom;margin:0 -3px!important}
main .arena-pg button.ar-opp .ar-team img{max-width:42%!important;margin:0 -7px!important}
/* 2026-10-23 ユーザー「無駄なスペースあるのに右にギチギチ」：キャラは空いている幅いっぱいに均等に並べる */
main .arena-pg button.ar-opp .ar-team{justify-content:space-around!important}
main .arena-pg button.ar-opp .ar-team img{flex:1 1 0;min-width:0;max-width:none!important;margin:0!important}
@media (max-height:799px),(min-width:420px){main .arena-pg .ar-opps:not(:has(> :nth-child(1):last-child)) button.ar-opp .ar-team{left:38%!important;right:2px!important}}
/* 2026-10-23 ぶとうかい「報酬」：順位の札（金・銀・銅・黒漆）と、ほうびの絵 */
.pz-head{display:flex;align-items:baseline;gap:6px;margin:6px 2px 3px}
.pz-head b{font-family:var(--game-font);font-size:15px;color:#3a1a0a}
.pz-head small{font-size:10.5px;color:#7a5a3a}
.pz-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.pz-tier{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:58px;padding:2px;border:0;border-style:solid;border-width:7px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/7px 12px stretch;color:#f3e2c0}
.pz-tier strong{font-family:var(--game-font);font-size:16px;line-height:1;color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill;white-space:nowrap}
.pz-tier.t0{border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill;border-width:8px 16px 9px;filter:drop-shadow(0 0 6px #ffcf5a)}
.pz-tier.t0 strong{font-size:22px}
.pz-tier.t1{border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill;border-width:8px 16px 9px;filter:grayscale(1) brightness(1.15)}
.pz-tier.t2{border-image-source:url(art/ui/btn_gold.png);border-image-slice:50 120 56 fill;border-width:8px 16px 9px;filter:sepia(.6) hue-rotate(-18deg) saturate(1.4) brightness(.85)}
.pz-tier.t1 strong,.pz-tier.t2 strong{font-size:19px}
.pz-tier.me{outline:3px solid #7ad04a;outline-offset:1px}
.pz-tier em{position:absolute;top:-10px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10px;font-weight:900;color:#fff;background:#2f7a2a;border:2px solid #fff6df;padding:0 6px;border-radius:2px;white-space:nowrap;z-index:2}
.pz-i{display:inline-flex;align-items:center;gap:2px}
.pz-i img{width:22px;height:22px;object-fit:contain}
.pz-i b{font-family:var(--game-font);font-size:16px;color:#ffd76a;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.pz-row{display:flex;justify-content:space-around;align-items:center;padding:6px 8px;border:0;border-style:solid;border-width:7px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/7px 12px stretch}
.pz-row .pz-i img{width:28px;height:28px}.pz-row .pz-i b{font-size:19px}
/* 国あて：国の札は4枚を横1列に */
section.ar-pg .ar-ctrys{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}
section.ar-pg .ar-ctry-btn{min-height:0!important;aspect-ratio:auto!important;background-size:cover!important;background-position:center!important}
section.ar-pg .ar-ctry-btn b{font-size:14px!important;white-space:nowrap}
section.ar-pg .sb-cands{padding:4px 2px}
.pz-head{margin:3px 2px 2px}
.pz-tier{min-height:48px}
.pz-tiers{gap:6px 5px}
.pz-row{padding:2px 8px}
.pz-two{display:grid;grid-template-columns:3fr 1fr;gap:5px}
.pz-row .pz-i img{width:24px;height:24px}.pz-row .pz-i b{font-size:16px}
/* 2026-10-23 レイド：挑むは窓へ。討伐済みは判子の形で（ボタンに長い字を入れない） */
.raid-pg>.ev-top{justify-content:center!important;padding-right:0!important}
.raid-pg{position:relative}
.raid-pg>.rd-howto{position:absolute;right:0;top:-40px;z-index:6;font-size:12px;padding:2px 6px;min-height:0}
.rd-go-row{display:flex;gap:6px;margin-top:6px}
.rd-go-row .btn{flex:1 1 0;margin:0!important;height:54px}
.rd-go-row .btn.primary{flex:2 1 0;font-size:19px}
.rd-tries{text-align:center;margin:3px 0 0;font-size:12px;color:#5a3a22}.rd-tries b{font-size:16px;color:#c0392b}
.rd-down{display:flex;flex-direction:column;align-items:center;margin:8px auto 0;padding:6px 18px;width:max-content;border:3px double #b02a1a;color:#b02a1a;transform:rotate(-4deg);background:#fff3e0cc}
.rd-down b{font-family:var(--game-font);font-size:24px;letter-spacing:.1em}.rd-down small{font-size:11px;font-weight:900}
.pz-pair{display:flex;gap:4px}.pz-pair .pz-i img{width:18px;height:18px}.pz-pair .pz-i b{font-size:13px}
/* レイドの上：題字の段の右に遊び方。案内キャラと大主の札は横並びで低く */
.raid-pg>.ev-top{position:relative}
.raid-pg>.ev-top .rd-howto{position:absolute;right:0;top:50%;transform:translateY(-50%);pointer-events:auto;font-size:12px;padding:2px 6px;min-height:0}
.raid-pg .rd-top{display:flex;gap:6px;align-items:stretch}
.raid-pg .rd-top>.guide{float:none!important;flex:0 0 96px;max-width:96px!important;margin:0!important}
.raid-pg .rd-top>.rd-boss{flex:1 1 auto;min-width:0;margin:0!important;display:flex;align-items:center;gap:4px}
.raid-pg .rd-top>.rd-boss img{width:78px;height:78px;object-fit:contain;flex:none}
.raid-pg .rd-top>.rd-boss>div{min-width:0}
.raid-pg .rd-top>.rd-boss b{display:block;font-size:16px;writing-mode:horizontal-tb!important;white-space:nowrap}
.raid-pg .rd-top>.rd-boss small{display:block;font-size:10.5px;line-height:1.3}
.pz-tier em{top:-9px;left:auto;right:-4px;transform:rotate(6deg)}
.raid-pg .rd-top{max-height:none}
.raid-pg .rd-top>.rd-boss img{width:64px;height:64px}
.raid-pg .rd-top>.guide .mon-img{width:64px!important}
.raid-pg .rd-top{min-height:0!important;height:auto!important}
.raid-pg .rd-top>.rd-boss{padding:4px 6px!important}
.raid-pg .ar-rank{margin:4px 0!important}
.raid-pg .ar-rank b{font-size:30px!important}
.raid-pg .pz-head{margin:2px 2px 1px}.raid-pg .pz-tiers{gap:4px}
/* 2026-10-23 ユーザー「名前が見づらいから薄めの背景」：仲間の札の名前の下に、うすい墨の帯 */
.sb-cand>b{background:linear-gradient(90deg,transparent,#1a0f08a6 18%,#1a0f08a6 82%,transparent);padding:0 10px;margin:0 -4px;align-self:stretch;text-align:center;border-radius:0}
/* 2026-10-23 ユーザー「背景に重ねる背景は弱めに」：消費エナジー・残り回数は、うすい墨の下地だけ */
.go-cost::before{display:none!important}
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{background:#1a0f0855!important;border-radius:6px!important;padding:1px 7px 1px 4px!important;gap:2px!important;align-items:center}
.go-cost small{display:inline!important;font-size:11px!important;color:#fff3cf!important;-webkit-text-stroke:3px #2a1006;paint-order:stroke fill;margin:0!important;align-self:flex-end;padding-bottom:3px}
/* 2026-10-23 ユーザー「名前と点数の帯を隙間なくくっつけて」 */
.sb-cand>small{margin-top:0!important;padding-top:0!important}
.sb-cand>b{margin-bottom:0!important;padding-bottom:0!important;line-height:1.15!important}
/* 2026-10-23 ユーザー「この形の四角形がクロードっぽい」：角丸の四角をやめ、ふちのない、ぼかした墨の影だけ */
.go-cost,.modal.prep .prep-foot .ar-go .go-cost{background:radial-gradient(ellipse 60% 55% at 50% 55%,#1a0f0880,#1a0f0840 55%,transparent 75%)!important;border-radius:0!important;padding:2px 10px 2px 6px!important}
/* 2026-10-23 ユーザー「この隙間」：布札の絵の上下にあった透明な余白を切った絵（tag_s_tight）に。名前の帯と布が直接くっつく */
.sb-cand .sb-sc{background-image:url(art/ui/fin/tag_s_tight.png)!important;padding:1px 0!important;line-height:1.2}
/* 2026-10-23 ユーザー「ここが分厚いの無駄。調整してキャラ絵の枠を大きく、キャラと名前が被らないように」 */
.modal.prep>.band{margin:0 30px 4px 0!important;padding-top:0!important;padding-bottom:0!important;display:flex;align-items:center;gap:6px}
.modal.prep>.band .tw-prew{margin:0 0 0 auto;font-size:11px}
.modal.prep>.band .tw-prew .tw-rw span{margin:0 2px}
.modal.prep>.band .tw-prew img{width:18px!important;height:18px!important}
.modal.prep>.band .tw-prew .tw-rw{font-size:13px}
.modal.prep .tw-sub{float:left;margin:0 6px 0 0!important;font-size:12px;line-height:20px}
.modal.prep .lead-note{margin:0 0 4px!important;min-height:20px;line-height:20px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.modal.prep .prep-scroll{clear:both}
/* キャラ絵は大きく、名前は絵の下（重ねない） */
.modal.prep .sb-cand>img:not(.sb-seal){height:76px!important;margin:-2px 0 0!important}
.modal.prep .sb-cand>b{margin-top:0!important}
.modal.prep>.band{white-space:nowrap;font-size:17px!important}.modal.prep>.band .tw-prew{flex:none}
.modal.prep>.band{margin-right:38px!important;padding-left:24px!important;font-size:16px!important;min-width:0}.modal.prep>.band .tw-prew .tw-rw{font-size:12px;gap:0}.modal.prep>.band .tw-prew .tw-rw span{margin:0 1px}.modal.prep>.band .tw-prew img{width:16px!important;height:16px!important}
.modal.prep>.band .tw-prew small{font-size:10.5px;color:#7a5a3a;margin-right:3px}
.sb-cand>b{padding:0 2px!important;margin:0!important;font-size:12px!important;letter-spacing:-.03em;overflow:visible!important;text-overflow:clip!important}
.modal.prep>.band .tw-prew{margin-left:10px!important}
/* 2026-10-23 ユーザー「スクロール出てる・敵の表示が無駄なスペース」：相手の札を低く1行に（名前・ランク・点の右にキャラ） */
.modal.prep .ar-vs{height:44px!important;margin:0 0 4px!important;padding:0 4px!important;border-width:4px 12px!important;border-image-width:4px 12px!important}
.modal.prep .ar-vs .ar-who{flex-direction:row!important;align-items:baseline;gap:6px;white-space:nowrap}
.modal.prep .ar-vs .ar-who b{font-size:16px!important}
.modal.prep .ar-vs .ar-who small{font-size:11px!important}
.modal.prep .ar-vs .ar-team{margin:-10px -6px -4px 0!important}
.modal.prep .ar-vs .ar-team img{width:52px!important;height:52px!important;margin:0 -4px!important}
.modal.prep .ar-vs-top{margin:0 36px 4px 0!important}
section.modal.prep .ar-vs.ar-vs-top{margin-right:40px!important;width:auto!important}
section.modal.prep .ar-vs .ar-team{margin-right:0!important;overflow:visible}section.modal.prep .ar-vs .ar-team img{width:46px!important;height:50px!important;margin:0 -5px!important}
/* 板の上に空きがあった：高さを詰めて、字とキャラを板の上下の真ん中に */
section.modal.prep .ar-vs.ar-vs-top{height:38px!important;align-items:center!important;padding:0 4px!important;overflow:hidden}
section.modal.prep .ar-vs .ar-who{align-self:center!important;margin:0!important;position:static!important}
section.modal.prep .ar-vs .ar-team{align-self:stretch!important;align-items:center!important;margin:0!important;height:100%}
section.modal.prep .ar-vs .ar-team img{height:100%!important;width:auto!important;margin:0 -3px!important;transform:scale(1.25);transform-origin:center}
/* 2026-10-23 ユーザー（何度も）「無駄なスペース・右にギチギチ」：相手のキャラは名前の右の空き全部に大きく均等に並べ、板の上にはみ出してよい */
section.modal.prep .ar-vs.ar-vs-top{overflow:visible!important}
section.modal.prep .ar-vs .ar-team{flex:1 1 auto!important;display:flex!important;justify-content:space-around!important;align-items:flex-end!important;height:100%!important;margin:0 0 0 8px!important}
section.modal.prep .ar-vs .ar-team img{height:58px!important;width:auto!important;max-width:none!important;margin:-22px 0 -2px!important;transform:none!important;object-fit:contain;object-position:center bottom}
section.modal.prep .ar-vs.ar-vs-top{height:56px!important;overflow:hidden!important}
section.modal.prep .ar-vs .ar-team{min-width:0;align-items:stretch!important}
section.modal.prep .ar-vs .ar-team img{flex:1 1 0;min-width:0;height:100%!important;width:100%!important;margin:0!important;transform:scale(1.3)!important;transform-origin:center 70%}
@media (max-width:440px){section.modal.prep .ar-vs .ar-who{flex-direction:column!important;align-items:flex-start!important;gap:0!important;line-height:1.1}}
section.modal.prep .ar-vs .ar-team img{transform:scale(1.45)!important;transform-origin:center 75%!important}
/* 2026-10-23 ユーザー「バツボタン切れてる。全部かも」：窓の中で切れないよう、×は内側の角に */
.modal>.close,.modal.prep .close{top:2px!important;right:2px!important}
/* 2026-10-23 ユーザー「敵のキャラが切れてる。はみ出していいから切れないように」 */
section.modal.prep .ar-vs.ar-vs-top{overflow:visible!important}
section.modal.prep .ar-vs .ar-team img{transform:scale(1.35)!important;transform-origin:center bottom!important}
/* 2026-10-23 ユーザー「配置下手すぎる。全部で2段に」：1段目＝題字（真ん中）＋もどる（右）、2段目＝キャラ・フキダシ・エナジー・記録を横1列 */
section.tower,section.dive{position:relative}
section.tower .ev-head .tw-back,section.dive .ev-head .tw-back{position:absolute!important;top:8px!important;right:0!important;z-index:6}
section.tower .ev-head,section.dive .ev-head{grid-template-columns:44px minmax(0,1fr) auto!important;grid-template-rows:auto!important;align-items:center!important;column-gap:4px!important;margin-bottom:6px!important}
section.tower .ev-head .tw-guide,section.dive .ev-head .tw-guide{grid-row:1!important;grid-column:1!important;width:44px!important}
section.tower .ev-head .tw-say,section.dive .ev-head .tw-say{grid-row:1!important;grid-column:2!important;font-size:10.5px!important;line-height:1.25!important;padding:2px 6px!important;margin:0 0 0 6px!important;justify-self:stretch}
section.tower .ev-head .tw-info,section.dive .ev-head .tw-info{grid-row:1!important;grid-column:3!important;display:flex!important;gap:3px!important}
section.tower .ev-head .stam-bar{padding:2px 0!important}
section.tower .ev-head .stam-bar em{font-size:15px!important}
section.tower .ev-head .dv-stat.tw-now span{flex-direction:column!important;align-items:center!important;gap:0!important;line-height:1.1;padding:2px 4px!important;font-size:10px!important}
section.tower .ev-head .dv-stat.tw-now span i{display:none}
section.tower .ev-head .dv-stat.tw-now b{font-size:14px!important}
section.dive .ev-head .tw-info{min-width:120px}
section.tower .ev-head,section.dive .ev-head{position:static!important}section.tower .ev-head .tw-back,section.dive .ev-head .tw-back{top:10px!important}
section.tower .ev-head .dv-stat.tw-now em{font-style:normal;white-space:nowrap;display:block;line-height:1.15}section.tower .ev-head .dv-stat.tw-now span{padding:2px 6px!important}
.tower .tw-tree{--P:clamp(150px,calc((100svh - 236px)/2),330px)}
/* 2026-10-23 ユーザー「でっかい矢印にして。読みづらい」：チャッピー作の左向きの矢印（art/ui/tower/arrow.png）。右の足場のときは左右反転 */
.tower .tw-tree li .tw-st.next{width:150px!important;height:52px!important;padding:6px 0 0 26px!important;box-sizing:border-box;background:url(art/ui/tower/arrow.png) center/100% 100% no-repeat!important;border:0!important;box-shadow:none!important;font-size:17px!important;line-height:46px!important;text-align:center;color:#fff6df!important;-webkit-text-stroke:4px #5a1408;paint-order:stroke fill;animation:none!important;transform:none!important}
.tower .tw-tree li .tw-st.next::after{display:none!important}
.tower .tw-tree li.r .tw-st.next{left:calc(50% - var(--bw)*var(--in) - 140px)!important;right:auto!important;transform:scaleX(-1)!important}
.tower .tw-tree li.r .tw-st.next{padding:6px 26px 0 0!important}
.tower .tw-tree li.r .tw-st.next{transform:none!important;background-image:url(art/ui/tower/arrow_r.png)!important;left:auto!important;right:calc(50% - var(--bw)*var(--in) - 140px)!important}
/* 2026-10-23 遊び方（塔・くだり・坑道）：題字の段の左 */
section.tower>.ev-howto,section.dive>.ev-howto,section.mine>.ev-howto{position:absolute;left:0;top:10px;z-index:6;font-size:12px;padding:2px 6px;min-height:0}
/* 矢印の字を板の真ん中に */
.tower .tw-tree li .tw-st.next{padding:9px 0 0 20px!important;line-height:44px!important}
/* 2026-10-23 ユーザー「イベタイトルはぶとうかいと同じ左寄せで」：題字は左、遊び方・もどるは右 */
.ev-top{justify-content:flex-start!important}
section.tower>.ev-howto,section.dive>.ev-howto,section.mine>.ev-howto{left:auto!important;right:74px!important}
section.mine>.ev-howto{top:2px!important}
/* レイドも題字は左、遊び方・もどるは右（ぶとうかいと同じ） */
body:has(.raid-pg) .back-float{display:none!important}
.raid-pg>.ev-top{justify-content:flex-start!important;position:relative}
.raid-pg .rd-tops{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;gap:4px;pointer-events:auto}
.raid-pg .rd-tops .navbtn{position:static;font-size:12px;padding:2px 6px;min-height:0}
.raid-pg>.ev-top{margin-top:0!important}
/* 2026-10-23 ホームのミッションの帯：イベントの札と同じ作り（絵＋黒い額＋縁取りの字） */
.ms-strip.msb{display:block;position:relative;height:74px;padding:0;margin:8px 0;border:3px solid #2a1f16;border-image:none;background:#2a1f16;box-shadow:0 4px 0 #2a1f16,inset 0 0 0 2px #f2c66a;filter:none;overflow:hidden;animation:none}
.ms-strip.msb.ready{border-image:none;background:#2a1f16;box-shadow:0 4px 0 #2a1f16,inset 0 0 0 2px #ffe48a,0 0 12px #ffb347;animation:msbGlow 1.4s ease-in-out infinite}
@keyframes msbGlow{50%{box-shadow:0 4px 0 #2a1f16,inset 0 0 0 2px #fff2b8,0 0 20px #ffc64a}}
.msb .msb-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;z-index:-1}
.msb::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 70% 120% at 0% 100%,#1a0c06cc,#1a0c0600 75%)}
.msb{isolation:isolate;box-shadow:0 4px 0 #2a1f16}
.msb .msb-top{position:absolute;left:6px;top:4px;display:flex;align-items:center;gap:4px}
.msb .msb-ttl{height:24px;width:auto;filter:drop-shadow(0 2px 0 #2a1408)}
.msb .msb-ttl-t{font-size:16px;color:#fff;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
.msb .ms-dot{margin:0;align-self:flex-start}
.msb .msb-more{font-style:normal;font-size:11px;color:#fff;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.msb .msb-row{position:absolute;left:8px;right:6px;bottom:5px;display:flex;align-items:flex-end;gap:6px}
.msb .msb-txt{flex:1;min-width:0;font-size:16px;line-height:1.15;color:#fff;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill;text-shadow:0 2px 0 #2a1408;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:2px 0}
.msb .msb-rws{display:flex;gap:6px;flex:0 0 auto;padding:4px 6px 2px;background:radial-gradient(ellipse at center,#1a0c06b0 30%,#1a0c0600 72%)}
.msb .msb-rw{display:flex;align-items:center;gap:2px}
.msb .msb-rw img{width:22px;height:22px;object-fit:contain;filter:drop-shadow(0 1px 0 #2a1408)}
.msb .msb-rw b{font-size:17px;color:#ffd75e;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
.msb .msb-get{flex:0 0 auto;border:0;border-style:solid;border-width:6px 14px 8px;border-image:url(art/ui/btn_gold.png) 50 120 56 fill/6px 14px 8px stretch;padding:0 2px;font-size:14px;color:#fff;-webkit-text-stroke:3px #5a2a08;paint-order:stroke fill;filter:drop-shadow(0 2px 0 #2a1f16)}
/* 2026-10-23 ユーザー：帯は半分の大きさで右寄せ。題字と報酬を上の段、内容を下の段（2行まで） */
.ms-strip.msb{width:50%;margin:6px 0 6px auto;height:60px}
.msb .msb-top{left:5px;right:5px;top:3px}
.msb .msb-ttl{height:16px}
.msb .msb-more{font-size:9px;-webkit-text-stroke:2.5px #2a1408}
.msb .ms-dot{width:7px;height:7px;border-width:1.5px}
.msb .msb-row{left:6px;right:5px;bottom:3px;top:22px;align-items:center}
.msb .msb-txt{font-size:12px;line-height:1.2;-webkit-text-stroke:3px #2a1408;text-shadow:0 1px 0 #2a1408;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0}
.msb .msb-rws,.msb .msb-get{position:absolute;right:0;top:-21px}
.msb .msb-rws{padding:1px 2px;gap:4px}
.msb .msb-rw img{width:15px;height:15px}
.msb .msb-rw b{font-size:13px;-webkit-text-stroke:3px #2a1408}
.msb .msb-get{border-width:4px 10px 5px;border-image-width:4px 10px 5px;font-size:11px;-webkit-text-stroke:2.5px #5a2a08;top:-22px}
/* 半分は横幅だけ（高さ・字は元の大きさに近く） */
.ms-strip.msb{height:74px}
.msb .msb-top{left:6px;top:4px}
.msb .msb-ttl{height:22px}
.msb .msb-more{font-size:11px;-webkit-text-stroke:3px #2a1408}
.msb .ms-dot{width:9px;height:9px;border-width:2px}
.msb .msb-row{left:7px;right:6px;bottom:4px;top:30px}
.msb .msb-txt{font-size:14px;-webkit-text-stroke:3.5px #2a1408;text-shadow:0 2px 0 #2a1408}
.msb .msb-rws{top:-28px}
.msb .msb-rw img{width:20px;height:20px}
.msb .msb-rw b{font-size:16px;-webkit-text-stroke:4px #2a1408}
.msb .msb-get{border-width:5px 12px 6px;border-image-width:5px 12px 6px;font-size:13px;-webkit-text-stroke:3px #5a2a08;top:-30px}
.msb .msb-top{position:static}
.msb .msb-top .msb-ttl,.msb .msb-top>b{position:absolute;left:6px;top:4px}
.msb .msb-top .ms-dot{position:absolute;left:var(--msb-dot,112px);top:5px}
.msb .msb-more{position:absolute;right:5px;bottom:3px;z-index:1;font-size:10px}
.msb .msb-top .ms-dot{left:101px;top:4px}
.msb .msb-txt{padding-right:34px}
/* 2026-10-23 スロットの新しい操作部の絵（正面から見た形。docs/スロット_*_制作記録.md で採用） */
.sx-stop{background-image:url(art/slot/btn_stop2_white.png)!important}
.sx-stop.lit{background-image:url(art/slot/btn_stop2_red.png)!important;filter:drop-shadow(0 3px 0 #0008)}
.sx-bet{background-image:url(art/slot/btn_bet2.png)!important}
.sx-bet.on{background-image:url(art/slot/btn_bet2_on.png)!important}
.sx-lever{background-image:url(art/slot/btn_lever2.png)}
.sx-lever.pull{background-image:url(art/slot/btn_lever2_down.png)}
.sx-lever::after{background:url(art/slot/btn_lever2_down.png)}
.sx-stops::after{content:'';position:absolute;width:0;height:0;background:url(art/slot/btn_stop2_red.png),url(art/slot/btn_bet2_on.png)}
.sx-bet.on{transform:none;filter:drop-shadow(0 2px 0 #0008)}
/* 正面の絵になったので、操作部を1列にそろえる（レバー＝停止ボタンと同じくらいの丸、MAX BET は横長で小さく） */
#sl-host .sx-panel{grid-template-columns:64px 66px 1fr;align-items:center;gap:6px}
#sl-host .sx-bet{height:30px;min-width:0}
#sl-host .sx-lever{min-width:0;width:66px;height:72px;background-size:contain;background-position:center top}
#sl-host .sx-stop{height:58px}
#sl-host .sx-panel{padding:3px 6px;margin-top:4px}
#sl-host .sx-lever{height:62px}
#sl-host .sx-stop{height:54px}
/* 見出しの段（扁額＋コイン行）が高くなったので、台の高さをその分へらす（画面からはみ出してスクロールが出ていた） */
#sl-host .sx{height:calc(100svh - 98px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
/* 2026-10-23 賭場（スロット）：題・コイン・両替・景品・もどるを1行に。リール枠は横長、空いた分は液晶へ */
.cs-bar1{gap:4px;padding-top:calc(env(safe-area-inset-top,0px) + 2px)}
.cs-bar1 .ev-top{margin:0;flex:0 1 auto;min-width:0}
.cs-bar1 .ev-top .ev-ttl{min-width:0;height:38px;padding:0 20px 2px;font-size:16px;-webkit-text-stroke:5px #2a1408}
.cs-bar1 .cs-coins{flex:1;min-width:0;white-space:nowrap}
.cs-bar1 .btn{padding:3px 7px;font-size:12px}
#sl-host .sx{height:calc(100svh - 52px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
#sl-host .sx-reels{width:min(80vw,300px,calc((100dvh - 400px)*1.5))}
.cs-bar1 .ev-top .ev-ttl{padding:0 14px 2px;font-size:15px}
.cs-bar1 .cs-coins{flex:1 0 auto;font-size:0;display:flex;align-items:center;gap:2px}
.cs-bar1 .cs-coins b{font-size:16px}
.cs-bar1 .btn{padding:3px 5px}
#sl-host .sx-reels{width:min(66vw,250px,calc((100dvh - 400px)*1.5))}
.cs-bar1 .btn{flex:0 0 auto;white-space:nowrap;min-width:0}
.cs-bar1 .ev-top{flex:0 0 auto}
.cs-bar1 .ev-top .ev-ttl{font-size:14px;padding:0 12px 2px;-webkit-text-stroke:4px #2a1408}
.cs-bar1 .cs-coins{flex:1 1 auto;min-width:0}
.cs-bar1 .btn{font-size:11px;padding:3px 3px}
.cs-bar1 .btn{border-left-width:11px!important;border-right-width:11px!important;border-image-width:6px 11px 7px!important;padding:3px 1px!important}
.cs-bar1 .cs-coins .ico{width:16px;height:16px}
.cs-bar1 .cs-coins b{font-size:15px}
/* 2026-10-23 ユーザー：停止ボタンはリールの真下。MAX BET はクレジットの段（数字は右寄せ）、レバーは停止ボタンの段の左 */
#sl-host{--rw:min(66vw,250px,calc((100dvh - 400px)*1.5))}
#sl-host .sx-reels{width:var(--rw)}
#sl-host .sx-seg{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:3px 10px 3px 4px}
#sl-host .sx-seg .sx-bet{margin-right:auto;width:64px;height:30px;flex:0 0 auto}
#sl-host .sx-seg>span{flex:0 0 auto;min-width:46px;text-align:center}
#sl-host .sx-panel{display:block;position:relative;padding:3px 0}
#sl-host .sx-stops{width:var(--rw);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);column-gap:calc(var(--rw)*10/224);padding:0 calc(var(--rw)*6/224);box-sizing:border-box}
#sl-host .sx-lever{position:absolute;left:6px;top:50%;transform:translateY(-50%)!important;width:44px;height:50px;min-width:0}
.cs-bar1 .ev-top .ev-ttl{font-size:17px;padding:0 16px 2px}
/* 2026-10-23 ボス戦：昔のポケモンの戦闘の見せ方。敵は右上で正面、コマは左下で後ろ姿。技はルーレットで決まる */
.sx-pk{display:none}
.sx-lcd.pk .sx-pk{display:block;position:absolute;inset:0;z-index:3;pointer-events:none;background:url(art/slot/battle_bg.jpg) center 60%/cover no-repeat,linear-gradient(#c9b77a,#a8915a)}
.sx-lcd.pk .sx-mon{position:absolute!important;left:auto!important;right:5%!important;top:9%!important;bottom:auto!important;width:36%!important;height:auto!important;z-index:5;transform:none!important}
.sx-lcd.pk .sx-mon img{width:100%!important;height:auto!important;max-height:none!important;position:relative;z-index:2}
.sx-lcd.pk .sx-mon .sx-hp{display:none}
.sx-lcd.pk .sx-act .hero{display:none}
.sx-lcd.pk .sx-act{z-index:6}
.pk-pad{position:absolute;border-radius:50%;background:radial-gradient(ellipse at 50% 45%,#7a6a3a 0,#6a5a2e 55%,#5a4a26 70%,transparent 72%)}
.pk-pad.pe{right:2%;top:31%;width:44%;height:13%}
.pk-pad.ph{left:-6%;bottom:-4%;width:58%;height:18%}
.pk-hero{position:absolute;left:3%;bottom:-2%;height:56%;width:auto;z-index:4}
.pk-pl{position:absolute;z-index:6;display:flex;flex-direction:column;gap:3px;padding:4px 10px 6px;border:0;border-style:solid;border-width:8px 14px;border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/8px 14px stretch;color:#fff6df}
.pk-pl b{font-size:13px;line-height:1;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill;white-space:nowrap}
.pk-pl.pe{left:3%;top:5%;min-width:38%}
.pk-pl.ph{right:3%;bottom:6%;flex-direction:row;align-items:baseline;gap:6px}
.pk-pl small{font-size:12px;color:#ffd75e;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.pk-hp{display:block;height:7px;background:#2a1408;box-shadow:0 0 0 1px #f2c66a}
.pk-hp i{display:block;height:100%;width:100%;background:linear-gradient(#ffe36a,#e8952a);transition:width .5s}
/* 技ルーレット */
.pk-roul{position:absolute;z-index:7;left:50%;top:47%;transform:translate(-10%,-50%);width:46%;height:30px;overflow:hidden;opacity:0;border:0;border-style:solid;border-width:6px 12px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/6px 12px stretch}
.pk-roul.spin,.pk-roul.hit{opacity:1}
.pk-strip{display:flex;flex-direction:column}
.pk-strip b{display:block;height:18px;line-height:18px;text-align:center;font-size:14px;color:#fff6df;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill;white-space:nowrap}
.pk-roul.spin .pk-strip{animation:pkRoll .45s linear infinite}
@keyframes pkRoll{to{transform:translateY(-50%)}}
.pk-roul.hit{animation:pkHit .5s ease-out}
@keyframes pkHit{0%{transform:translate(-10%,-50%) scale(1.25)}100%{transform:translate(-10%,-50%) scale(1)}}
.pk-strip .sk1{color:#ffd0a0}.pk-strip .sk2{color:#ff9a5a}.pk-strip .sk3{color:#ff5a3a}.pk-strip .sk4{color:#c070ff}
.pk-say{position:absolute;z-index:7;left:50%;top:62%;transform:translateX(-10%);font-size:15px;color:#fff;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill;white-space:nowrap;opacity:0}
.pk-say.on{opacity:1;animation:pkSay .35s ease-out}
.pk-say.foe{color:#ffb0a0}
@keyframes pkSay{from{transform:translate(-10%,8px);opacity:0}}
.sx-lcd.pk .pk-hero{height:56%!important;width:auto!important;max-width:none!important}
.pk-pl.pe{top:13%}
/* 初代ポケモンのように足元は画面の下で切る（2026-10-23 ユーザー） */
.sx-lcd.pk .pk-hero{height:64%!important;bottom:-17%}
.sx-lcd.pk .sx-pk{background:url(art/slot/battle_bg.jpg) center 70%/cover no-repeat}
.pk-pad{background:radial-gradient(ellipse at 50% 45%,#9a5a2a 0,#8a4e24 50%,rgba(122,68,30,.6) 66%,transparent 72%)}
.sx-lcd .pk-say{font-size:18px!important;line-height:1.1;-webkit-text-stroke:5px #2a1408;left:50%;top:60%;transform:translateX(-30%)}
.sx-lcd .pk-strip b{font-size:15px!important}
/* ボスはもっと大きく（2026-10-23 ユーザー） */
.sx-lcd.pk .sx-mon{width:52%!important;right:1%!important;top:4%!important}
.pk-pad.pe{right:-2%;top:36%;width:58%;height:15%}
/* ルーレットはボスの足元にかからないよう少し下へ */
.pk-roul{top:56%}
.sx-lcd .pk-say{top:68%}
/* 冒険の書の入口（液晶の右上、データの左） */
.sx-book{position:absolute;z-index:31;right:84px;top:24px;font:inherit;font-size:11px;color:#fff6df;background:none;border:0;border-style:solid;border-width:4px 9px;border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/4px 9px stretch;padding:0 2px;-webkit-text-stroke:2px #3a1408;paint-order:stroke fill;cursor:pointer}
/* 冒険の書・大物図鑑 */
.bk-wrap{display:flex;flex-direction:column;gap:8px;padding:4px 2px 12px}
.bk-hero{display:flex;align-items:center;gap:8px;padding:8px 10px;border:0;border-style:solid;border-width:14px 16px;border-image:url(art/ui/mat/stele_plain.png) 60 60 60 60 fill/14px 16px stretch}
.bk-hero>img{width:72px;height:72px;object-fit:contain}
.bk-lv{display:flex;flex-direction:column;align-items:center;line-height:1;padding:6px 10px;background:radial-gradient(ellipse at center,#1a0c06b0 30%,#1a0c0600 72%)}
.bk-lv small{font-size:12px;color:#fff6df;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.bk-lv b{font-size:34px;color:#ffd75e;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill}
.bk-stat{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.bk-stat span{display:flex;align-items:baseline;gap:4px;font-size:12px;color:#3a2410;white-space:nowrap}
.bk-stat small{font-size:11px;color:#6a4a2a;margin-right:auto}
.bk-stat b{font-size:18px;color:#3a1408}
.bk-stat em{font-style:normal;font-size:12px;color:#7a1d10;font-weight:900}
.bk-lands{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.bk-lands span{text-align:center;font-size:12px;padding:6px 2px;color:#8a7a62;border:0;border-style:solid;border-width:5px 10px;border-image:url(art/ui/mat/iron.png) 30 62 30 62 fill/5px 10px stretch;white-space:nowrap}
.bk-lands span.on{color:#fff6df;-webkit-text-stroke:2px #2a1408;paint-order:stroke fill;border-image-source:url(art/ui/mat/lacquer.png);border-image-slice:50 60 50 60 fill}
.bk-lands span.now{filter:drop-shadow(0 0 5px #ffb43a)}
.bk-h{margin:4px 0 0;font-size:16px;color:#3a1408}.bk-h small{font-size:12px;color:#6a4a2a}
.bk-mons{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.bk-mon{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px 8px;border:0;border-style:solid;border-width:12px 14px;border-image:url(art/ui/mat/stele_plain.png) 60 60 60 60 fill/12px 14px stretch}
.bk-mon>img{width:100%;height:110px;object-fit:contain}
.bk-mon.unknown>img{filter:brightness(0) opacity(.55)}
.bk-mon b{font-size:13px;color:#3a1408;white-space:nowrap}
.bk-mon small{position:absolute;right:4px;top:2px;font-size:15px;font-weight:900;color:#ffd75e;-webkit-text-stroke:4px #2a1408;paint-order:stroke fill}
.bk-get{display:flex;align-items:center;gap:3px;font:inherit;font-size:14px;color:#fff;-webkit-text-stroke:3px #5a2a08;paint-order:stroke fill;background:none;border:0;border-style:solid;border-width:5px 12px 6px;border-image:url(art/ui/btn_gold.png) 50 120 56 fill/5px 12px 6px stretch;padding:0 2px;cursor:pointer}
.bk-get .ico{width:18px;height:18px}
.bk-done{font-style:normal;font-size:12px;color:#6a4a2a}
.bk-all{font:inherit;font-size:14px;color:#fff;-webkit-text-stroke:3px #5a2a08;paint-order:stroke fill;background:none;border:0;border-style:solid;border-width:7px 16px 8px;border-image:url(art/ui/btn_gold.png) 50 120 56 fill/7px 16px 8px stretch;padding:2px;cursor:pointer}
body:has(.bk-wrap) .back-float{display:none}
body:has(.bk-wrap) .tabbar{display:none}
.page-casino:has(.bk-wrap){padding-bottom:0}
.bk-wrap{height:calc(100svh - 58px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));box-sizing:border-box}
.bk-mons{flex:1;min-height:0;grid-auto-rows:1fr}
.bk-mon{min-height:0}
.bk-mon>img{flex:1;min-height:0;height:auto}
/* 2026-10-23 通常時：コマが街道を歩く（1ゲーム1歩）。歩く絵は art/stand/koma_walk1〜6（ドットになる） */
.sx-walk{display:none}
.sx-lcd.m-normal .sx-walk{display:block;position:absolute;left:14%;bottom:5%;height:48%;aspect-ratio:1/1;z-index:2;pointer-events:none}
.sx-walk img{position:absolute;inset:0;width:100%!important;height:100%!important;visibility:hidden}
.sx-walk img.on,.sx-walk:not(.go) img:first-child{visibility:visible}
.sx-lcd.m-normal .sx-bg{background-size:auto 112%!important}
.sx-lcd.m-normal .sx-scene .amb{display:none}
/* CZ・雷獣の足あと・雷獣の巣（ボス戦と同じ画面の変わり種） */
.sx-lcd.pk-seki .sx-pk{background-image:url(art/slot/seki_bg.jpg),url(art/slot/battle_bg.jpg)}
/* 2026-10-30 雷獣の足あと＝探す場面。雷獣・敵の台は出さず、足あとの背景（チャッピー）。板は「巣のけはい」が貯まる */
.sx-lcd.pk-trail .sx-pk{background:url(art/slot/trail_bg.jpg) center 70%/cover no-repeat!important}
.sx-lcd.pk.pk-trail .sx-mon,.sx-lcd.pk.pk-nest .sx-mon,.sx-lcd.pk-trail .pk-pad.pe,.sx-lcd.pk-nest .pk-pad,.sx-lcd.pk-nest .pk-pl.pe{display:none!important}
.sx-lcd.pk-trail .pk-hp i{background:linear-gradient(#bfe4ff,#4a9aff)!important}
.sx-act.search .trace{position:absolute;width:30%;aspect-ratio:2/1;margin-left:-15%;margin-top:-7.5%;border-radius:50%;background:radial-gradient(ellipse,#ffffff 0,#d8f0ffee 22%,#7ac0ffaa 42%,#7ac0ff00 70%);mix-blend-mode:screen;animation:sxTrace .9s ease-out forwards;pointer-events:none}
.sx-act.search .trace.t1{left:71%;top:72%}.sx-act.search .trace.t2{left:70%;top:53%;width:22%;margin-left:-11%}.sx-act.search .trace.t3{left:63%;top:40%;width:15%;margin-left:-7.5%}
@keyframes sxTrace{0%{opacity:0;transform:scale(.6)}25%{opacity:1;transform:scale(1.15)}100%{opacity:.9;transform:scale(1)}}
/* 2026-10-30 雷獣の巣＝上乗せをもらう場面。巣の背景（チャッピー）。上乗せのたびに巣の雷が光る */
.sx-lcd.pk-nest .sx-pk{background:url(art/slot/nest_bg.jpg) center 60%/cover no-repeat!important}
.sx-lcd.pk-nest .sx-pk::after{content:'';position:absolute;left:30%;right:30%;top:0;height:42%;background:radial-gradient(ellipse at 50% 40%,#e8f4ffee 0,#7ab4ff88 30%,#7ab4ff00 70%);opacity:0;pointer-events:none}
.sx-lcd.pk-nest .sx-pk.strike::after{animation:sxNest .8s ease-out}
@keyframes sxNest{0%{opacity:0}15%{opacity:1}100%{opacity:0}}
.sx-lcd.pk-trail .sx-pk{filter:none}
.sx-lcd.pk-nest .pk-pl.pe .pk-hp{display:none}
.sx-lcd .sx-banner{z-index:9}
.sx-lcd.pk-seki .sx-pk{background-position:center 15%}
.sx-lcd.pk-nest .pk-pad{filter:brightness(.35)}
.sx-lcd.pk-nest .sx-mon img{filter:drop-shadow(0 0 10px #8ab4ff)}
/* 2026-10-23 通常時：街道がずっと流れ、コマは歩き続ける。絵を左右反転でつないで切れ目を出さない */
.sx-road{display:none}
.sx-lcd.m-normal:not(.pk) .sx-road{display:block;position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.rd-strip{display:flex;height:100%;width:max-content;animation:rdRun 26s linear infinite}
.rd-strip i{flex:0 0 auto;height:100%;aspect-ratio:1000/562;background:url(art/bg/slot_kunren.jpg) center/cover no-repeat}
.rd-strip i.mr{transform:scaleX(-1)}
.sx-road[data-land="1"] .rd-strip i{background-image:url(art/bg/slot_gake.jpg)}
.sx-road[data-land="2"] .rd-strip i{background-image:url(art/bg/slot_kazan.jpg)}
.sx-road[data-land="3"] .rd-strip i{background-image:url(art/bg/slot_mori.jpg)}
@keyframes rdRun{to{transform:translateX(-50%)}}
.sx-lcd.stop .rd-strip{animation-play-state:paused}
/* 前兆ステージ：夕暮れの色 */
.sx-lcd.zen .rd-strip{filter:sepia(.5) saturate(1.4) hue-rotate(-18deg) brightness(.8)}
.sx-lcd.pk .sx-walk{display:none!important}
/* 立ち止まって反応 */
.sx-lcd.stop .sx-walk::after{content:'！';position:absolute;left:46%;top:-12%;font-size:30px;font-weight:900;color:#fff;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill;animation:wkBang .3s ease-out}
@keyframes wkBang{from{transform:scale(.3) translateY(10px);opacity:0}}
/* 場面転換（アイキャッチ）：白い光が横切る */
.sx-eye{position:absolute;inset:0;z-index:40;pointer-events:none;opacity:0}
.sx-eye.on{animation:sxEye .58s ease-in-out}
@keyframes sxEye{0%{opacity:0;background:radial-gradient(circle at 50% 50%,#fff 0,#fff0 0)}45%{opacity:1;background:radial-gradient(circle at 50% 50%,#fff 60%,#fff8e0 100%)}100%{opacity:0}}
/* 遭遇の画面（ボス戦と同じ見せ方。背景は戦いの場） */
.sx-lcd.pk-enc .pk-pl.pe .pk-hp{opacity:.4}
.sx-lcd.pk-enc .sx-ren img{display:none}
.sx-lcd.pk-enc .sx-ren .ren-t{top:auto;bottom:34%}
/* 歩く絵は今のコマだけを出す（1枚目が残ってダブって見えていた） */
.sx-walk img,.sx-walk:not(.go) img:first-child{visibility:hidden!important}
.sx-walk img.on{visibility:visible!important}
.sx-walk img.on,.sx-walk:not(.go) img.on:first-child{visibility:visible!important}
/* 2026-10-23 ユーザー：喋るキャラが全員画面の外（左）を向いていた。キャラの絵は左向きなので右下に置き、歩いてくるコマと向き合わせる */
.sx-lcd .sx-chara{left:auto!important;right:4px!important}
.sx-lcd .sx-talk{left:8px!important;right:96px!important}
/* セリフの枠は液晶の上のほうへ（下だと歩くコマにかぶる） */
.sx-lcd.m-normal .sx-talk{top:46px!important;bottom:auto!important;left:8px!important;right:8px!important}
/* 2026-10-23 ユーザー：冒険の書・データは両替の列に。液晶の枠は台枠に重ね、液晶を広く。吹き出しは小さく */
.cs-bar1 .sx-book,.cs-bar1 .sx-data-t{position:static!important;flex:0 0 auto;white-space:nowrap;font-size:11px;padding:2px 6px}
.cs-bar1 .sx-book{padding:0 1px}
.cs-bar1 .sx-data-t{padding:3px 6px;border-width:2px}
.cs-bar1 .cs-coins{flex:1 1 auto}
#sl-host .sx-lcd{margin:-10px -10px 0}
#sl-host .sx-frame{border-width:20px}
#sl-host .sx-data{top:22px!important;right:22px!important}
#sl-host .sx-data-in{top:0}
.sx-lcd.m-normal .sx-talk{top:24px!important;left:22px!important;right:auto!important;max-width:64%;padding:3px 8px!important;font-size:11px!important;border-width:2px!important}
.sx-lcd.m-normal .sx-talk small{font-size:8px}
.sx-lcd .sx-chara{height:96px!important;right:20px!important;bottom:14px!important}
.cs-bar1:has(.sx-book) .cs-coins{display:none}
.cs-bar1:has(.sx-book) .ev-top{margin-right:auto}
.sx-lcd.m-normal .sx-talk{max-width:80%}
/* 枠の絵の外側の透明な余白から液晶の映像が見えていた：枠の真下に暗い帯を敷く */
#sl-host .sx-lcd::after{content:''!important;position:absolute;inset:0;z-index:29;pointer-events:none;border:20px solid #140b05!important;border-image:none!important;background:none}
/* 暗い帯は枠の絵の外側の透明なふち（約1.5px）だけ。内側は液晶の映像を見せる（20px 全部を塗って液晶が狭くなっていた） */
#sl-host .sx-lcd::after{border-width:2px!important}
/* 2026-10-24 ユーザー：吹き出しは喋るキャラのすぐ上 */
.sx-lcd.m-normal .sx-talk{top:auto!important;bottom:112px!important;left:auto!important;right:18px!important;max-width:72%}
.sx-lcd.m-normal .sx-talk{max-width:44%;white-space:normal}
.sx-lcd.m-normal .sx-walk{left:5%;height:40%}
/* 2026-10-24 ユーザー：光るのは台の外枠ではなく液晶のまわり */
#sl-host .sx[data-frame]::after{display:none!important}
#sl-host .sx-lcd{--lamp:transparent;transition:box-shadow .15s}
#sl-host .sx[data-frame=blue] .sx-lcd{--lamp:#3a8aff}
#sl-host .sx[data-frame=green] .sx-lcd{--lamp:#3aff6a}
#sl-host .sx[data-frame=red] .sx-lcd{--lamp:#ff2a1a}
#sl-host .sx[data-frame=yellow] .sx-lcd{--lamp:#ffe84a}
#sl-host .sx[data-frame=purple] .sx-lcd{--lamp:#b04aff}
#sl-host .sx[data-frame=rainbow] .sx-lcd{--lamp:#fff3a0}
#sl-host .sx[data-frame]:not([data-frame=""]) .sx-lcd{box-shadow:0 0 0 2px var(--lamp),0 0 14px 4px var(--lamp);animation:lcdLamp .9s ease-in-out infinite}
#sl-host .sx[data-frame=rainbow] .sx-lcd{animation:lcdRainbow .6s linear infinite}
@keyframes lcdLamp{50%{box-shadow:0 0 0 2px var(--lamp),0 0 26px 8px var(--lamp)}}
@keyframes lcdRainbow{0%{box-shadow:0 0 0 2px #f33,0 0 20px 6px #f33}20%{box-shadow:0 0 0 2px #fa3,0 0 20px 6px #fa3}40%{box-shadow:0 0 0 2px #ff3,0 0 20px 6px #ff3}60%{box-shadow:0 0 0 2px #3f6,0 0 20px 6px #3f6}80%{box-shadow:0 0 0 2px #3cf,0 0 20px 6px #3cf}100%{box-shadow:0 0 0 2px #a6f,0 0 20px 6px #a6f}}
#sl-host .sx-lcd{position:relative;z-index:1}
#sl-host .sx[data-frame]:not([data-frame=""]) .sx-lcd{box-shadow:0 0 0 2px var(--lamp),0 0 14px 4px var(--lamp)!important}
.sx-flash.green{opacity:.18;background:#3aff6a}
/* 中段チェリー：プチュン（台ごと暗転。液晶もリールの光も消える） */
#sl-host .sx.puchun .sx-lcd>*:not(.sx-frame):not(.sx-fz){visibility:hidden}
#sl-host .sx.puchun .sx-lcd{background:#000!important;box-shadow:none!important}
#sl-host .sx.puchun .sx-reels{filter:brightness(.25)}
#sl-host .sx.puchun .sx-stop,#sl-host .sx.puchun .sx-bet{filter:brightness(.3)}
.sx-banner.w7 b.w7{color:#eaf6ff;-webkit-text-stroke:4px #1d3a8a;paint-order:stroke fill}
/* 雷獣降臨（中段チェリーのフリーズ） */
.sx-big.kourin img.kourin{display:block;width:62%;margin:0 auto -6px;filter:drop-shadow(0 0 14px #9ad0ff)}
.sx-big.kourin b{display:block;font-size:30px;color:#fff;-webkit-text-stroke:6px #1d2a6a;paint-order:stroke fill}
/* 2026-10-24 ユーザー：「関所が見えてきた」などの場所の文字は右上（下だとコマにかぶる） */
#sl-host .sx-lcd .sx-stage{left:auto!important;bottom:auto!important;right:24px!important;top:22px!important;font-size:12px}
/* フリーズ中はコマ・喋るキャラ・吹き出しを消す。雷獣降臨は雷獣と文字を縦に並べて真ん中に */
#sl-host .sx.puchun .sx-walk,#sl-host .sx-lcd.kourin-on .sx-walk,#sl-host .sx-lcd.kourin-on .sx-chara,#sl-host .sx-lcd.kourin-on .sx-talk,#sl-host .sx-lcd.kourin-on .sx-stage{display:none!important}
#sl-host .sx-lcd.kourin-on .sx-road{filter:brightness(.35) saturate(.6)}
.sx-big.kourin{display:flex!important;flex-direction:column;align-items:center;justify-content:center;inset:0!important;left:0!important;right:0!important;top:0!important;bottom:0!important;transform:none!important;width:auto!important;background:radial-gradient(ellipse at center,#ffffff30,#0000 70%)}
.sx-big.kourin img.kourin{width:auto;height:58%;max-width:80%;margin:0 0 -4px}
/* プチュン：ブラウン管を切った時のように、画面が上下からつぶれて白い横線→真ん中の点になって消える */
.sx-crt{position:absolute;inset:0;z-index:28;pointer-events:none;display:none}
.sx-crt.on{display:block}
.sx-crt::before,.sx-crt::after{content:'';position:absolute;left:0;right:0;height:0;background:#000}
.sx-crt::before{top:0}.sx-crt::after{bottom:0}
.sx-crt.on::before,.sx-crt.on::after{animation:crtBar .18s ease-in forwards}
@keyframes crtBar{to{height:calc(50% - 1px)}}
.sx-crt i{position:absolute;left:0;right:0;top:50%;height:3px;margin-top:-1.5px;background:#fff;box-shadow:0 0 10px 3px #fff,0 0 24px 8px #bfe4ff;opacity:0}
.sx-crt.on i{animation:crtLine .5s linear forwards}
@keyframes crtLine{0%{opacity:0}30%{opacity:1;left:0;right:0}75%{opacity:1;left:calc(50% - 2px);right:calc(50% - 2px);height:4px}100%{opacity:0;left:50%;right:50%}}
.sx-lcd:has(.sx-crt.on)>*:not(.sx-crt):not(.sx-frame){filter:brightness(1.8)}
/* 雷獣降臨フリーズ */
#sl-host .sx.puchun .sx-lcd>.sx-fz{visibility:visible!important}
.sx-fz{position:absolute;inset:0;z-index:27;pointer-events:none;display:none;overflow:hidden;background:#000}
.sx-fz.on{display:block}
/* 遠くの稲妻（暗い中で一瞬だけ光る） */
.fz-bolt{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 20%,#cfe6ff 0,#5a8aff55 30%,transparent 60%);opacity:0}
.sx-fz.fzb .fz-bolt{animation:fzBolt .45s ease-out}
@keyframes fzBolt{0%{opacity:0}10%{opacity:1}25%{opacity:.2}35%{opacity:.8}100%{opacity:0}}
/* ひび */
.fz-crack{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.fz-crack path{fill:none;stroke:#e8f4ff;stroke-width:.9;stroke-linecap:round;stroke-dasharray:200;stroke-dashoffset:200;filter:drop-shadow(0 0 2px #9ad0ff)}
.sx-fz.fzcrack .fz-crack{opacity:1}.sx-fz.fzcrack .fz-crack path{animation:fzCrack .45s ease-out forwards}
@keyframes fzCrack{to{stroke-dashoffset:0}}
.sx-fz.fzshatter .fz-crack{animation:fzShat .35s ease-in forwards}
@keyframes fzShat{to{opacity:0;transform:scale(1.4)}}
/* 割れたあと：夜空の青＋虹の後光が回る */
.sx-fz.fzshatter{background:radial-gradient(ellipse at 50% 45%,#2a3a8a,#0a0f2a 75%)}
.fz-halo{position:absolute;left:50%;top:46%;width:150%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;opacity:0;background:conic-gradient(#ff4a4a,#ffb43a,#fff04a,#4aff7a,#4ad8ff,#6a6aff,#d04aff,#ff4a4a);-webkit-mask:radial-gradient(circle,#000 0 18%,transparent 19% 24%,#000 25% 40%,transparent 62%);mask:radial-gradient(circle,#000 0 18%,transparent 19% 24%,#000 25% 40%,transparent 62%)}
.sx-fz.fzshatter .fz-halo{opacity:.85;animation:fzSpin 2.4s linear infinite}
@keyframes fzSpin{to{rotate:360deg}}
.fz-rays{position:absolute;inset:-30%;opacity:0;background:radial-gradient(circle at 50% 50%,#ffffff55 0,transparent 45%)}
.sx-fz.fzface .fz-rays{opacity:1}
/* 雷獣：上から降ってきて着地 */
.fz-r1{position:absolute;left:50%;top:48%;width:auto!important;height:72%!important;translate:-50% -50%;opacity:0;filter:drop-shadow(0 0 12px #9ad0ff)}
.sx-fz.fzshatter .fz-r1{animation:fzDrop .55s cubic-bezier(.3,1.5,.6,1) forwards}
@keyframes fzDrop{0%{opacity:1;transform:translateY(-140%) scale(.9)}70%{transform:translateY(4%) scale(1.04,.96)}100%{opacity:1;transform:none}}
.sx-fz.fzface .fz-r1{animation:none;opacity:0}
/* 顔の大写し */
.fz-r2{position:absolute;left:50%;top:44%;width:auto!important;height:96%!important;translate:-50% -50%;opacity:0;filter:drop-shadow(0 0 16px #bfe4ff)}
.sx-fz.fzface .fz-r2{animation:fzZoom .6s ease-out forwards}
@keyframes fzZoom{0%{opacity:0;transform:scale(1.6)}100%{opacity:1;transform:scale(1)}}
.fz-ttl{position:absolute;left:0;right:0;bottom:10%;text-align:center;font-size:38px;line-height:1;color:#fff3a0;-webkit-text-stroke:7px #3a1a00;paint-order:stroke fill;text-shadow:0 0 16px #ffd84a;opacity:0}
.sx-fz.fzface .fz-ttl{animation:fzStamp .45s cubic-bezier(.2,1.6,.5,1) .35s forwards}
@keyframes fzStamp{0%{opacity:0;transform:scale(3)}100%{opacity:1;transform:scale(1)}}
/* 最後の雷 */
.sx-fz.fzburst::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,#fff 0,#bfe4ff 30%,transparent 70%);animation:fzBurst .5s ease-out forwards}
@keyframes fzBurst{0%{opacity:1}100%{opacity:0}}
/* 疾走ゾーン：コマが走り、街道が速く流れ、速さの線。関所までの残りと減ったゲーム数を出す */
.sx-lcd.dash .rd-strip{animation-duration:5s}
.sx-speed{display:none}
.sx-lcd.dash .sx-speed{display:block;position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 9px,#ffffff38 9px 11px,transparent 11px 23px);animation:spdRun .25s linear infinite;-webkit-mask:linear-gradient(90deg,#000,transparent 70%);mask:linear-gradient(90deg,#000,transparent 70%)}
@keyframes spdRun{from{background-position-x:0}to{background-position-x:-60px}}
.sx-lcd.dash .sx-speed{background:repeating-linear-gradient(90deg,transparent 0 40px,#ffffff40 40px 120px,transparent 120px 200px) 0 18%/100% 2px no-repeat,repeating-linear-gradient(90deg,transparent 0 60px,#ffffff30 60px 180px) 0 42%/100% 2px no-repeat,repeating-linear-gradient(90deg,transparent 0 30px,#ffffff38 30px 100px) 0 64%/100% 2px no-repeat;animation:spdRun2 .22s linear infinite}
@keyframes spdRun2{to{background-position:-200px 18%,-240px 42%,-130px 64%}}
.sx-dash{display:none}
.sx-dash.on{display:flex;align-items:baseline;gap:3px;position:absolute;left:22px;top:22px;z-index:8;padding:4px 10px;background:radial-gradient(ellipse at center,#1a0c06c0 30%,#1a0c0600 75%)}
.sx-dash small{font-size:12px;color:#fff6df;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.sx-dash b{font-size:28px;line-height:1;color:#ffd75e;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill}
.sx-dashpop{position:absolute;left:22px;top:60px;z-index:8;pointer-events:none}
.dash-minus{display:block;font-style:normal;font-size:24px;font-weight:900;color:#7ad8ff;-webkit-text-stroke:5px #0a1a3a;paint-order:stroke fill;animation:dashPop 1.3s ease-out forwards}
@keyframes dashPop{0%{opacity:0;transform:translateY(10px) scale(1.6)}15%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-14px)}}
/* 突入画面（ゾーン・ラッシュ・バトルの入り口） */
.sx-entry{position:absolute;inset:0;z-index:26;pointer-events:none;display:none;overflow:hidden}
.sx-entry.on{display:block}
/* 巣の小上乗せは告知を保持している間も、獲得Gと残りGを前面に出す */
.sx-upnum{z-index:27}
.sx-lcd.m-tokka .sx-mode{z-index:27}
.sx-entry .en-bg{position:absolute;inset:-20%;background:radial-gradient(ellipse at 50% 55%,var(--ec) 0,var(--ec2) 70%)}
.sx-entry.c-green{--ec:#1d6a3a;--ec2:#123f24}.sx-entry.c-blue{--ec:#1d3a8a;--ec2:#10204f}.sx-entry.c-yellow{--ec:#8a6a10;--ec2:#4f3a08}
.sx-entry.c-red{--ec:#8a1d1d;--ec2:#4f1010}.sx-entry.c-purple{--ec:#5a1d8a;--ec2:#33104f}
.sx-entry .en-art{position:absolute;right:-4%;bottom:-2%;height:72%!important;width:auto!important;filter:drop-shadow(0 0 10px #fff8);animation:enArt .45s cubic-bezier(.2,1.4,.5,1) both}
@keyframes enArt{from{transform:translateX(70%);opacity:0}}
.sx-entry .en-ttl{position:absolute;left:6%;top:20%;font-size:34px;line-height:1.05;color:#fff6df;-webkit-text-stroke:7px #2a1408;paint-order:stroke fill;text-shadow:0 0 14px #ffd84a;white-space:nowrap;animation:fzStamp .45s cubic-bezier(.2,1.6,.5,1) .15s both}
.sx-entry .en-ttl em{display:block;font-style:normal;font-size:44px;color:#ffd75e}.sx-entry .en-ttl em small{font-size:20px}
.sx-entry .en-ttl::after{content:'突入！';display:block;font-size:22px;color:#ffd75e;margin-top:4px}
.sx-entry .en-sub{position:absolute;left:6%;right:40%;bottom:12%;font-size:13px;line-height:1.3;color:#fff;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill;animation:enArt .4s ease-out .4s both}
/* 対決画面（コマ VS 相手） */
.sx-vs{position:absolute;inset:0;z-index:26;pointer-events:none;display:none;overflow:hidden}
.sx-vs.on{display:block}
.vs-l,.vs-r{position:absolute;top:0;bottom:0;width:60%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.vs-l{left:0;background:linear-gradient(110deg,#a82a14 0 80%,transparent 80%);clip-path:polygon(0 0,100% 0,72% 100%,0 100%);animation:vsL .35s ease-out both}
.vs-r{right:0;background:linear-gradient(110deg,transparent 20%,#1d2a5a 20%);clip-path:polygon(28% 0,100% 0,100% 100%,0 100%);animation:vsR .35s ease-out both}
@keyframes vsL{from{transform:translateX(-100%)}}@keyframes vsR{from{transform:translateX(100%)}}
.vs-l img,.vs-r img{height:58%!important;width:auto!important;filter:drop-shadow(0 0 8px #0008)}
.vs-l img{margin-right:24%}.vs-r img{margin-left:24%}
.vs-l b,.vs-r b{font-size:16px;color:#fff;-webkit-text-stroke:4px #1a0c06;paint-order:stroke fill;white-space:nowrap}
.vs-l b{margin-right:24%}.vs-r b{margin-left:24%}
.vs-mark{position:absolute;left:50%;top:50%;translate:-50% -50%;font-style:normal;font-size:56px;font-weight:900;color:#ffd75e;-webkit-text-stroke:8px #2a1408;paint-order:stroke fill;text-shadow:0 0 18px #fff;animation:fzStamp .4s cubic-bezier(.2,1.6,.5,1) .3s both}
/* 関所の門が見えた（番人はまだ出ない） */
.sx-lcd.pk-noenemy .sx-mon,.sx-lcd.pk-noenemy .pk-pl.pe,.sx-lcd.pk-noenemy .pk-pad.pe{visibility:hidden}
/* 疾走ゾーン：正面から走ってくるコマ（art/stand/koma_run1〜4） */
.sx-run{display:none}
.sx-lcd.m-normal.dash .sx-run{display:block;position:absolute;left:50%;bottom:4%;height:56%;aspect-ratio:1;translate:-50% 0;z-index:2;pointer-events:none;animation:runBob .22s ease-in-out infinite alternate}
@keyframes runBob{to{transform:translateY(-4%)}}
.sx-run img{position:absolute;inset:0;width:100%!important;height:100%!important;visibility:hidden!important}
.sx-run img.on{visibility:visible!important}
.sx-lcd.dash .sx-walk{display:none!important}
/* 2026-10-24 ユーザー：疾走ゾーンは専用の背景（奥へ伸びる一本道）と、上に大きく「疾走ゾーン」 */
.sx-dashbg,.sx-dashttl{display:none}
.sx-lcd.dash .sx-road{display:none!important}
.sx-lcd.dash .sx-dashbg{display:block;position:absolute;inset:0;z-index:1;overflow:hidden;background:url(art/slot/dash_bg.jpg) center 40%/cover no-repeat;animation:dashZoom 1.1s linear infinite}
/* 景色がこちらへ流れてくる：消失点を中心に少しずつ拡大して戻す */
@keyframes dashZoom{from{background-size:auto 100%}to{background-size:auto 116%}}
.sx-lcd.dash .sx-speed{display:block!important;background:repeating-conic-gradient(from 0deg at 50% 38%,transparent 0 5deg,#ffffff2e 5deg 6deg,transparent 6deg 13deg)!important;animation:dashRay .3s linear infinite!important;-webkit-mask:radial-gradient(circle at 50% 38%,transparent 0 22%,#000 60%)!important;mask:radial-gradient(circle at 50% 38%,transparent 0 22%,#000 60%)!important}
@keyframes dashRay{to{rotate:4deg}}
.sx-lcd.dash .sx-dashttl{display:block;position:absolute;left:0;right:0;top:20px;z-index:8;text-align:center;font-size:34px;line-height:1;color:#ffe36a;-webkit-text-stroke:7px #3a1a00;paint-order:stroke fill;text-shadow:0 3px 0 #3a1a00,0 0 16px #ffb43a;letter-spacing:.06em;animation:dashTtl .6s ease-in-out infinite alternate}
@keyframes dashTtl{to{transform:scale(1.06)}}
.sx-lcd.dash .sx-dash.on{top:64px;left:50%;translate:-50% 0}
.sx-lcd.dash .sx-dashpop{top:100px;left:50%;translate:-50% 0;text-align:center}
.sx-lcd.dash .sx-stage{display:none}
.sx-lcd.dash .sx-dashbg{background-position:50% 42%}
.sx-lcd.dash .sx-speed{-webkit-mask:radial-gradient(circle at 50% 42%,transparent 0 18%,#000 60%)!important;mask:radial-gradient(circle at 50% 42%,transparent 0 18%,#000 60%)!important;background:repeating-conic-gradient(from 0deg at 50% 42%,transparent 0 5deg,#ffffff30 5deg 6deg,transparent 6deg 13deg)!important}
.sx-lcd.dash .sx-talk,.sx-lcd.dash .sx-chara{display:none!important}
/* 疾走ゾーンの背景：3枚の同じ絵を、消失点から少しずつ大きくしながら重ね送りして、ずっと前へ進み続けて見せる */
.sx-lcd.dash .sx-dashbg{background:none!important;animation:none!important}
.sx-dashbg i{position:absolute;inset:0;background:url(art/slot/dash_bg.jpg) 50% 42%/cover no-repeat;transform-origin:50% 42%;opacity:0;animation:dashFly 2.1s linear infinite}
.sx-dashbg i:nth-child(2){animation-delay:-.7s}.sx-dashbg i:nth-child(3){animation-delay:-1.4s}
@keyframes dashFly{0%{transform:scale(1);opacity:0}12%{opacity:1}75%{opacity:1}100%{transform:scale(1.9);opacity:0}}
.sx-dashbg::before{content:'';position:absolute;inset:0;background:url(art/slot/dash_bg.jpg) 50% 42%/cover no-repeat}
.sx-lcd.dash .sx-dashttl{animation:none!important}
/* ゾーン中は仲間キャラ・吹き出しを出さない（台を開いた時のあいさつも） */
.sx-lcd:not(.m-normal) .sx-talk,.sx-lcd:not(.m-normal) .sx-chara{display:none!important}
/* 疾走ゾーン中のレア役：弱＝少し速く・線が増える、強＝さらに速く・金の線・画面のふちが光る */
.sx.dash-w .sx-lcd.dash .sx-dashbg i{animation-duration:1.3s}
.sx.dash-w .sx-lcd.dash .sx-speed{background:repeating-conic-gradient(from 0deg at 50% 42%,transparent 0 3deg,#ffffff55 3deg 4.5deg,transparent 4.5deg 8deg)!important;animation-duration:.18s!important}
.sx.dash-s .sx-lcd.dash .sx-dashbg i{animation-duration:.75s}
.sx.dash-s .sx-lcd.dash .sx-speed{background:repeating-conic-gradient(from 0deg at 50% 42%,transparent 0 2deg,#ffe36a99 2deg 4deg,transparent 4deg 6deg)!important;animation-duration:.1s!important}
.sx.dash-s .sx-lcd.dash::before{content:'';position:absolute;inset:0;z-index:7;pointer-events:none;box-shadow:inset 0 0 40px 14px #ffd84acc;animation:dashGlow .35s ease-in-out infinite alternate}
@keyframes dashGlow{from{opacity:.5}to{opacity:1}}
.sx.dash-s .sx-lcd.dash .sx-run{animation-duration:.12s}
/* 「！」は主人公の頭の真上（絵の頭は横55%・一番上） */
.sx-lcd.stop .sx-walk::after{left:55%;top:auto;bottom:99%;translate:-50% 0;line-height:1}
/* 2026-10-24 ART中：背景は横に流れ続ける（液晶いっぱい）、主人公は真ん中で横向きに走る。水玉・白い線・古いコマは出さない */
.sx-artroad,.sx-srun{display:none}
.sx-lcd.m-art .sx-artroad{display:block;position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.sx-lcd.m-art .sx-artroad .rd-strip{height:100%;animation:rdRun 9s linear infinite}
.sx-lcd.m-art .sx-artroad .rd-strip i{background-image:url(art/bg/slot_rush.jpg)}
.sx-lcd.m-art .sx-bg{visibility:hidden}
.sx-lcd.m-art .sx-scene,.sx-lcd.m-art .sx-act .hero,.sx-lcd.m-art .sx-act .speed{display:none!important}
.sx-lcd.m-art .sx-srun{display:block;position:absolute;left:50%;bottom:6%;height:50%;aspect-ratio:1;translate:-50% 0;z-index:2;pointer-events:none;animation:runBob .16s ease-in-out infinite alternate}
.sx-srun img{position:absolute;inset:0;width:100%!important;height:100%!important;visibility:hidden!important}
.sx-srun img.on{visibility:visible!important}
/* 残りゲーム数は上に大きく */
.sx-lcd.m-art .sx-mode{display:flex;align-items:baseline;gap:6px;justify-content:center;top:20px!important;left:0!important;right:0!important;background:none!important}
.sx-lcd.m-art .sx-mode b.art{font-size:16px;padding:2px 10px}
.sx-lcd.m-art .sx-mode em{font-size:40px;font-style:normal;color:#ffe36a;-webkit-text-stroke:7px #3a1a00;paint-order:stroke fill;text-shadow:0 3px 0 #3a1a00}
/* 突入画面・勝ち負けの場面の上にも、押し順ナビと大きな告知は出す */
#sl-host .sx-navi{z-index:29!important}
#sl-host .sx-big{z-index:30}
.sx-entry.c-gold{--ec:#a8781a;--ec2:#5a3a08}.sx-entry.c-ash{--ec:#3a3a44;--ec2:#22222a}
.sx-entry.res-lose .en-bg{animation-duration:30s}
.sx-entry.res-lose .en-ttl{color:#d8d8e8;text-shadow:none}
.sx-entry.res-win .en-ttl::after,.sx-entry.res-lose .en-ttl::after{content:none}
/* 7を狙え：専用の画面（専用の背景 art/slot/aim_bg.jpg） */
.sx-aim{display:none}
.sx-lcd.aim7 .sx-aim{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;position:absolute;inset:0;z-index:24;background:url(art/slot/aim_bg.jpg) center/cover no-repeat,radial-gradient(circle at 50% 45%,#ff6a2a,#5a0a08 75%)}
.sx-aim .aim-t{font-size:40px;line-height:1.1;color:#ff4a2a;-webkit-text-stroke:8px #2a0a00;paint-order:stroke fill;text-shadow:0 0 18px #ffb43a;text-align:center;animation:fzStamp .5s cubic-bezier(.2,1.6,.5,1) both}
.sx-aim .aim-t .w7{font-style:normal;color:#eaf6ff;-webkit-text-stroke:8px #10204f}
.sx-aim small{font-size:24px;color:#fff6df;-webkit-text-stroke:5px #2a0a00;paint-order:stroke fill}
.sx-lcd.aim7 .sx-walk,.sx-lcd.aim7 .sx-talk,.sx-lcd.aim7 .sx-chara,.sx-lcd.aim7 .sx-stage{display:none!important}
/* ボス戦の敵：ポケモンの配置（右上の奥）。絵の大きさに関係なく同じ枠に収める */
.sx-lcd.pk .sx-mon{width:44%!important;height:44%!important;right:5%!important;top:7%!important;display:flex!important;align-items:flex-end;justify-content:center}
.sx-lcd.pk .sx-mon img{width:100%!important;height:100%!important;object-fit:contain;object-position:center bottom}
.pk-pad.pe{right:2%;top:40%;width:50%;height:12%}
/* ART中の走り：もっと必死に（速く・前のめり・上下に大きく弾む） */
.sx-lcd.m-art .sx-srun{animation:srunBob .12s ease-in-out infinite alternate}
@keyframes srunBob{from{transform:rotate(-7deg) translateY(0)}to{transform:rotate(-9deg) translateY(-7%)}}
.sx-lcd.m-art .sx-srun::after{content:'';position:absolute;left:-30%;right:70%;top:30%;bottom:20%;background:repeating-linear-gradient(0deg,transparent 0 9px,#ffffff70 9px 11px,transparent 11px 22px);-webkit-mask:linear-gradient(90deg,transparent,#000);mask:linear-gradient(90deg,transparent,#000);animation:spdRun .2s linear infinite}
.sx-lcd.m-art .sx-artroad .rd-strip{animation-duration:5s}
.sx-aim .aim-t{display:flex;gap:4px;-webkit-text-stroke:0}
.sx-aim .aim-t img{width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 0 10px #ffd84a) drop-shadow(0 3px 0 #2a0a00);animation:aimPulse .7s ease-in-out infinite alternate}
.sx-aim .aim-t img:nth-child(2){animation-delay:.12s}.sx-aim .aim-t img:nth-child(3){animation-delay:.24s}
@keyframes aimPulse{to{transform:scale(1.08)}}
.sx-aim small{font-size:28px}
/* ART中の左上：題字とゲーム数（絵） */
.sx-lcd.m-art .sx-mode{justify-content:flex-start!important;align-items:center!important;left:20px!important;right:auto!important;top:18px!important;gap:4px!important;flex-direction:column;align-items:flex-start!important}
.sx-mode .rush-ttl{height:34px;width:auto;filter:drop-shadow(0 2px 0 #2a1408)}
.sx-mode .rush-num{display:flex;margin-left:6px}
.sx-mode .rush-num .rn{display:block;width:27px;height:32px;background:url(art/slot/rush_num.png) calc(var(--n) * -27px) 0/297px 32px no-repeat;margin-right:-3px}
.sx-mode .rush-num .rn:last-child{width:22px;height:24px;background-size:242px 24px;background-position:calc(var(--n) * -22px) 0;align-self:flex-end;margin-left:2px}
/* 2026-10-24 ユーザー：狙えの図柄を大きくしたり小さくしたりしない（安っぽい） */
.sx-aim .aim-t img{animation:none!important}
.sx-aim .aim-t{animation:none!important}
/* 狙え：左に叫ぶコマ（肩から上）、右に図柄と「を狙え！」（どちらもチャッピーの絵） */
.sx-lcd.aim7 .sx-aim{flex-direction:row;justify-content:flex-start;gap:0;padding:0}
.sx-aim .aim-koma{position:absolute;left:-2%;bottom:0;height:92%!important;width:auto!important;z-index:2;filter:drop-shadow(0 0 10px #ffb43a)}
.sx-aim .aim-r{position:absolute;left:38%;right:3%;top:8%;bottom:8%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;z-index:3}
.sx-aim .aim-t img{width:74px;height:74px}
.sx-aim .aim-moji{width:100%;height:auto;max-height:55%;object-fit:contain;filter:drop-shadow(0 3px 0 #2a0a00)}
/* 前のめりは絵で描いたので、回転はやめて上下の弾みだけ */
@keyframes srunBob{from{transform:translateY(0)}to{transform:translateY(-6%)}}
/* 2026-10-24 ユーザー：ボーナス中、大物の攻撃にも動き・コマに被弾。次の大物は奥から現れる */
.sx-lcd.pk .sx-mon.mwind img{animation:monWind .38s ease-out both}
@keyframes monWind{100%{transform:translate(10%,-6%) scale(.92)}}
.sx-lcd.pk .sx-mon.matk-fist img{animation:monLunge .9s cubic-bezier(.3,1.6,.5,1) both}
.sx-lcd.pk .sx-mon.matk-charge img{animation:monCharge .9s cubic-bezier(.5,0,.4,1) both}
.sx-lcd.pk .sx-mon.matk-needle img{animation:monShake .6s steps(6) both}
@keyframes monLunge{0%{transform:translate(10%,-6%) scale(.92)}22%{transform:translate(-75%,45%) scale(1.35)}45%{transform:translate(-70%,42%) scale(1.3)}100%{transform:none}}
@keyframes monCharge{0%{transform:translate(10%,-6%) scale(.92)}25%{transform:translate(-110%,60%) scale(1.5)}40%{transform:translate(-100%,55%) scale(1.45);filter:brightness(1.6)}100%{transform:none}}
@keyframes monShake{0%,100%{transform:none}50%{transform:scale(1.12)}25%,75%{transform:translateX(-4%) scale(1.1)}}
.sx-lcd.pk .pk-hero.phit{animation:pkHit .8s linear both!important}
@keyframes pkHit{0%{transform:none}10%{transform:translate(-14%,6%) rotate(-6deg);filter:brightness(4) saturate(0)}20%{opacity:.25}30%{opacity:1;filter:sepia(1) saturate(6) hue-rotate(-30deg)}40%{opacity:.25}50%{opacity:1;filter:none}60%{opacity:.4}70%{opacity:1;transform:translate(-6%,3%)}100%{transform:none}}
.sx-lcd.pk .pk-hero.pslash{animation:pkSlash .36s ease-out!important}
@keyframes pkSlash{40%{transform:translate(18%,-10%) scale(1.06)}100%{transform:none}}
.sx-act .mimpact{position:absolute;left:12%;bottom:18%;width:34%;aspect-ratio:1;z-index:8;pointer-events:none;
 background:radial-gradient(circle,#fff 0 18%,#ffd23a 19% 30%,transparent 31%),conic-gradient(from 10deg,#fff 0 6%,transparent 6% 14%,#ff7a1a 14% 19%,transparent 19% 30%,#fff 30% 35%,transparent 35% 46%,#ff7a1a 46% 51%,transparent 51% 63%,#fff 63% 68%,transparent 68% 80%,#ff7a1a 80% 85%,transparent 85%);
 -webkit-mask:radial-gradient(circle,#000 55%,transparent 70%);mask:radial-gradient(circle,#000 55%,transparent 70%);animation:mImp .45s ease-out both}
.sx-act .mimpact.big{width:46%;left:6%}.sx-act .mimpact.small{width:24%;left:18%;bottom:24%}
@keyframes mImp{0%{transform:scale(.2);opacity:1}60%{opacity:1}100%{transform:scale(1.3);opacity:0}}
.sx-act .needle{position:absolute;right:30%;top:30%;width:22%;height:4px;z-index:8;background:linear-gradient(90deg,#fff,#ddd 60%,#555);box-shadow:0 0 4px #000;transform-origin:left center;animation:needleFly .3s ease-in both}
.sx-act .needle.n1{--dx:-160%;--dy:180%;transform:rotate(-38deg)}.sx-act .needle.n2{--dx:-150%;--dy:220%;top:34%;animation-delay:.05s}
.sx-act .needle.n3{--dx:-175%;--dy:200%;top:26%;animation-delay:.1s}.sx-act .needle.n4{--dx:-140%;--dy:240%;top:38%;animation-delay:.14s}
@keyframes needleFly{0%{translate:0 0;opacity:1;rotate:-35deg}90%{opacity:1}100%{translate:calc(var(--dx)*1.4) calc(var(--dy)*6);opacity:0;rotate:-35deg}}
.sx-lcd.pk .sx-mon.enter img{animation:monEnter 1.3s ease-out both}
@keyframes monEnter{0%{transform:translateY(-8%) scale(.35);filter:brightness(0);opacity:0}35%{opacity:1;filter:brightness(0)}70%{transform:scale(1.05);filter:brightness(0)}78%{filter:brightness(3)}100%{transform:none;filter:none}}
.sx-lcd.pk .pk-hero{z-index:6}.sx-lcd.pk .sx-act{z-index:7}
@keyframes monCharge{0%{transform:translate(10%,-6%) scale(.92)}25%{transform:translate(-62%,38%) scale(1.25)}40%{transform:translate(-56%,34%) scale(1.22);filter:brightness(1.6)}100%{transform:none}}
@keyframes monLunge{0%{transform:translate(10%,-6%) scale(.92)}22%{transform:translate(-50%,32%) scale(1.2)}45%{transform:translate(-46%,30%) scale(1.18)}100%{transform:none}}
/* 2026-10-24 ユーザー：撃破・突入の画面の背景を回さない。うしろの画面も透けさせない */
.sx-entry.on{background:var(--ec2,#1a120c)}
.sx-entry .en-bg,.sx-entry.res-lose .en-bg{animation:none!important;inset:0;background:radial-gradient(ellipse at 50% 55%,var(--ec) 0 30%,var(--ec2) 85%)}
/* 2026-10-24 ユーザー：「倒した！」の画面がさみしい → 戦った場所を背に、倒れた大物と勝ちほこるコマ。PUSHで上乗せ */
.sx-entry.res-kill .en-bg{background:radial-gradient(ellipse at 70% 60%,#ffd86a88 0 18%,transparent 55%),linear-gradient(#0000 40%,#000a),url(art/slot/battle_bg.jpg) center/cover!important}
.sx-entry.res-kill .en-foe{position:absolute;left:-6%;bottom:2%;width:58%!important;height:auto!important;transform:rotate(-14deg);transform-origin:50% 100%;filter:brightness(.55) saturate(.5) drop-shadow(0 6px 0 #0006);animation:enFoe .7s ease-in both}
@keyframes enFoe{0%{transform:rotate(0);filter:brightness(1.2)}100%{transform:rotate(-14deg);filter:brightness(.55) saturate(.5)}}
.sx-entry.res-kill .en-ttl{top:8%}
.sx-push.on{z-index:45}
/* 2026-10-24 ユーザー：PUSHはもっと大きく、ど真ん中に */
.sx-push.on{right:auto!important;bottom:auto!important;left:50%!important;top:50%!important;width:46%!important;height:auto!important;aspect-ratio:1;max-width:220px;transform:translate(-50%,-50%);animation:pushBig .5s ease-in-out infinite alternate!important}
@keyframes pushBig{from{transform:translate(-50%,-50%) scale(.94)}to{transform:translate(-50%,-50%) scale(1.04)}}
/* 2026-10-24 ボーナス告知の画面（チャッピーの絵）。虹は暗転のためから */
.sx-kk{position:absolute;inset:0;z-index:27;display:none;overflow:hidden;background:#000;pointer-events:none}
.sx-kk.on{display:block}
.sx-kk .kk-bg{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover}
.sx-kk.dark .kk-bg{filter:brightness(.14) saturate(.3);animation:kkStorm 1.6s steps(1) both}
@keyframes kkStorm{0%{filter:brightness(.1) saturate(.2)}38%{filter:brightness(.55) saturate(.4)}42%{filter:brightness(.12) saturate(.2)}70%{filter:brightness(.7) saturate(.5)}74%,100%{filter:brightness(.16) saturate(.3)}}
.sx-kk.rb .kk-bg{animation:kkReveal .6s ease-out both}
@keyframes kkReveal{0%{filter:brightness(3);transform:scale(1.15)}100%{filter:none;transform:none}}
.sx-kk .kk-t1{position:absolute;left:4%;width:92%!important;height:auto!important;top:6%;animation:kkStamp .45s cubic-bezier(.2,1.6,.5,1) .25s both}
.sx-kk .kk-t2{position:absolute;left:6%;width:88%!important;height:auto!important;bottom:6%;animation:kkStamp .45s cubic-bezier(.2,1.6,.5,1) .7s both}
.sx-kk .kk-t2.solo{bottom:auto;top:30%;animation-delay:.1s}
.sx-kk.red .kk-bg{filter:brightness(.55) sepia(.5) saturate(2.2) hue-rotate(-20deg)}
@keyframes kkStamp{0%{transform:scale(2.4);opacity:0}100%{transform:none;opacity:1}}
/* 2026-10-24 ユーザー：大物の技の名前は、敵のHPバーの下に */
.pk-fsay{position:absolute;left:0;top:calc(100% + 4px);font-size:17px;line-height:1.1;color:#ffb0a0;-webkit-text-stroke:5px #2a1408;paint-order:stroke fill;white-space:nowrap;opacity:0;pointer-events:none}
.pk-fsay.on{opacity:1;animation:pkSay .35s ease-out}
/* 2026-10-24 ユーザー：「狙え」は7をもっと大きく、すきまなし。コマは左下 */
.sx-aim .aim-koma{left:-4%!important;bottom:0!important;height:52%!important;z-index:4}
.sx-aim .aim-r{left:0!important;right:0!important;top:5%!important;bottom:4%!important;justify-content:flex-start!important;gap:2%!important}
.sx-aim .aim-t{width:100%;justify-content:center;gap:0!important}
.sx-aim .aim-t img{width:34%!important;height:auto!important;aspect-ratio:1;margin:0 -1.5%}
.sx-aim .aim-moji{width:66%!important;align-self:flex-end;margin-right:2%;margin-top:auto;max-height:40%!important}
.sx-aim .aim-r{z-index:5!important}
.sx-aim .aim-moji{margin-top:0!important;width:72%!important;max-height:34%!important;align-self:flex-end}
.sx-aim .aim-koma{height:48%!important;left:-6%!important}
/* 2026-10-24 上乗せ演出（チャッピーの絵） */
.sx-upfx.v2{background:#000;overflow:hidden}
.sx-upfx.v2 .up-pz{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;transform:scale(.55);filter:brightness(.25) saturate(.6);transition:transform .4s ease-in,filter .4s}
.sx-upfx.v2.wind .up-pz{transform:scale(.48) translateY(3%);filter:brightness(.4)}
.sx-upfx.v2.punch .up-pz{transform:scale(1.35);filter:brightness(1.4);transition:transform .17s cubic-bezier(.6,0,1,.6),filter .17s}
.sx-upfx.v2.hit .up-pz{transform:scale(1.05);filter:none;transition:transform .35s cubic-bezier(.2,1.6,.5,1)}
.sx-upfx.v2 .up-moji{position:absolute;left:8%;width:84%!important;height:auto!important;top:4%;animation:kkStamp .35s cubic-bezier(.2,1.6,.5,1) both;filter:drop-shadow(0 4px 0 #000a)}
.sx-upfx.v2 .up-plate{position:absolute;left:4%;width:92%!important;height:auto!important;bottom:6%;animation:kkStamp .4s cubic-bezier(.2,1.6,.5,1) .12s both;filter:drop-shadow(0 4px 0 #000a)}
.sx-upfx.v2 .up-plate.txt{display:flex;align-items:center;justify-content:center;font-size:64px;color:#ffd84a;-webkit-text-stroke:8px #3a1404;paint-order:stroke fill}
.sx-upfx.v2 .up-plate.txt img{height:56px;width:auto}
.sx-upfx.v2.out{opacity:0;transition:opacity .25s}
.sx-upfx.v2{z-index:28}
/* 2026-10-24 ユーザー：上乗せは「+50G」の形で */
.sx-upfx.v2 .up-num{position:absolute;left:1%;right:1%;bottom:6%;display:flex;align-items:center;justify-content:center;animation:kkStamp .4s cubic-bezier(.2,1.6,.5,1) .12s both}
.sx-upfx.v2 .up-num .up-pl{width:20%!important;height:auto!important;margin-right:-3%;filter:drop-shadow(0 4px 0 #000a);position:relative;z-index:1}
.sx-upfx.v2 .up-num .up-plate{position:static;width:80%!important;animation:none}
.sx-upfx.v2 .up-num .up-pl{width:17%!important;margin-right:-1%}
/* 2026-10-24 上乗せ＝押忍!番長2の形：炎の背景に画面いっぱいの「+数字」と GET!! */
.sx-upfx.v2.num{background:#000}
.sx-upfx.v2.num .up-bg{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;animation:upBgIn .25s ease-out both}
@keyframes upBgIn{0%{filter:brightness(3);transform:scale(1.2)}100%{filter:none;transform:none}}
.sx-upfx.v2.num .up-num{left:-2%;right:-2%;top:18%;bottom:auto;gap:0;animation:upNumIn .35s cubic-bezier(.2,1.7,.5,1) both}
@keyframes upNumIn{0%{transform:scale(3);opacity:0}100%{transform:none;opacity:1}}
.sx-upfx.v2.num .up-num .up-pl{width:22%!important;margin-right:-6%!important}
.sx-upfx.v2.num .up-num .up-plate{width:90%!important;margin-left:0}
.sx-upfx.v2.num .up-get{position:absolute;left:22%;width:56%!important;height:auto!important;bottom:10%;animation:kkStamp .35s cubic-bezier(.2,1.6,.5,1) .25s both;filter:drop-shadow(0 4px 0 #000a)}
.sx-upfx.v2.num .up-moji{display:none}
/* 2026-10-24 結果は絵と文字で1ゲーム：逃げられた（大物が背を向けて去る）・文字の絵の見出し */
.sx-entry.res-flee .en-bg{background:linear-gradient(#0000 40%,#000c),url(art/slot/battle_bg.jpg) center/cover!important;filter:saturate(.4) brightness(.7)}
.sx-entry.res-flee .en-foe{position:absolute;left:4%;top:24%;width:44%!important;height:auto!important;animation:enFlee 1.6s ease-in both}
@keyframes enFlee{0%{transform:none;opacity:1}100%{transform:translate(-30%,-12%) scale(.55) scaleX(-1);opacity:.25}}
.sx-entry .en-ttl img.en-moji{display:block;width:min(70vw,300px);height:auto}
.sx-upfx.v2.num .up-num{left:-16%;right:-12%;top:12%;justify-content:center}
.sx-upfx.v2.num .up-num .up-pl{width:21%!important;margin-right:-15%!important;z-index:2}
.sx-upfx.v2.num .up-num .up-plate{width:112%!important;max-width:none}
.sx-upfx.v2.num .up-get{left:12%;width:76%!important;bottom:7%}
.sx-upfx.v2.num .up-num{left:0;right:0;top:13%;display:block;height:auto}
.sx-upfx.v2.num .up-num .up-plate{display:block;width:108%!important;margin-left:-4%}
.sx-upfx.v2.num .up-num .up-pl{position:absolute;left:0;top:50%;width:16%!important;margin:0!important;transform:translateY(-50%)}
.sx-upfx.v2.num .up-num{top:20%}
/* 2026-10-24 ユーザー：ボーナスがそろったら画面いっぱいのボーナス画面（次のゲームまで） */
.sx-entry.res-bonus .en-bg{background:url(art/slot/up_bg.jpg) center/cover!important}
.sx-entry.res-bonus .en-ttl{left:0;right:0;top:8%;display:flex;justify-content:center;animation:kkStamp .45s cubic-bezier(.2,1.6,.5,1) .1s both}
.sx-entry.res-bonus .en-ttl img.en-logo{width:94%;max-width:420px;height:auto;filter:drop-shadow(0 6px 0 #000a)}
.sx-entry.res-bonus .en-art{right:-6%;height:62%!important}
.sx-entry.res-bonus .en-ttl{flex-direction:column;align-items:center;top:5%}
.sx-entry.res-bonus .en-ttl img.en-bonus{width:72%;max-width:320px;height:auto;margin-top:-4%;filter:drop-shadow(0 5px 0 #000a)}
/* 横長の画面（パソコン）でもはみ出さない：幅と高さの両方に合わせる */
.sx-entry.res-bonus .en-ttl{top:4%;bottom:6%;height:auto;justify-content:center}
.sx-entry.res-bonus .en-ttl img.en-logo{width:auto;max-width:94%;max-height:56%;object-fit:contain}
.sx-entry.res-bonus .en-ttl img.en-bonus{width:auto;max-width:72%;max-height:34%;object-fit:contain}
/* 2026-10-24 ユーザー：ボス戦のダメージは敵の体の近く */
.sx-lcd.pk .sx-mon .sx-dmg.pk-d{display:block!important;position:absolute;left:-10%;right:-10%;top:38%;z-index:4;text-align:center;font:900 22px/1 "RocknRoll One",sans-serif;color:#fff;-webkit-text-stroke:5px #7a1006;paint-order:stroke fill;text-shadow:0 3px 0 #000;white-space:nowrap;opacity:0;pointer-events:none}
.sx-lcd.pk .sx-mon .sx-dmg.pk-d.on{animation:pkDmg 1.6s ease-out forwards}
@keyframes pkDmg{0%{opacity:0;transform:scale(2)}12%{opacity:1;transform:scale(.95)}20%{transform:none}75%{opacity:1;transform:translateY(-10%)}100%{opacity:0;transform:translateY(-35%)}}
/* 2026-10-24 ユーザー：HPが0になるゲーム（よろめいて膝をつく）→ 次のゲームで大きく「撃破！」 */
.sx-lcd.pk .sx-mon.hp0 img{animation:monHp0 1s ease-out forwards}
@keyframes monHp0{0%,20%,40%{filter:brightness(3) saturate(0)}10%,30%{filter:none}60%{transform:translateX(-3%) rotate(-3deg)}100%{transform:translateY(6%) rotate(-6deg) scale(.96);filter:brightness(.65) saturate(.6)}}
.sx-big.logo.gekiha img{width:min(100%,460px)!important}
.sx-big.logo.gekiha img{height:auto!important;max-height:none!important;object-fit:contain}
/* 横長の画面（パソコン）でも切れない：文字の絵は幅と高さの両方に合わせる */
.sx-big.logo img,.sx-big.logo.gekiha img{width:auto!important;max-width:min(100%,460px)!important;height:auto!important;max-height:86%!important;object-fit:contain}
/* 2026-10-24 ユーザー「これなに」：雷獣バトルの勝利保証。敵の札に重ねず右上へ、ほかの札と同じ漆の札で */
.sx-ticket:empty{display:none}
.sx-ticket{left:auto!important;right:8px!important;top:8px!important;z-index:8;display:flex;align-items:baseline;gap:3px;padding:2px 8px 4px;border:0;border-style:solid;border-width:6px 10px;border-image:url(art/ui/mat/lacquer.png) 50 60 50 60 fill/6px 10px stretch;color:#fff6df;font-size:12px;line-height:1}
.sx-ticket small{font-size:10px;color:#ffd84a}
.sx-ticket b{background:none!important;color:#fff6df!important;padding:0!important;border-radius:0!important;margin:0!important}
.sx-ticket em{font-style:normal;color:#ffd84a;font-size:14px}
/* 2026-10-24 ユーザー：大物の登場シーン（1ゲーム） */
.sx-entry.res-intro .en-bg{background:radial-gradient(ellipse at 50% 45%,#0000 30%,#3a0806cc 85%),linear-gradient(#0000 55%,#000a),url(art/slot/battle_bg.jpg) center/cover!important}
.sx-entry.res-intro .en-foe{position:absolute;left:14%;top:16%;width:72%!important;height:auto!important;max-height:62%;object-fit:contain;animation:inFoe 1.1s ease-out both;filter:drop-shadow(0 8px 0 #0008)}
@keyframes inFoe{0%{transform:scale(.4) translateY(-10%);filter:brightness(0);opacity:0}45%{opacity:1;filter:brightness(0)}70%{transform:scale(1.08);filter:brightness(2.5)}100%{transform:none;filter:drop-shadow(0 8px 0 #0008)}}
.sx-entry.res-intro .en-art{left:-6%;right:auto;bottom:-14%;height:46%!important;animation:inKoma .5s ease-out .6s both}
@keyframes inKoma{0%{transform:translateX(-40%);opacity:0}100%{transform:none;opacity:1}}
.sx-entry.res-intro .en-ttl{left:0;right:0;top:3%;display:flex;flex-direction:column;align-items:center;font-size:30px;line-height:1.05;white-space:normal;text-align:center;animation:kkStamp .4s cubic-bezier(.2,1.6,.5,1) .9s both}
.sx-entry.res-intro .en-ttl::after{content:none}
.sx-entry.res-intro .in-no{font-size:15px;color:#ffd84a;-webkit-text-stroke:4px #2a1408}
.sx-entry.res-intro .in-ap{font-size:18px;color:#fff6df}
/* 2026-10-24 ユーザー：停止ボタンを押しても枠の大きさは変えない（実機と同じく、押したボタンはランプが消えるだけ） */
.sx-stop.pressed{transform:none!important;box-shadow:none;filter:brightness(.5) saturate(.6)!important}
.sx-stop:active{transform:none!important}
/* 2026-10-24 ユーザー「ボタンが暗い」：押したボタンは暗くせず、消灯（白）に戻すだけ */
.sx-stop.pressed{filter:drop-shadow(0 3px 0 #0008)!important;background-image:url(art/slot/btn_stop2_white.png)!important}
/* 2026-10-24 使い道のはんこ（右上に小さく） */
.hanko{position:absolute;top:3px;right:3px;width:24px;height:24px;z-index:3;pointer-events:none;transform:rotate(-8deg)}
.hanko img{width:100%;height:100%;object-fit:contain;display:block}
.it-card,.bag-row,.cs-stand{position:relative}
/* はんこはまわりの絵の決まりに影響されない */
i.hanko{all:unset;position:absolute!important;top:3px!important;right:3px!important;width:26px!important;height:26px!important;z-index:3!important;pointer-events:none;transform:rotate(-8deg);display:block!important}
i.hanko img{all:unset;display:block!important;width:100%!important;height:100%!important;object-fit:contain}
.bag-row i.hanko{position:relative!important;top:-1px!important;right:auto!important;display:inline-block!important;vertical-align:middle;width:22px!important;height:22px!important;margin-left:4px}
.bag-row .bag-n2{font-style:normal;display:flex;align-items:center}
i.hanko{background:url(art/ui/hanko.png) 0 0/700% 100% no-repeat!important;background-position-x:calc(var(--hx) * 100% / 6)!important}
/* 2026-10-24 持ち物：3列の小さな札 */
.bag-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0 10px}
.bag-t{position:relative;display:flex;flex-direction:column;align-items:center;padding:6px 4px 5px;background:#fbf1dc;border:2px solid #5a3a22;box-shadow:inset 0 0 0 2px #fff6e4}
.bag-t .bag-ic{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 2px 0 #0004)}
.bag-t.kuzu .bag-ic{filter:grayscale(.8) brightness(.9);transform:scale(.75)}
.bag-t .bag-v{font-size:17px;line-height:1.1;color:#2a1408;margin-top:2px}
.bag-t .bag-nm{font-size:11px;color:#5a3a22;font-weight:800;text-align:center;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bag-t i.hanko{top:2px!important;right:2px!important;width:22px!important;height:22px!important}
.bag-t.r2{background:#fff0d0}.bag-t.r3{background:#ffe8b8;border-color:#a8781a}
.bag-grid{grid-template-columns:repeat(4,1fr);gap:5px}
.bag-t{padding:5px 2px 4px}
.bag-t .bag-ic{width:38px;height:38px}
.bag-t .bag-v{font-size:15px}
.bag-t .bag-nm{font-size:10px}
.bag-t i.hanko{width:19px!important;height:19px!important}
/* 2026-10-24 景品の交換：いくつ交換するか */
.cs-qty .csq-top{display:flex;align-items:center;gap:10px;margin:4px 0 8px}
.cs-qty .csq-top .cs-stand{position:relative;flex:0 0 72px;height:72px;display:flex;align-items:center;justify-content:center}
.cs-qty .csq-top .cs-stand img{max-width:64px;max-height:64px}
.cs-qty .csq-top p{margin:0;font-size:13px;line-height:1.4;color:#3a2410}
.cs-qty .csq-top p small{display:block;color:#b02a14;font-weight:800}
.cs-qty .csq-step{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0}
.cs-qty .csq-step b{min-width:52px;text-align:center;font-size:26px;color:#2a1408}
.cs-qty .csq-cost{display:flex;align-items:center;justify-content:center;gap:4px;font-size:22px;font-weight:900;color:#2a1408;margin:4px 0 10px}
.cs-qty .csq-cost small{font-size:12px;color:#6a4a2a}
.cs-qty .csq-cost img.ico{width:26px!important;height:26px!important}
.cs-qty .csq-step{gap:5px}.cs-qty .csq-step b{min-width:44px}
.cs-qty .csq-step .btn{white-space:nowrap;min-width:52px;padding-left:6px;padding-right:6px}
.cs-qty .csq-step{gap:3px}.cs-qty .csq-step .btn{min-width:0!important;width:52px;padding-left:2px!important;padding-right:2px!important;font-size:13px}.cs-qty .csq-step b{min-width:40px;font-size:24px}
/* 2026-10-24 ユーザー「文字と空間のバランスが悪い」：交換のポップアップを詰めて組み直す */
.cs-qty .ask-title{margin-bottom:6px}
.cs-qty .csq-top{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:8px 10px;background:#f3e2c0;border:2px solid #b08a5a}
.cs-qty .csq-pic{position:relative;flex:0 0 76px;height:76px;display:flex;align-items:center;justify-content:center}
.cs-qty .csq-pic>img{max-width:72px;max-height:72px;object-fit:contain;filter:drop-shadow(0 3px 0 #0004)}
.cs-qty .csq-pic i.hanko{top:-4px!important;right:-6px!important;width:26px!important;height:26px!important}
.cs-qty .csq-info{flex:1;text-align:left}
.cs-qty .csq-info p{margin:0;font-size:15px;font-weight:800;color:#2a1408;line-height:1.35}
.cs-qty .csq-info small{display:block;font-size:13px;color:#b02a14;font-weight:800;margin-top:2px}
.cs-qty .csq-unit{display:flex;align-items:center;gap:2px;margin-top:4px;font-size:13px;color:#5a3a22;font-weight:800}
.cs-qty .csq-unit img.ico{width:16px!important;height:16px!important}
.cs-qty .csq-step{display:flex;align-items:center;justify-content:center;gap:4px;margin:0 0 10px}
.cs-qty .csq-step .btn{width:58px;height:44px;font-size:16px!important;font-weight:900}
.cs-qty .csq-step b{min-width:64px;height:44px;display:flex;align-items:center;justify-content:center;font-size:28px;color:#2a1408;background:#fff8e8;border:2px solid #5a3a22;box-shadow:inset 0 2px 0 #0002}
.cs-qty .csq-sum{display:flex;align-items:center;justify-content:center;gap:5px;margin:0 0 14px;font-weight:900;color:#2a1408}
.cs-qty .csq-sum span{font-size:14px}
.cs-qty .csq-sum img.ico{width:24px!important;height:24px!important}
.cs-qty .csq-sum b{font-size:24px}
.cs-qty .csq-sum small{font-size:12px;color:#6a4a2a;margin:0 4px}
.cs-qty .csq-sum .btn{height:36px;font-size:14px}
.cs-qty .btn:focus,.cs-qty .btn:focus-visible{outline:none}
.cs-qty .csq-step{gap:3px}.cs-qty .csq-step .btn{width:54px!important;height:42px;border-left-width:8px!important;border-right-width:8px!important;padding:0!important;font-size:15px!important;letter-spacing:-.5px}.cs-qty .csq-step b{min-width:46px!important;width:46px;font-size:24px}
/* 2026-10-26 ユーザー：修行のチュートリアルの吹き出しは、どの段でも同じ大きさ（1行14字・4行まで） */
.coach-say{box-sizing:border-box;height:150px;min-height:0;display:flex;flex-direction:column;align-items:flex-start}
.coach-say p{flex:1;width:100%}
.coach-say small{align-self:flex-end;margin-top:0}
/* 見せるだけの所（体力・休むなど）は、押す所に見えないように指と点滅を出さない */
.coach.look .coach-finger{display:none}
.coach.look .coach-hole{animation:none;border:2px dashed #ffe9a8;box-shadow:0 0 0 2px #2a1f16aa}
/* 2026-10-26 ユーザー：木の板にじかに書いた文字が見づらい → 板は今のまま、文字を濃く太く／赤い字は白抜き＋縁取りに */
.overlay .guide-list .gchoice small{color:#2a1408;font-size:12px;font-weight:900}
.overlay .guide-list .gchoice small.ready{color:#fff!important;-webkit-text-stroke:3px #7a1c0c;paint-order:stroke fill}
.tr-stats .tr-st span{color:#3a2410;font-weight:900}
.tr-subs .btn small{color:#fff;font-weight:900;-webkit-text-stroke:3px #2a1408;paint-order:stroke fill}
.tuto-page{margin:6px 0 10px;gap:4px}
.tuto-page img{height:78px;max-width:72px;object-fit:contain}
.tuto-page .guide-say p{font-size:15px;line-height:1.6;white-space:nowrap}

/* ===== 仲間一覧・仲間の詳細・ガチャの結果（2026-10-26 ユーザー要望1〜4・8〜12） ===== */
/* 一覧の背景：木の板をやめて景色に。2026-10-26 専用の絵（nakama.jpg・修行後は nakama_after.jpg）。絵が読めないときは訓練場の絵が下に見える */
.nk-bg{position:fixed;inset:0;z-index:-1;background:linear-gradient(#1a0f0859,#1a0f0859),url(art/bg/nakama.jpg) center/cover no-repeat,url(art/bg/train.jpg) 22% center/cover no-repeat,#1d1510}
.nk-bg.after{background:linear-gradient(#1a0f0859,#1a0f0859),url(art/bg/nakama_after.jpg) center/cover no-repeat,url(art/bg/train.jpg) 78% center/cover no-repeat,#1d1510}
.page-nakama .after-count{color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.page-nakama .empty{color:#fff6df}
.nk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.nk-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:0;min-width:0;padding:2px 2px 4px;background:none;border:0;border-style:solid;border-width:8px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/8px 12px stretch;filter:drop-shadow(0 3px 0 #1a0f08);color:#fff6df;cursor:pointer;font:inherit}
.nk-card:active{transform:translateY(2px);filter:none}
.nk-card .mon-img,.nk-card svg{width:76px;height:76px;object-fit:contain}
.nk-card .rstar{font-size:13px;line-height:1.1}
.nk-card .nk-name{display:block;width:100%;font-family:var(--game-font);font-weight:400;font-size:13px;line-height:1.3;text-align:center;overflow:hidden;color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}

/* 仲間の詳細（窓の大きさはどの操作でも変わらない：星上げの確認・演出は上に重ねる） */
.nk-detail{position:relative;display:flex;flex-direction:column;gap:6px;padding:2px 8px 0}
.nk-top{display:flex;gap:8px;align-items:stretch}
.nk-art{position:relative;flex:0 0 124px;height:124px;display:grid;place-items:center;border:0;border-style:solid;border-width:8px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/8px 12px stretch}
.nk-art .mon-img,.nk-art svg{width:104px;height:104px;object-fit:contain}
.nk-art .nk-up-fx{position:absolute;left:50%;top:50%;width:130%;aspect-ratio:1;transform:translate(-50%,-50%);background:no-repeat 0 0/800% 100%;pointer-events:none}
.nk-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.nk-id .nk-name{padding-right:36px;font-family:var(--game-font);font-weight:400;font-size:22px;line-height:1.2;color:#2a1408;overflow:hidden}
.nk-stars{display:flex;gap:1px;font-size:22px;line-height:1;letter-spacing:0}
.nk-stars i{font-style:normal;color:#0000;-webkit-text-stroke:2px #8a7657;paint-order:stroke fill}
.nk-stars i.on{color:#cfc6b0;-webkit-text-stroke:3px #2a1f16}
.nk-stars.r2 i.on{color:#9fd3e3}.nk-stars.r3 i.on{color:var(--gold)}.nk-stars.r4 i.on{color:#ff9e5e}.nk-stars.r5 i.on{color:#ff6fa0}
.nk-dupe{min-height:1.2em;font-size:12px;color:#6d5a40;font-weight:800;line-height:1.2}
.nk-tags{display:flex;flex-direction:column;gap:3px;margin:2px 0 0}
.nk-tags div{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:1px 8px;white-space:nowrap;min-width:0;background:#2a1f16;color:#f3e2c0}
.nk-tags dt{font-size:11px;font-weight:800}
.nk-tags dd{margin:0;font-family:var(--game-font);font-size:16px;color:#fff6df}
.nk-perk{margin:0;font-size:12px;line-height:1.35;color:#5a3a22;font-weight:800}
.nk-h{margin:2px 0 -4px;font-size:12px;font-weight:900;color:#5a3a22}
.nk-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}
.nk-stats span{display:flex;flex-direction:column;align-items:center;padding:1px 0 2px;background:#fff8e8;border:2px solid #2a1f16}
.nk-stats small{font-size:11px;font-weight:900;line-height:1.2}
.nk-stats b{font-family:var(--game-font);font-weight:400;font-size:17px;line-height:1.15}
.nk-stats .st-hp small{color:#c0391e}.nk-stats .st-atk small{color:#d9741b}.nk-stats .st-def small{color:#3f8a2e}.nk-stats .st-spd small{color:#2f6fb6}.nk-stats .st-hit small{color:#7f449a}.nk-stats .st-spi small{color:#b08400}
.nk-skills{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.nk-skills li{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:3px 8px 4px;background:#fff8e8;border:2px solid #2a1f16;min-height:52px;box-sizing:border-box}
.nk-skills em{grid-row:span 2;font-style:normal;font-family:var(--game-font);font-size:13px;color:#fff6df;background:#2a1f16;padding:2px 6px;align-self:center}
.nk-skills li.ougi em{background:#b02a14}
.nk-skills b{font-family:var(--game-font);font-weight:400;font-size:16px;line-height:1.25;color:#2a1408}
.nk-skills p{margin:0;font-size:12px;line-height:1.35;color:#5a3a22;font-weight:800}
.nk-grow{display:flex;align-items:center;justify-content:center;gap:10px;height:56px}
.nk-grow .nk-mats{display:flex;align-items:center;gap:3px;font-family:var(--game-font);font-size:18px;color:#2a1408}
.nk-grow .ico{width:22px;height:22px}
.nk-grow .btn{flex:0 1 auto;width:172px;min-width:0!important;padding-left:0!important;padding-right:0!important;height:52px;display:flex;align-items:center;justify-content:center;gap:6px;padding-top:0!important;padding-bottom:0!important;font-size:17px;white-space:nowrap}
.nk-grow .btn small{display:flex;align-items:center;gap:2px;font-size:14px}
.nk-grow .btn small .ico{width:18px;height:18px}
.nk-max{font-family:var(--game-font);font-weight:400;font-size:20px;color:#b02a14}
.nk-ask{position:absolute;inset:-2px -4px;z-index:3;display:grid;place-items:center;background:#140e08b8}
.nk-ask-box{width:min(290px,92%);text-align:center;padding:10px 12px 8px;border:0;border-style:solid;border-width:10px 16px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/10px 16px stretch;color:#fff6df}
.nk-ask-box p{margin:0 0 4px;font-family:var(--game-font);font-size:19px;line-height:1.35;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.nk-ask-box small{display:flex;align-items:center;justify-content:center;gap:3px;font-size:14px;font-weight:800}
.nk-ask-box small .ico{width:18px;height:18px}
.nk-ask-box .modal-row{margin-top:8px;gap:6px}.nk-ask-box .modal-row .btn{flex:1 1 0;min-width:0;max-width:none;height:46px;padding-left:0!important;padding-right:0!important}
/* 仲間のレベル（2026-10-27 lv.js）：左に今のレベル（黒い札）、右に持っている葉と根・上げるボタン2つ。高さは決まっている */
.nk-lv{display:flex;gap:6px;align-items:stretch;height:66px}
.nk-lv-now{flex:0 0 66px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#2a1f16;color:#f3e2c0;line-height:1}
.nk-lv-now small{font-size:11px;font-weight:800}
.nk-lv-now b{font-family:var(--game-font);font-weight:400;font-size:26px;color:#fff6df;margin-top:2px}
.nk-lv-now i{font-style:normal;font-size:12px;font-weight:800}
.nk-lv-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.nk-lv-have{display:flex;justify-content:flex-end;gap:10px;font-family:var(--game-font);font-size:15px;line-height:18px;color:#2a1408}
.nk-lv-have span{display:flex;align-items:center;gap:2px}
.nk-lv .ico{width:18px;height:18px}
.nk-lv-btns{flex:1;display:flex;gap:6px;align-items:stretch;justify-content:center}
.nk-lv-btns .btn{flex:1 1 0;min-width:0!important;max-width:190px;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:0!important;font-size:13px;line-height:1.15;white-space:nowrap}
.nk-lv-btns .btn small{display:flex;align-items:center;gap:1px;font-size:12px}
.nk-lv-btns .btn small .ico{width:14px;height:14px}
.nk-lv-btns .nk-max{align-self:center}
/* 星を上げたときの演出（控えめ：新しい星が入る・絵が一瞬光る・ひとこと）。光の絵は STARUP_ART（app.js）が届いたら上に重なる */
.nk-up .nk-stars i.new{animation:nkStar .7s cubic-bezier(.3,1.7,.5,1) both}
.nk-up .nk-art>.mon-img{animation:nkGlow 1s ease-out}
.nk-up .nk-up-fx{animation:nkFx .8s steps(8,jump-none) both,nkFxOut .8s linear both} /* 1回だけ。最後のコマは残さず消す */
.nk-up-msg{position:absolute;left:0;right:0;top:104px;z-index:2;margin:0;text-align:center;pointer-events:none;font-family:var(--game-font);font-size:24px;color:#fff6df;-webkit-text-stroke:5px #b02a14;paint-order:stroke fill;animation:nkMsg 1.8s ease-out both}
@keyframes nkStar{0%{transform:scale(2.4);opacity:0}60%{opacity:1}100%{transform:scale(1)}}
@keyframes nkGlow{0%{filter:brightness(2.2)}100%{filter:none}}
@keyframes nkFx{from{background-position-x:0%}to{background-position-x:100%}}
@keyframes nkFxOut{0%,85%{opacity:1}100%{opacity:0}}
@keyframes nkMsg{0%{opacity:0;transform:translateY(8px)}15%,75%{opacity:1;transform:none}100%{opacity:0}}

/* ガチャの結果だけの画面：10体が1画面に収まる（スクロールしない）。キャラは大きく */
.page-gres{padding:0!important;max-width:none!important}
.gres{position:relative;box-sizing:border-box;height:100vh;height:100dvh;display:flex;flex-direction:column;gap:8px;padding:calc(10px + env(safe-area-inset-top)) 10px calc(10px + env(safe-area-inset-bottom))}
.gr-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:6px;max-width:560px;width:100%;margin:0 auto}
.gr-grid.n10{grid-template-rows:repeat(5,minmax(0,1fr))}
.gr-card{position:relative;min-width:0;min-height:0;display:flex;align-items:center;gap:4px;padding:0 6px 0 0;background:none;border:0;border-style:solid;border-width:8px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/8px 12px stretch;filter:drop-shadow(0 3px 0 #1a0f08);color:#fff6df;cursor:pointer;font:inherit;text-align:left;animation:pop .3s backwards calc(var(--k)*.05s)}
.gr-card:active{transform:translateY(2px)}
.gr-card .mon-img,.gr-card svg{height:100%;width:auto;aspect-ratio:1;max-width:58%;object-fit:contain;flex:none}
.gr-card.r3{filter:drop-shadow(0 0 5px #ffd76a) drop-shadow(0 3px 0 #1a0f08)}
.gr-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.gr-id .rstar{font-size:19px;line-height:1.1}
.gr-id .nk-name{display:block;font-family:var(--game-font);font-weight:400;font-size:18px;line-height:1.25;overflow:hidden;color:#fff6df;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill}
.gr-id small{font-size:12px;font-weight:800;color:#f3e2c0;line-height:1.2}
.gr-card .new-tag{top:-6px;left:-8px;z-index:1}
/* 1回・天井の交換：1体を画面いっぱいに */
.gr-grid.n1{grid-template-columns:minmax(0,1fr);place-items:center}
.gr-grid.n1 .gr-card{flex-direction:column;justify-content:center;width:min(100%,360px);height:auto;padding:8px 0 12px;text-align:center}
.gr-grid.n1 .gr-card .mon-img,.gr-grid.n1 .gr-card svg{width:min(70vw,44vh);height:auto;max-width:none}
.gr-grid.n1 .gr-id{align-items:center}.gr-grid.n1 .gr-id .rstar{font-size:26px}.gr-grid.n1 .gr-id .nk-name{font-size:24px}
.gr-btns{flex:none;display:flex;gap:10px;justify-content:center;max-width:560px;width:100%;margin:0 auto}
.gr-btns .btn{flex:1 1 0;min-width:0!important;max-width:240px;height:56px;display:flex;align-items:center;justify-content:center;gap:6px;padding-top:0!important;padding-bottom:0!important;font-size:18px;white-space:nowrap}
.gr-btns .btn small{display:flex;align-items:center;gap:2px;font-size:14px}
.gr-btns .btn .ico{width:18px;height:18px}
/* ---- 修行の準備の下の帯（2026-10-26 ユーザー 33・38）：「次へ」はふつうの大きさ、「修行スタート」は文字ぶんの幅に ---- */
.su-foot{padding-top:6px;padding-bottom:6px;justify-content:center;gap:12px}
.su-foot>.btn{flex:0 0 auto!important;min-width:112px!important;height:48px!important;min-height:0!important;padding-top:0!important;padding-bottom:0!important;display:flex;align-items:center;justify-content:center;font-size:16px!important}
.su-foot>.btn.big.primary{min-width:0!important;height:52px!important;min-height:0!important;border-width:8px 26px 10px!important;padding-left:8px!important;padding-right:8px!important;font-size:19px!important}
/* ---- 修行設定（31・32）：選んだ方が朱の札。押しても窓の大きさは変わらない ---- */
.ts-list{display:flex;flex-direction:column;gap:12px;margin:12px 0 4px}
.ts-row{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.ts-row>b{font-size:15px;white-space:nowrap}
.ts-seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ts-seg .btn{margin:0;min-width:0!important;height:44px;padding:0 4px!important;display:flex;align-items:center;justify-content:center;font-size:15px;white-space:nowrap}
/* ---- 画像つきの遊び方（40）：画面いっぱい。上に修行画面の画像、下にブルのセリフ ---- */
.overlay:has(.modal.howto-full){padding:0}
.modal.howto-full{max-width:560px;width:100%;height:100dvh;max-height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.modal.howto-full .howto-body{flex:1;min-height:0;display:flex;flex-direction:column}
.modal.howto-full .howto-body>*{flex:none}
.modal.howto-full .hw-shots{flex:1 1 auto;min-height:0;display:grid;margin:6px 0 4px}
.hw-shot{grid-area:1/1;margin:0;visibility:hidden;display:flex;align-items:center;justify-content:center;min-height:0;position:relative}
.hw-shot.on{visibility:visible}
.hw-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 0 #2a1f16) drop-shadow(3px 0 0 #2a1f16) drop-shadow(-3px 0 0 #2a1f16) drop-shadow(0 3px 0 #2a1f16) drop-shadow(0 -3px 0 #2a1f16)}
.hw-shot figcaption{display:none}
/* 画像がまだない間の仮の表示 */
.hw-shot.miss img{display:none}
.hw-shot.miss figcaption{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#2a1f16cc;color:#fff6df;font-size:18px;border:3px dashed #c99a2e}
.hw-talk{margin:4px 0 8px!important}
.hw-talk .howto-who{height:118px}
/* 2026-10-26 ユーザー要望67：戦闘前のカードの名前も白い文字＋黒のふち */
.b3-card>b{font-family:var(--game-font);font-size:13px;color:#fff;-webkit-text-stroke:3px #2a1f16;paint-order:stroke fill;padding:0 2px;max-width:100%}
/* 2026-10-26 ユーザー要望69：期末バトルに勝ったとき＝出た味方を横に並べ、上がった能力6つを1段に */
.br-head{margin:2px 0 6px}
.br-mates{display:flex;gap:6px;margin:0 0 8px}
.br-mate{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center}
.br-mate img{width:100%;height:100px;object-fit:contain;filter:drop-shadow(1px 2px 0 #2a1f16)}
.br-mate>b{display:block;font-family:var(--game-font);font-size:14px;color:#fff;-webkit-text-stroke:3px #2a1f16;paint-order:stroke fill;white-space:nowrap;max-width:100%;overflow:hidden;padding:0 2px}
.br-gains.six{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
.br-gains.six .score-chip{flex:none;flex-direction:column;justify-content:center;gap:0;padding:3px 0 4px;text-align:center}
.br-gains.six .score-chip span{font-size:11px}
.br-gains.six .score-chip strong{font-size:17px;-webkit-text-stroke:4px var(--ink)}
/* 要望70：覚えた技のページは「次へ」だけ。要望71：やり直しを残して終える確認は1行だけ */
.scene-choices.n1{display:flex;justify-content:center}
.end-ask-q{text-align:center;font-size:16px;font-weight:900;margin:8px 0 12px}
/* ==== 2026-10-26 チャッピーの絵をつなぐ（docs/絵の宿題.md） ==== */
/* ガチャの実の絵（app.js fruitHtml）：白銀＝★1・青紫＝★2・金＝★3。★3は金に変わる所（.g-cut.gold）で金の実に入れかわる */
.fruit-art{display:grid;place-items:center;width:100%;height:100%}
.fruit-art img{grid-area:1/1;width:100%;height:100%;object-fit:contain;display:block}
.fruit-art .fa-3{opacity:0}
.g-cut.gold .fruit-art .fa-3{opacity:1;transition:opacity .4s}
.g-cut.gold .fruit-art .fa-2{opacity:0;transition:opacity .4s}
/* ★3の全面の演出（gacha_star3.png 横1段8コマ）：金の実がはじけて金の光と葉。割れる所で1回だけ再生して消える。出てきた仲間より後ろ */
.g-cut .g-star3{position:absolute;left:50%;top:50%;width:min(100vw,100vh);aspect-ratio:1;transform:translate(-50%,-50%);background:no-repeat 0 0/800% 100%;pointer-events:none;opacity:0;z-index:0}
.g-cut>.g-reveal{position:relative;z-index:1}
.g-cut.s3fx .g-orb{opacity:0;transition:opacity .08s} /* 絵の1コマ目の金の実に入れかわる（実が2つ見えないように） */
.g-cut.s3fx .g-star3{animation:gStar3 1.1s steps(8,jump-none) forwards,gStar3Out 1.1s linear forwards}
@keyframes gStar3{from{background-position-x:0%}to{background-position-x:100%}}
@keyframes gStar3Out{0%,85%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion: reduce){.g-cut .g-star3{display:none}.g-cut.s3fx:not(.burst) .g-orb{opacity:1}}
/* 修行の準備の枠（prep_frame.png 900×245）：上の朱の帯（x130〜770・y22〜57）に名前、くぼみ3×2（x69〜301/335〜565/599〜830・y89〜138/160〜210）に能力 */
.su-hero.has-pf{flex-wrap:wrap;row-gap:4px}
.su-pf{position:relative;flex:0 0 100%;aspect-ratio:900/245;background:url(art/ui/tr/prep_frame.png) center/100% 100% no-repeat;container-type:inline-size}
.su-pf-name{position:absolute;left:14.4%;width:71.2%;top:9%;height:14.3%;display:flex;align-items:center;justify-content:center;font-family:var(--game-font);font-weight:400;font-size:4.2cqw;line-height:1;color:#fff6df;-webkit-text-stroke:.7cqw #3a0c04;paint-order:stroke fill;white-space:nowrap;overflow:hidden}
.su-pf-c{position:absolute;left:calc(7.67% + var(--c)*29.5%);width:25.8%;top:calc(36.3% + var(--r)*29%);height:20.4%;display:flex;align-items:center;justify-content:space-between;padding:0 2.2cqw;box-sizing:border-box;white-space:nowrap}
.su-pf-c small{font-size:3.2cqw;font-weight:900;line-height:1;color:var(--sc,#e8b85a)}
.su-pf-c b{font-family:var(--game-font);font-weight:400;font-size:4.6cqw;line-height:1;color:#fff6df}
.su-pf-c.st-hp{--sc:#ff7a5a}.su-pf-c.st-atk{--sc:#ffa64a}.su-pf-c.st-def{--sc:#7fb8ff}.su-pf-c.st-spd{--sc:#7fe0f0}.su-pf-c.st-hit{--sc:#ffd84a}.su-pf-c.st-spi{--sc:#c99aff}
/* 修行のイベントの背景の絵（app.js の EVENT_PHOTO・storyPhoto）。描いた景色（.scene-bg）の上にかぶせる。地面が見えるよう少し下寄せ */
.scene-art .scene-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;display:block}
/* 2026-10-26 ユーザー：指南の窓の行は 顔・名前と得意練習・絆 の1段。行の高さをつめ、絆は右に大きく */
.overlay .guide-list{gap:2px 8px}
.overlay .guide-list .gchoice{min-height:0;margin-top:4px;padding:2px 6px 2px 2px;gap:8px;align-items:center}
.overlay .guide-list .gl-face{width:38px;height:38px}
.overlay .guide-list .gl-main{flex:0 1 auto;min-width:5.4em;display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}
.overlay .guide-list .gl-main b{font-size:16px;white-space:nowrap;overflow:hidden;max-width:100%}
.overlay .guide-list .gl-main small{line-height:1.25;white-space:nowrap}
.overlay .guide-list .gl-bond{flex:1;min-width:0;display:flex;align-items:center;gap:4px;color:#2a1408}
.overlay .guide-list .gl-bond small{font-size:12px;font-weight:900;line-height:1;flex:0 0 auto}
.overlay .guide-list .gl-bar{flex:1;min-width:20px;height:8px;background:#5a3b22;border:1.5px solid #2a1f16;overflow:hidden}
.overlay .guide-list .gl-bar i{display:block;height:100%;background:#e0a91a}.overlay .guide-list .gl-bar.lit i{background:#ff7a2a}
.overlay .guide-list .gl-bond b{font-size:20px;line-height:1;font-weight:400;min-width:1.5em;text-align:right;flex:0 0 auto}
/* 2026-10-26 ユーザー：修行地を選ぶページは札の下が空いていた → 2枚の札で下の帯までうめる（説明は札の中） */
.su-step-place .su-body{display:flex;flex-direction:column;padding-bottom:calc(72px + env(safe-area-inset-bottom))}
.su-step-place .su-places{flex:1 1 auto;min-height:0}
.su-step-place .su-pl{flex:1 1 0;display:flex;min-height:150px}
.su-step-place .su-pl-pick{flex:1;min-height:0;padding:12px 14px}
.su-step-place .su-pl-pick b{font-size:33px;line-height:1.15;text-shadow:3px 3px 0 #2a1f16,-1px -1px 0 #2a1f16,1px -1px 0 #2a1f16,-1px 1px 0 #2a1f16}
.su-step-place .su-pl-pick small{font-size:17px;line-height:1.4;padding:4px 9px;margin-top:6px}
/* 2026-10-26 ユーザー要望12-1：題字が顔にかからないよう、絵と題字の位置は app.js の fitTitle で画面の比率から決める */
.title-screen .ts-key{object-fit:cover;max-width:none}
.title-screen .ts-back{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);object-fit:cover;filter:blur(10px) brightness(.45);display:none}
.title-screen.wide .ts-back{display:block}
/* 2026-10-26 ユーザー（12-16と同じ画面）：既読・未読は文字の札をやめて、チャッピーの絵（朱の木札「未読」・墨の判子「既読」）を話の絵の右上に、絵の比率のまま小さく重ねる */
main .chapter.unread::after{content:none!important;display:none!important}
main .chapter .st-mark{position:absolute;z-index:3;top:4px;right:6px;width:min(23%,96px);height:auto;pointer-events:none;filter:drop-shadow(0 2px 0 #2a140899)}
/* 12-16：パソコン・タブレットで中身が横に広がりすぎないよう、ストーリーの一覧は幅を決めて真ん中に。ブルの吹き出しは文の改行（\n）だけで折り返す */
main .guide .guide-say p{white-space:nowrap}
@media (min-width:700px){main.page-story{max-width:640px}}
/* 15-7（2026-10-26 ユーザー）：修行の結果の六角形。頂点の札は紙垂をやめて札だけ（hex_plate.png・黒漆に金の縁）。
   網は札と紙垂を消した mat/web3.png を76%に縮めて真ん中に置き、札は網の外のふちに。名前と数字は札の中で同じ高さに中央そろえ */
.fz-web{background:url(art/ui/mat/web3.png) center/76% 76% no-repeat}
.fz-web svg.fz-net{inset:12%;width:76%;height:76%}
.fz-web .fz-tag{transform:none;width:33.7%;aspect-ratio:300/69;display:flex;align-items:center;justify-content:center;gap:3px;box-sizing:border-box;padding:0 11% ;background:url(art/ui/hex_plate.png) center/100% 100% no-repeat;line-height:1;letter-spacing:0;filter:drop-shadow(0 1px 0 #1a0f08)}
.fz-web .fz-tag i{font-style:normal;font-size:9px;line-height:1;color:var(--c);filter:brightness(1.35) saturate(1.1);margin:0}
.fz-web .fz-tag b{font-weight:400;font-size:11.5px;line-height:1;color:#fff6df}
.fz-web .fz-t0{left:33.15%;top:9.5%}.fz-web .fz-t3{left:33.15%;top:76%}
.fz-web .fz-t1{left:auto;right:0;top:31.4%}.fz-web .fz-t2{left:auto;right:0;top:54.2%}
.fz-web .fz-t5{left:0;top:31.4%}.fz-web .fz-t4{left:0;top:54.2%}
/* 16-1（2026-10-26 ユーザー）：結果の上の「次のランクまで」の帯をやめた。あいた30pxにキャラ絵を上へのばし、帳簿・技の見出しを上に詰めて技の札を高く */
.fz-hero{top:0;height:255px}
.fz-pic{height:209px}
.fz-ledger{top:0}
.fz-h-sk{top:203px}
.fz-skills{top:229px;height:185px}
/* 2026-10-26 ユーザー：ランクのスタンプを斜めにしない */
.rank,.fin-seal,.fz-seal,.fin-bt b,.fin-right .fin-seal{transform:none}
@keyframes finSeal{0%{opacity:0;transform:scale(2.4)}60%{opacity:1;transform:scale(.92)}100%{opacity:1;transform:none}}
@keyframes finStamp{0%{opacity:0;transform:scale(2.6)}60%{opacity:1;transform:scale(.9)}100%{opacity:1;transform:none}}
/* 2026-10-26 ユーザー：最終評価のランクの印は名札の帯の上下まん中に */
.fz-seal{top:0;bottom:0;right:6px;margin:auto 0;width:40px;height:40px}
/* 2026-10-26 メニューの右の列が枠からはみ出していたので、2列を同じ幅に */
.menu-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.menu-grid .btn{min-width:0;width:100%;padding-left:0;padding-right:0}
/* 2026-10-27 ユーザー：中断中はホームの修行の札が「続きから」になる */
.mode2-wrap{position:relative;display:flex;flex-direction:column;flex:1 1 0;min-width:0}
.mode2-wrap>.mode2-resume{width:100%}
.mode2-resume-t{position:relative;z-index:1;font-size:30px;line-height:1.1;color:#fff8e6;-webkit-text-stroke:5px #3a1408;paint-order:stroke fill;text-shadow:0 3px 0 #3a1408;margin:-4px 0 0 -2px}
.mode2-resume small{position:absolute;left:0;bottom:-2px;z-index:1}
.mode2-quit{position:absolute;right:4px;bottom:-34px;z-index:3;padding:2px 12px!important;min-height:0!important;font-size:12px!important}
.mode2-resume{justify-content:flex-start}
.mode2-resume .mode2-mon{z-index:0;height:150px;right:-4px;bottom:16px}
.mode2-resume .mode2-mon img,.mode2-resume .mode2-mon svg{height:150px}
.mode2-resume .mode2-resume-t{z-index:2;align-self:flex-start}
.mode2-resume small{z-index:2}
/* 2026-10-27 修行中の「技」の窓：技だけを札で並べる */
.tsk-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.tsk{background:url(art/ui/fin/skill_a.png) center/100% 100% no-repeat;min-height:58px;padding:8px 22px;display:flex;flex-direction:column;justify-content:center;line-height:1.25}
.tsk.own{background-image:url(art/ui/fin/skill_own.png)}
.tsk.empty{background-image:url(art/ui/fin/skill_empty.png);opacity:.75}
.tsk.ougi{background-image:url(art/ui/skill_ougi.png);color:#fff8e6;min-height:66px}
.tsk b{font-size:16px;color:#2a1408}
.tsk.ougi b{color:#fff3c4;text-shadow:0 2px 0 #3a1408}
.tsk b i{font-style:normal;color:#c4401a;margin-left:4px;font-size:13px}
.tsk small{font-size:12px;color:#5a3a1a;margin-top:2px}
.tsk.ougi small{color:#ffe9c2}
.tsk{padding:8px 34px 8px 40px}.tsk.empty{align-items:center;padding:8px 34px}
/* 2026-10-27 修行中の「技」の窓：すき間を詰める */
.tsk-list{gap:2px;margin-top:4px}
.tsk{min-height:50px;padding:5px 34px 5px 40px}
.tsk.ougi{min-height:56px}
/* 2026-10-27 ユーザー：技の札の左右の長さをそろえる（絵ごとに房の出っぱりが違うので、本体の幅でそろえる） */
.tsk{position:relative;isolation:isolate;background:none!important}
.tsk::before{content:'';position:absolute;top:0;bottom:0;z-index:-1;background:center/100% 100% no-repeat}
.tsk::before{background-image:url(art/ui/fin/skill_a.png);left:-3.14%;right:-0.99%}
.tsk.own::before{background-image:url(art/ui/fin/skill_own.png);left:-0.49%;right:-0.49%}
.tsk.empty::before{background-image:url(art/ui/fin/skill_empty.png);left:-0.99%;right:-0.99%}
.tsk.ougi::before{background-image:url(art/ui/skill_ougi.png);left:0;right:0}
.tsk{margin:0 6px}
.tsk-list{gap:0;margin-top:0}.tsk{min-height:44px;padding-top:3px;padding-bottom:3px}.tsk.ougi{min-height:50px}.modal:has(.tsk-list) .band{margin-bottom:2px}
/* 2026-10-27 ユーザー：技の札を縦に伸ばして文字に余裕を（窓はそのぶん上下に広がる） */
.tsk{min-height:60px;padding-top:8px;padding-bottom:8px}.tsk.ougi{min-height:64px}.tsk-list{gap:2px}
.tsk-list{padding-bottom:14px}
/* 2026-10-27 ユーザー：「〜は持ち物に戻った」がもらった物の札と下のボタンに重なっていた → 「手に入れたもの」の札の右の空いた所に、読める大きさで */
.fz-note{left:160px;top:480px;width:224px;height:26px;font-size:11.5px;line-height:1.15;white-space:normal;display:flex;align-items:center;justify-content:flex-end;text-align:right;font-weight:900}

/* 2026-10-27 ユーザー：仲間一覧・修行後は横5体。右下（ガチャの上）にスクロールで動かない「並べかえ」ボタン */
.page-nakama .nk-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding-bottom:64px}
.page-nakama .nk-card{border-width:6px 8px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/6px 8px stretch;padding:2px 0 3px}
.page-nakama .nk-card .mon-img,.page-nakama .nk-card svg{width:100%;height:auto;aspect-ratio:1;max-width:60px}
.page-nakama .nk-card .rstar{font-size:10px;letter-spacing:-.08em}
.page-nakama .nk-card .nk-name{font-size:11px;-webkit-text-stroke:2.5px #1a0f08;white-space:nowrap}
.page-nakama .nk-card .nk-name.long{font-size:8.5px;letter-spacing:-.04em}
.page-nakama .rec-card .rank-mini{position:absolute;right:-2px;top:-2px;transform:scale(.75);transform-origin:top right;z-index:1}
.page-nakama .rec-card.fav{filter:drop-shadow(0 0 3px #ffd25a) drop-shadow(0 3px 0 #1a0f08)}
.nk-sort-btn{position:fixed;right:10px;bottom:calc(env(safe-area-inset-bottom,0px) + 100px);z-index:41;min-width:84px;padding:4px 10px;background:none;border:0;border-style:solid;border-width:8px 12px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/8px 12px stretch;filter:drop-shadow(0 3px 0 #1a0f08);color:#fff6df;font-family:var(--game-font);font-size:15px;line-height:1.2;-webkit-text-stroke:3px #1a0f08;paint-order:stroke fill;cursor:pointer}
.nk-sort-btn:active{transform:translateY(2px);filter:none}
.nk-sort-btn.filt{color:#ffd25a}
.nk-sort-ask{position:fixed;inset:0;z-index:60}
.nk-sort-box{width:min(330px,94%);text-align:left}
.nk-sort-h{margin:6px 0 4px;font-size:12px;font-weight:900;color:#f3e2c0}
.nk-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.nk-chip{padding:5px 0;background:#3a2a1f;border:2px solid #1a0f08;color:#cdbb98;font:900 13px/1.2 inherit;font-family:inherit;cursor:pointer;white-space:nowrap}
.nk-chip.on{background:#c8442b;color:#fff6df;border-color:#ffd25a}
.nk-chip.el-red.on{background:#d9482b}.nk-chip.el-blue.on{background:#3d7fc4}.nk-chip.el-yellow.on{background:#c7930f}.nk-chip.el-green.on{background:#4f9a3c}
.nk-sort-box .modal-row{margin-top:10px}
.nk-sort-box .modal-row .btn{font-size:14px;padding-left:4px;padding-right:4px;white-space:nowrap}
/* 2026-10-27 ユーザー：練習の札の仲間も、仲間一覧と同じ黒い板のアイコンに（丸い枠をやめる）。光る仲間は金のふち */
.tr-card .tr-face{border-radius:0;background:none;border:0;border-style:solid;border-width:2px 3px;border-image:url(art/ui/board_dark.png) 40 70 40 70 fill/2px 3px stretch;overflow:visible}
.tr-card .tr-face .mon-img,.tr-card .tr-face svg{object-fit:contain}
.tr-card .tr-face.lit{border-color:transparent;box-shadow:0 0 0 2px #ffd25a,0 0 7px 2px #ff7a2a}
/* 2026-10-27 ユーザー：並べかえボタンはキャラの枠（黒い板）とちがう素材に → 縄でしばった橙の木の札 */
.nk-sort-btn{border-width:7px 20px 9px;border-image:url(art/ui/btn_wood_warm.png) 40 110 46 fill/7px 20px 9px stretch;padding:5px 6px;color:#3a2410;-webkit-text-stroke:0;font-weight:900;filter:drop-shadow(0 3px 0 #1a0f08)}
.nk-sort-btn.filt{color:#a3220f}
/* 2026-10-28 ユーザー：詳細などの窓が開いている間は並べかえボタンを出さない（窓の上に貫通していた） */
body:has(.overlay) .nk-sort-btn{display:none}
/* 2026-10-28 ユーザー：★3の演出の背景は CSS で作らず、チャッピーの絵（art/fx/gacha_star3_bg.jpg）。金になるまでは暗く、金で明るく。光の筋も絵の中にあるので CSS の筋は出さない */
.g-cut{background:#0b0816}
/* fixed の .g-cut は重なりの箱を作るので z-index:-1 で中身の後ろ・背景色の前に */
.g-cut::before{content:'';position:absolute;inset:0;z-index:-1;background:url(art/fx/gacha_star3_bg.jpg) center/cover no-repeat;filter:brightness(.35) saturate(.6);transition:filter .5s}
.g-cut.gold::before{filter:none}
.g-cut .g-rays{display:none}
.mode2-resume-t img.moji{height:34px;width:auto;display:block}
/* 2026-10-28 詳細の見出しは書き文字（チャッピー art/moji/h_*.png） */
.nk-h img.moji{height:18px;width:auto;display:block}

/* 旅のビンゴ帳。専用の絵がない間も、下の紙・木・色丸が残る。 */
body:has(.sg-bingo) header,body:has(.sg-bingo) .back-float{display:none}
body:has(.sg-bingo) main.page-training{padding:6px 8px!important}
.sg.sg-bingo{height:calc(100dvh - 12px);gap:6px;max-width:460px;min-height:0}
.sg-bingo>*{flex-shrink:0}
.sg-art[hidden]{display:none!important}
.sg-art{object-fit:contain;pointer-events:none}
.sg-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0}
.sg-bingo .sg-leg{background:#2a1f16 url(art/sg/date_board.png) center/100% 100%;box-shadow:none}
.sg-bingo .sg-leaf{gap:2px;box-shadow:none;font-size:18px;background:#fff6df url(art/sg/panel.png) center/100% 100%}.sg-leaf>.sg-art{width:22px;height:30px}.sg-leaf>small{font-size:12px}
.sg-stage{position:relative;height:148px;min-height:110px;flex:1 1 148px;max-height:200px;overflow:hidden;border:3px solid #563518;background:#d9c08a url(art/bg/train_yellow.jpg) center/cover}
.sg-stage>.sg-cover{object-fit:cover}
.sg-road-window{position:absolute;inset:0;overflow:hidden}
.sg-road-world{position:absolute;inset:0;will-change:transform}
.sg-road-row{position:absolute;left:10%;right:10%;height:56px;border:11px solid #ecd9a3;border-left:0;border-bottom:0;border-radius:0 22px 0 0;filter:drop-shadow(0 3px #836139);background:url(art/sg/path.png) center/100% 100%;transform:translateY(-6px)}
.sg-road-row.reverse{border-right:0;border-left:11px solid #ecd9a3;border-radius:22px 0 0 0}
.sg-path-tile{position:absolute;transform:translate(-50%,-50%);height:30px;width:30px;background:var(--c);border:2px solid #f9eabd;outline:2px solid #3b2514;border-radius:50%;z-index:1}
.sg-path-tile>.sg-art{position:absolute;inset:-4px;width:34px;height:34px}.sg-path-tile>span{position:absolute;top:28px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;font-weight:bold;background:#fff2cf;padding:0 2px;line-height:1.3}
.sg-path-tile.here{outline:3px solid #ffe04b}.sg-path-tile.sg-passed{animation:sgTileGlow .38s ease-out}.sg-path-tile.sg-landed:after{content:'';position:absolute;inset:-9px;border:3px solid #ffdf62;border-radius:50%;box-shadow:0 0 0 3px #fff0b6;animation:sgLandRing .7s ease-out both}
.sg-traveler{position:absolute;width:44px;height:44px;transform:translate(-50%,-100%);z-index:3;pointer-events:none;will-change:transform}.sg-piece{height:100%;display:flex;align-items:flex-end;justify-content:center;transform-origin:center bottom}.sg-piece img,.sg-piece svg{height:44px;width:auto;max-width:none;filter:drop-shadow(1px 2px #3b2514)}
.sg-stage-cue{position:absolute;left:0;right:0;top:0;z-index:5;text-align:center;font-family:var(--game-font);font-size:18px;color:#fff4ce;line-height:1.2;pointer-events:none}
.sg-stage-cue:empty{display:none}.sg-stage-cue.walking,.sg-stage-cue.stamping{background:#352316eb;padding:4px 8px}
.sg-stage-cue.landed{display:flex;align-items:center;justify-content:center;gap:6px;min-height:63px;background:#ffefc9f5;border-bottom:3px solid #aa732b;color:#502c13;animation:sgArrival .18s ease-out}.sg-stage-cue.landed>.sg-art{width:60px;height:60px}.sg-stage-cue.landed b{display:block;font-size:20px}.sg-stage-cue.landed small{display:block;font-size:11px;margin-top:4px}
.sg-playing button{pointer-events:none}.sg-playing .sg-roll:disabled,.sg-playing .sg-bagbtn:disabled{opacity:.65}
.sg-travel-note{position:absolute;bottom:0;left:0;right:0;background:#352316e8;color:#fff4ce;font-size:11px;padding:2px 6px;z-index:4;text-align:center}
.sg-book{position:relative;background:#f3dfae url(art/sg/book_paper.png) center/100% 100%;border:3px solid #6b3d1f;padding:6px 9px 9px;isolation:isolate}
.sg-book-head{position:relative;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;font-size:16px;font-family:var(--game-font)}.sg-book-head strong{color:#9e321b;font-size:17px}
.sg-grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,55px);gap:5px;z-index:1}
.sg-cell{position:relative;border:2px solid #6b3d1f;background:#fffae6;color:#4d2f19;min-width:0;display:flex;align-items:center;justify-content:center;gap:3px;border-radius:0;padding:3px;font:14px var(--game-font);opacity:1!important}
.sg-cell>.sg-art{width:34px;height:34px;position:relative;z-index:1}.sg-cell:before{content:'';width:24px;height:24px;flex-shrink:0;background:var(--c);border-radius:50%;opacity:.28;position:absolute;left:12%}
.sg-cell.marked{background:#e8d19a}.sg-cell.marked:before{opacity:1;border:2px solid #ffeabb;outline:2px solid var(--c)}.sg-cell>span{position:relative;z-index:2}.sg-cell>small{font-size:10px;position:absolute;right:2px;bottom:0;color:#a3321a;z-index:2}
.sg-cell[data-sg]{cursor:pointer;box-shadow:0 2px #6b3d1f}.sg-cell[data-sg]:active{transform:translateY(2px);box-shadow:none}
.sg-line{position:absolute;pointer-events:none;height:5px;background:#aa321477;z-index:1;transform-origin:center}.sg-line img{position:absolute;width:100%;height:15px;top:-5px;object-fit:fill}
.sg-line-0,.sg-line-1,.sg-line-2{left:2%;width:96%}.sg-line-0{top:17%}.sg-line-1{top:50%}.sg-line-2{top:83%}
.sg-line-3,.sg-line-4,.sg-line-5{top:4%;height:92%;width:5px}.sg-line-3{left:16%}.sg-line-4{left:49%}.sg-line-5{left:83%}.sg-line-3 img,.sg-line-4 img,.sg-line-5 img{width:15px;height:100%;top:0;left:-5px}
.sg-line-6,.sg-line-7{left:0;top:49%;width:100%;height:5px}.sg-line-6{transform:rotate(28deg)}.sg-line-7{transform:rotate(-28deg)}
.sg-bingo .sg-stats{gap:3px}.sg-bingo .sg-st{background:#2a1f16 url(art/sg/stat_board.png) center/100% 100%;padding:3px 0}.sg-bingo .sg-st b{font-size:16px}
.sg-bingo .sg-tools{height:30px}.sg-bingo .sg-tools .btn{margin:0;min-height:28px;padding:0 12px;font-size:12px}
.sg-bingo .sg-team{margin:2px 0}.sg-bingo .sg-tm-face{height:41px;width:41px;background:#fff6df url(art/sg/friend_frame.png) center/100% 100%}.sg-bingo .sg-tm-face img{height:39px}.sg-bingo .sg-tm.ready .sg-tm-face{animation:none;border-color:#d1841b;box-shadow:0 0 0 2px #ffd75e}
.sg-bingo .sg-act{height:60px;margin-bottom:4px}.sg-bingo .sg-roll{min-height:52px;font-size:19px;background-image:url(art/sg/button_roll.png);background-size:100% 100%;gap:5px}.sg-roll-art{height:32px;width:32px}.sg-bingo .sg-bagbtn{background-image:url(art/sg/button_bag.png);background-size:100% 100%}
.sg-dice-show{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#352316bd;color:#fff4ce;font-family:var(--game-font);line-height:1.15;pointer-events:none}
.sg-dice-pair{display:flex;justify-content:center;gap:16px;margin-bottom:5px}
.sg-bingo .sg-dice{position:relative;left:auto;top:auto;transform:none;width:80px;height:80px;border:0;border-radius:12px;background:#fff1d0;box-shadow:0 4px #58351d}
.sg-bingo .sg-dice:has(>.sg-art:not([hidden])){background:none;box-shadow:none}
.sg-dice>.sg-art{position:absolute;inset:0;width:100%;height:100%}.sg-dice>span{position:relative;z-index:1;font-size:54px;line-height:1;color:#97331f;text-shadow:2px 0 #fff5d6,-2px 0 #fff5d6,0 2px #fff5d6,0 -2px #fff5d6}
.sg-dice-show.rolling .sg-dice{animation:sgDiceTumble .4s linear infinite}.sg-dice-show.rolling .sg-dice:nth-child(2){animation-direction:reverse}
.sg-dice-total{font-size:23px}.sg-dice-steps{font-size:15px;min-height:18px;margin-top:3px}.sg-dice-show.rolling .sg-dice-steps{display:none}
.modal:has([data-sg]){max-height:calc(100dvh - 24px);padding:12px 14px;background:#f5e5bd url(art/sg/panel.png) center/100% 100%}
.modal:has([data-sg]) .band{background-image:url(art/sg/banner.png);background-size:100% 100%;font-size:18px}
.modal:has([data-sg]) .btn,.modal:has([data-sg]) .gchoice{background-image:url(art/sg/button.png);background-size:100% 100%}
.modal:has([data-sg]) .close{font-size:12px;width:auto;padding:3px;right:4px;top:3px}
.modal:has([data-sg]) .sg-book{margin:8px 0}.modal:has([data-sg]) .sg-grid{grid-template-rows:repeat(3,60px)}
.sg-instruction{text-align:center;font-size:14px;margin:8px 0}.sg-result-text{font-size:14px;line-height:1.65;overflow-wrap:anywhere;margin:8px 0}
.sg-help-row{display:flex;gap:5px;justify-content:center;margin:6px 0}.sg-help-row:empty{display:none}.sg-help-row button{position:relative;border:2px solid #67401c;background:#e7ca79;padding:2px;width:44px;display:grid;place-items:center}.sg-help-row img{height:34px;width:auto}.sg-help-row small{font-size:9px;white-space:nowrap}
.sg-abilities{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0}.sg-abilities button{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px;min-height:65px}.sg-abilities img{width:32px;height:32px}.sg-abilities small{flex-basis:100%}
.sg-wheel{position:relative;width:254px;height:254px;margin:8px auto}.sg-wheel-disc{position:absolute;inset:4%;border:7px solid #74401c;border-radius:50%;background:#d39c38;box-shadow:inset 0 0 0 3px #ffe1a3}.sg-wheel-disc .sg-art{border-radius:50%}
.sg-wheel-choice{position:absolute;transform:translate(-50%,-50%);width:80px;text-align:center;font-size:11px;line-height:1.2;z-index:3}.sg-wheel-choice img{display:block;width:34px;height:34px;margin:auto}.sg-wheel-choice b{display:block;background:#faecc6;border:2px solid #5b371b;padding:4px 2px}.sg-wheel-choice.chosen b{background:#a3311c;color:white;border-color:#ffd366;transform:scale(1.08)}
.sg-wheel-needle{position:absolute;inset:0;z-index:2;pointer-events:none;transition:transform .08s linear}.sg-wheel-needle:before{content:'';position:absolute;width:6px;height:33%;top:17%;left:calc(50% - 3px);background:#a3311c;box-shadow:0 0 0 2px #fff0c3}.sg-wheel-needle:after{content:'';position:absolute;left:44%;top:44%;width:12%;height:12%;border-radius:50%;background:#73401c;border:3px solid #ffdc8d}.sg-wheel-needle .sg-art{z-index:1}
.sg-wheel-list p{margin:3px 0;font-size:11px;line-height:1.4;display:grid;grid-template-columns:94px 1fr;gap:4px}.sg-wheel-list b{color:#7c3019}.sg-wheel-list span{min-width:0}
.sg-game{background-image:url(art/sg/panel.png);background-size:100% 100%}.sg-meter{background-image:url(art/sg/minigame_meter.png);background-size:100% 100%}.sg-zone{background-image:url(art/sg/minigame_zone.png);background-size:100% 100%}.sg-mark{background-image:url(art/sg/minigame_mark.png);background-size:100% 100%}.sg-hits i{background-image:url(art/sg/minigame_hit.png);background-size:100% 100%}.sg-cut-band{background-image:url(art/sg/day_banner.png);background-size:100% 100%}
@media(max-height:720px){.sg-bingo .sg-grid{grid-template-rows:repeat(3,44px)}.sg-bingo .sg-stage{height:135px;flex-basis:135px}.sg-bingo .sg-leg b{font-size:14px}.sg-bingo .sg-act{height:50px}.sg-bingo .sg-tm-face{width:34px;height:34px}.sg-bingo .sg-tm-face img{height:32px}}
@media(prefers-reduced-motion:reduce){.sg-wheel-needle{transition:none}.sg-dice.rolling{animation:none}}
/* 共通の赤い国の装飾より、時成通りの絵を優先する。 */
#app .sg-bingo .sg-roll{border:3px solid #4f2917!important;border-image:none!important;background:#a83b23 url(art/sg/button_roll.png) center/100% 100% no-repeat!important;filter:none}
#app .sg-bingo .sg-bagbtn,#app .sg-bingo .sg-tools .btn{border:2px solid #4f2917!important;border-image:none!important;background:#ebd29a url(art/sg/button.png) center/100% 100% no-repeat!important;filter:none}
#app .sg-bingo .sg-bagbtn{background-image:url(art/sg/button_bag.png)!important}
#app .modal:has([data-sg]){border:5px solid #6b3d1f;border-image:none;background:#f5e5bd url(art/sg/panel.png) center/100% 100%;padding:12px 14px;filter:none}
#app .modal:has([data-sg]) .btn,#app .modal:has([data-sg]) .gchoice{border:3px solid #6b3d1f!important;border-image:none!important;background:#ebd29a url(art/sg/button.png) center/100% 100% no-repeat!important;filter:none;color:#3b2514!important;-webkit-text-stroke:0!important;min-height:42px;padding:6px 10px!important}
#app .modal:has([data-sg]) .btn.primary{background:#aa3d22 url(art/sg/button_roll.png) center/100% 100% no-repeat!important;color:#fff7db!important}
#app .modal:has([data-sg]) .band{padding:6px!important;background:#e4bc66 url(art/sg/banner.png) center/100% 100% no-repeat!important;text-align:center}
#app .modal:has([data-sg]) .band:before,#app .modal:has([data-sg]) .band:after{display:none}
#app .modal:has([data-sg]) .close{position:relative;display:block!important;float:right;width:56px;height:28px;font-size:11px!important;padding:2px!important;line-height:1.2!important;-webkit-text-stroke:0;background:#a83b23 url(art/sg/button.png) center/100% 100%;border:2px solid #4f2917;border-image:none}
#app .sg-bingo .sg-days{background-image:url(art/sg/day_track.png);background-size:100% 100%}#app .sg-bingo .sg-bond{background-image:url(art/sg/bond_track.png);background-size:100% 100%}
/* チャッピーの絵を入れた後の調整 */
.sg-bingo .sg-leg{padding:7px 28px 6px}
.sg-book{padding-top:26px;margin-top:16px}.sg-book>img[src$="book_frame.png"]{top:-22px;bottom:auto;height:54px;object-fit:contain;z-index:2}
.sg-cell:has(>.sg-art:not([hidden])):before{display:none}
.sg-game{padding:6px 4px!important;border-style:solid!important;border-color:transparent!important;border-width:28px 30px 28px 32px!important;border-image:url(art/sg/panel.png) 170 195 170 210 fill / 28px 30px 28px 32px stretch!important;background:none!important;box-shadow:none!important}
#app .modal:has([data-sg]){padding:6px 4px!important;border-style:solid!important;border-color:transparent!important;border-width:28px 30px 28px 32px!important;border-image:url(art/sg/panel.png) 170 195 170 210 fill / 28px 30px 28px 32px stretch!important;background:none!important;box-shadow:none!important}
.sg-cell>span{white-space:nowrap}.modal .sg-cell{gap:1px;padding:2px;font-size:13px}.modal .sg-cell>.sg-art{width:28px;height:28px}
#app~.sg-game-ov .sg-stop,.sg-game .sg-stop{border:3px solid #4f2917!important;border-image:none!important;background:#a83b23 url(art/sg/button_roll.png) center/100% 100% no-repeat!important;color:#fff7db!important;filter:none;box-shadow:none!important}
/* 能力の絵は左、名前は紙色の縁つきで前面、済は右。判子を傾けない。 */
.sg-cell{justify-content:flex-start;gap:2px;padding:3px 26px 3px 3px;overflow:visible}
.sg-cell>.sg-art,.modal .sg-cell>.sg-art{width:29px;height:29px;flex-shrink:0;z-index:2}
.sg-cell>.sg-cell-name{position:relative;z-index:4;font-size:13px;opacity:1;color:#4d2f19;text-shadow:2px 0 #fff6df,-2px 0 #fff6df,0 2px #fff6df,0 -2px #fff6df,1px 1px #fff6df,-1px -1px #fff6df}
.sg-cell.marked{background:#f4e3ba}.sg-seal{position:absolute!important;right:2px;top:50%;width:32px;height:32px;transform:translateY(-50%);z-index:3!important;pointer-events:none;opacity:.78;mix-blend-mode:multiply}
.sg-seal>.sg-done{display:block;position:absolute;inset:0;width:100%;height:100%}.sg-seal>small{position:absolute;inset:2px;display:grid;place-items:center;border:2px solid #b33723;color:#b33723;font:18px var(--game-font);border-radius:50%}
.sg-seal:has(>.sg-done:not([hidden]))>small{display:none}
.modal .sg-cell{padding:3px 25px 3px 2px;gap:0}.modal .sg-cell>.sg-art{width:25px;height:25px}.modal .sg-cell>.sg-cell-name{font-size:12px}.modal .sg-seal{width:29px;height:29px}
.sg-stamp-target{z-index:5;box-shadow:inset 0 0 0 3px #ffcb47,0 0 0 3px #ffd969!important;background:#fff7d0!important}
.sg-seal.sg-stamp-fall{animation:sgStampFall .14s cubic-bezier(.55,0,.9,.5) both;opacity:.92}.sg-stamp-hit .sg-seal{animation:sgStampSettle .12s ease-out}
.sg-ink-puff{position:absolute;right:-3px;top:50%;width:42px;height:42px;border:3px dotted #b33c26;border-radius:50%;pointer-events:none;z-index:5;animation:sgInkPuff .12s ease-out both}
.sg-book-hit{animation:sgBookHit .12s ease-out}.sg-line-new{animation:sgLineDraw .25s ease-out both}.sg-line-new.sg-line-3,.sg-line-new.sg-line-4,.sg-line-new.sg-line-5{animation-name:sgLineDrawV}
@keyframes sgDiceTumble{0%{transform:translate(-8px,0) rotate(0)}25%{transform:translate(0,-10px) rotate(90deg)}50%{transform:translate(8px,0) rotate(180deg)}75%{transform:translate(0,-7px) rotate(270deg)}100%{transform:translate(-8px,0) rotate(360deg)}}
@keyframes sgTileGlow{0%,35%{box-shadow:0 0 0 6px #ffe7a4;filter:brightness(1.3)}100%{box-shadow:0 0 0 0 #ffe7a400;filter:brightness(1)}}
@keyframes sgLandRing{from{transform:scale(.7);opacity:1}to{transform:scale(1.3);opacity:.55}}
@keyframes sgArrival{from{transform:translateY(-8px);opacity:.4}to{transform:none;opacity:1}}
@keyframes sgStampFall{from{transform:translateY(calc(-50% - 30px)) scale(2);opacity:.3}to{transform:translateY(-50%) scale(1);opacity:.78}}
@keyframes sgStampSettle{0%{transform:translateY(-50%) scale(1.12,.86)}100%{transform:translateY(-50%) scale(1)}}
@keyframes sgInkPuff{from{transform:translateY(-50%) scale(.55);opacity:.8}to{transform:translateY(-50%) scale(1.55);opacity:0}}
@keyframes sgBookHit{0%,100%{transform:translateY(0)}35%{transform:translateY(3px)}70%{transform:translateY(-1px)}}
@keyframes sgLineDraw{from{clip-path:inset(-8px 100% -8px 0)}to{clip-path:inset(-8px 0 -8px 0)}}
@keyframes sgLineDrawV{from{clip-path:inset(0 -8px 100% -8px)}to{clip-path:inset(0 -8px 0 -8px)}}
/* 小さい端末でも道、帳面、操作を同じ画面に収める。 */
.sg.sg-bingo{gap:5px}.sg-bingo .sg-stage{min-height:176px;flex:1 1 180px;max-height:240px}
.sg-bingo .sg-book{margin-top:12px;padding:21px 8px 7px}.sg-bingo .sg-book-head{line-height:1.4;margin-bottom:4px}
.sg-bingo .sg-act{margin-top:auto;flex-shrink:0}
@media(max-height:720px){
 .sg.sg-bingo{gap:4px}.sg-bingo .sg-leg{padding:5px 22px}.sg-bingo .sg-stage{min-height:176px;flex-basis:176px;max-height:180px}
 .sg-bingo .sg-book{margin-top:10px;padding:18px 7px 6px}.sg-bingo .sg-book-head{font-size:14px}.sg-bingo .sg-book-head strong{font-size:15px}.sg-bingo .sg-grid{grid-template-rows:repeat(3,42px);gap:4px}
 .sg-bingo .sg-st{padding:2px 0}.sg-bingo .sg-team{margin:0}.sg-bingo .sg-act{height:48px;margin-bottom:3px}.sg-bingo .sg-roll{min-height:48px;font-size:18px}
 .sg-bingo .sg-dice{width:70px;height:70px}.sg-bingo .sg-dice>span{font-size:48px}.sg-dice-total{font-size:21px}
 .modal:has([data-sg]) .sg-wheel{width:210px;height:210px;margin:4px auto}.modal:has([data-sg]) .sg-wheel-choice{width:76px}.modal:has([data-sg]) .sg-wheel-choice img{width:28px;height:28px}
 .modal:has([data-sg]) .sg-wheel-list p{font-size:10px;line-height:1.35;margin:2px 0}.modal:has([data-sg]) .sg-grid{grid-template-rows:repeat(3,48px)}
}
@media(prefers-reduced-motion:reduce){
 .sg-bingo .sg-dice-show .sg-dice,.sg-path-tile.sg-passed,.sg-path-tile.sg-landed:after,.sg-stage-cue.landed,.sg-seal.sg-stamp-fall,.sg-stamp-hit .sg-seal,.sg-book-hit,.sg-line-new{animation:none}
 .sg-ink-puff{display:none}.sg-dice-show .sg-dice{transform:none}.sg-cut,.sg-cut-band{animation:none}
}
/* そろった線は能力名と判子の下。*/
.sg-grid .sg-line{z-index:1;opacity:.8}.sg-grid .sg-cell>.sg-cell-name,.sg-grid .sg-cell>span{position:relative;z-index:4}
/* 時成通り：完成結果は押印のあと、確認するまで残す。 */
.sg-line-result{text-align:center;color:#502c13}
.sg-line-title{font:900 clamp(24px,7vw,32px)/1.3 var(--game-font);color:#a3311c;margin:12px 0}
.sg-line-caption{font-size:14px;margin:6px 0}
.sg-line-gains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 6px;margin:12px 0 20px}
.sg-line-gains span{display:block;font-size:14px;font-weight:900}
.sg-line-gains b{display:block;font:900 32px/1.3 var(--game-font);color:#a3311c}
#app .modal:has([data-sg]) .gchoice:disabled{opacity:1;filter:grayscale(1);color:#625d55!important;box-shadow:none;cursor:not-allowed}
#app .modal:has([data-sg]) .sg-cost-short{display:block;font-size:13px;font-weight:900;margin-top:3px}
/* 札画像の両端を空ける。アプリの外に置く勝負の窓にも同じ指定を使う。 */
#app .modal:has([data-sg]) .band,.sg-game .band{width:100%;margin:4px 0 8px;padding:8px 18%!important;background:#e4bc66 url(art/sg/banner.png) center/100% 100% no-repeat!important;text-align:center;font-size:18px;line-height:1.35;overflow-wrap:anywhere}
.sg-game .band:before,.sg-game .band:after{display:none}
.sg-bingo .sg-top{gap:6px;align-items:stretch}
.sg-wallet{width:88px;flex-shrink:0;display:flex;flex-direction:column;gap:3px}
.sg-bingo .sg-wallet .sg-leaf{justify-content:center;padding:0 3px;line-height:1.3}
.sg-bingo .sg-tools{height:26px;gap:2px;justify-content:space-between}
#app .sg-bingo .sg-tools .btn{padding:0 2px!important;min-height:26px;font-size:11px;line-height:1.2;flex:1}
.sg-bingo .sg-leg{padding:5px 8px}
.sg-bingo .sg-leg small{display:block;font-size:13px;line-height:1.4}
.sg-path-tile>span{font-size:13px;line-height:1.3}
.sg-travel-note{line-height:1.3}
.modal:has([data-sg]) .sg-wheel-list p{font-size:13px;line-height:1.35;grid-template-columns:91px minmax(0,1fr);margin:4px 0}
@media(min-height:601px) and (max-height:720px){
 .sg-bingo .sg-book{margin-top:6px;padding-top:8px}.sg-bingo .sg-grid{grid-template-rows:repeat(3,34px)}
 .sg-bingo .sg-book>img[src$="book_frame.png"]{height:28px;top:-12px}
}
/* 320×568でも道の二段・帳面・サイコロを同じ画面へ。道の座標は縮めない。 */
@media(max-height:600px){
 .sg.sg-bingo{gap:2px}
 .sg-bingo .sg-top{height:54px}
 .sg-bingo .sg-leg{padding:3px 6px}
 .sg-bingo .sg-leg b{font-size:13px;line-height:16px;white-space:nowrap}
 .sg-bingo .sg-days{margin:2px 0}.sg-bingo .sg-days i{height:5px}
 .sg-bingo .sg-leg small{line-height:16px}
 .sg-wallet{gap:2px}.sg-bingo .sg-wallet .sg-leaf{height:28px;font-size:16px}.sg-wallet .sg-leaf>.sg-art{height:24px}
 .sg-bingo .sg-wallet .sg-tools{height:24px}#app .sg-bingo .sg-tools .btn{min-height:24px}
 .sg-bingo .sg-stage{height:160px;min-height:160px;flex:0 0 160px}
 .sg-bingo .sg-road-window{top:-12px}.sg-bingo .sg-traveler{width:32px;height:32px}.sg-bingo .sg-piece img,.sg-bingo .sg-piece svg{height:32px}
 .sg-bingo .sg-book{margin-top:0;padding:0 5px 4px}
 .sg-bingo .sg-book>img[src$="book_frame.png"]{top:-4px;height:12px}
 .sg-bingo .sg-book-head{height:18px;line-height:18px;margin-bottom:2px;font-size:13px}.sg-bingo .sg-book-head strong{font-size:14px}
 .sg-bingo .sg-grid{grid-template-rows:repeat(3,28px);gap:2px}
 .sg-bingo .sg-cell{padding:0 25px 0 1px;gap:1px}.sg-bingo .sg-cell>.sg-art{width:23px;height:23px}.sg-bingo .sg-seal{width:25px;height:25px}
 .sg-bingo .sg-stats{height:30px}.sg-bingo .sg-st{padding:0;line-height:12px;min-height:0}.sg-bingo .sg-st b{display:block;line-height:14px}
 .sg-bingo .sg-team{height:36px;margin:0}.sg-bingo .sg-tm-face{height:30px;width:30px}.sg-bingo .sg-tm-face img{height:28px}
 .sg-bingo .sg-act{height:44px;margin-bottom:0}.sg-bingo .sg-roll{min-height:44px;font-size:17px}.sg-bingo .sg-roll-art{height:27px;width:27px}.sg-bingo .sg-bagbtn{flex-basis:64px;line-height:1.2}
 .modal:has([data-sg]) .sg-wheel{width:180px;height:180px;margin:2px auto}.modal:has([data-sg]) .sg-wheel-choice{width:72px}.modal:has([data-sg]) .sg-wheel-choice img{width:24px;height:24px}
 .modal:has([data-sg]) .sg-wheel-list p{margin:2px 0}
}
@media(max-width:400px){
 #app .modal:has([data-sg]){border-width:18px 18px!important;border-image-width:18px 18px!important}
}
/* 時成通りの修行中は、夜のイベント・仲間のイベントの窓も紙と木枠に */
body:has(.sg-bingo) #app .modal:has(.scene){padding:4px 2px!important;border-style:solid!important;border-color:transparent!important;border-width:28px 30px 28px 32px!important;border-image:url(art/sg/panel.png) 170 195 170 210 fill / 28px 30px 28px 32px stretch!important;background:none!important;box-shadow:none!important}
body:has(.sg-bingo) #app .modal:has(.scene):before,body:has(.sg-bingo) #app .modal:has(.scene):after{display:none!important}
/* 日付の木札の文字は金具の内側。技・ログ・中断は1行で */
#app .sg-bingo .sg-leg{padding:6px 30px!important}
#app .sg-bingo .sg-tools .btn{padding:0!important;font-size:11px!important;white-space:nowrap!important;letter-spacing:0!important;min-width:0}
.ms-sum:has(.ms-sum-note){position:relative}.ms-sum-note{position:absolute;right:7px;top:3px;font-size:10px;font-weight:700;color:#e9d3a6;line-height:1;white-space:nowrap;-webkit-text-stroke:0;letter-spacing:0}
#app .modal:has([data-sg]) .sg-book{margin-top:24px!important}
/* 2026-10-29 修行の準備：画面全体は動かさず、仲間の一覧だけを枠の中で動かす（帯と下のタブの分をのぞいた高さに収める） */
.page-setup .su-wiz{height:calc(100dvh - 80px - 63px - env(safe-area-inset-bottom));min-height:0!important;overflow:hidden}
.page-setup .su-body{flex:1 1 auto;min-height:0;padding-bottom:6px!important;display:flex;flex-direction:column;overflow-y:auto}
.page-setup .su-body>.pk-grid{flex:1 1 0;align-content:start;min-height:0;overflow-y:auto;overscroll-behavior:contain}

/* 2026-10-29 ユーザー：ストーリーと修行の下が空いているので、ホーム全体を下へ（下のタブのすぐ上まで） */
.home2{padding-bottom:16px}
/* 2026-10-30 ユーザー：時成通りの直し。すごろくを広く（空いていた下のすき間を道にまわす）・マスを大きく・絆を色で・道具の札・タップで進む */
.sg.sg-bingo .sg-stage{height:auto!important;flex:1 1 0!important;min-height:150px!important;max-height:none!important}
.sg-bingo .sg-act{margin-top:0!important}
.sg-road-row{height:92px}
.sg-path-tile{width:42px;height:42px}
.sg-path-tile>.sg-art{inset:-5px;width:52px;height:52px}
.sg-path-tile>span{top:44px;font-size:12px}
.sg-traveler,.sg-bingo .sg-traveler{width:52px;height:52px}.sg-bingo .sg-piece img,.sg-bingo .sg-piece svg{height:52px}
.sg-bingo .sg-road-window{top:0}
.sg-bingo .sg-bond{height:14px;margin-top:2px;background:#3a2a1a!important;border:2px solid #2a1f16;border-radius:3px;overflow:hidden}
.sg-bond i{background:#a89676}.sg-bond.b-mid i{background:linear-gradient(#ffe47a,#f0b020)}.sg-bond.b-hi i{background:linear-gradient(#ff8a5a,#e2381c);box-shadow:0 0 6px #ff6a3a}
.sg-bond u{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#2a1f16cc}
.sg-bond b{position:absolute;inset:0;display:grid;place-items:center;font:900 11px/1 var(--game-font);color:#fff;text-shadow:1px 1px 0 #2a1f16,-1px -1px 0 #2a1f16,1px -1px 0 #2a1f16,-1px 1px 0 #2a1f16}
#app .sg-bingo .sg-bagbtn{padding:16px 0 2px!important;justify-content:center;gap:0}
#app .sg-bingo .sg-bagbtn b{font-size:15px;line-height:1.1;color:#4a2a12}#app .sg-bingo .sg-bagbtn small{font-size:12px;line-height:1.1;color:#4a2a12}
.sg-tap{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);z-index:6;padding:4px 14px;background:#352316eb;color:#fff4ce;font:900 14px var(--game-font);border-radius:4px;pointer-events:none;animation:sgTapBlink 1.2s ease-in-out infinite}
@keyframes sgTapBlink{50%{opacity:.55}}
.sg-stage-cue.landed{font-size:20px}
/* 2026-10-30 ユーザー：時成通り2。ビンゴ帳はボタンで開く・印のときだけ帳面が出てはんこをポン・文字を枠に収める */
.sg-bingo .sg-act{display:flex;gap:6px}
#app .sg-bingo .sg-bookbtn{flex:0 0 82px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0;padding:2px 0!important;border:2px solid #4f2917!important;border-image:none!important;background:#ebd29a url(art/sg/button.png) center/100% 100% no-repeat!important;font-family:var(--game-font);color:#4a2a12;white-space:nowrap}
#app .sg-bingo .sg-bookbtn b{font-size:14px;line-height:1.15}#app .sg-bingo .sg-bookbtn small{font-size:12px;line-height:1.15;color:#9e321b;font-weight:900}
#app .sg-bingo .sg-bagbtn{position:relative;flex:0 0 70px;padding:14px 0 0!important}
#app .sg-bingo .sg-bagbtn em{position:absolute;top:-4px;right:-4px;font-style:normal;background:#b8402a;color:#fff;font:900 11px/1 var(--game-font);min-width:18px;height:18px;border-radius:9px;border:2px solid #fff6df;display:grid;place-items:center}
.sg-bingo .sg-wallet .sg-leaf{font-size:15px!important;white-space:nowrap;overflow:hidden}.sg-bingo .sg-wallet .sg-leaf>small{font-size:10px!important}.sg-bingo .sg-wallet .sg-leaf>.sg-art{width:16px!important;height:22px!important}
.sg-book-head{padding-right:6px}
.sg-book-pop{position:absolute;left:6px;right:6px;top:50%;transform:translateY(-50%);z-index:7;animation:sgBookIn .2s ease-out}
.sg-book-pop .sg-book{margin:0!important}
@keyframes sgBookIn{from{opacity:0;transform:translateY(-44%)}}
.sg-hanko{position:absolute;left:auto;right:-14px;top:50%;width:62px;height:62px;margin:-58px 0 0 0;z-index:9;pointer-events:none;filter:drop-shadow(0 6px 3px #0006);animation:sgHanko .38s cubic-bezier(.5,0,.8,.5) both}
@keyframes sgHanko{0%{transform:translateY(-140px);opacity:0}25%{opacity:1}80%{transform:translateY(0) scaleY(1)}90%{transform:translateY(4px) scaleY(.9)}100%{transform:translateY(0)}}
.sg-wheel.stopped [data-wheel].chosen{transform:translate(-50%,-50%) scale(1.25);z-index:4}
.sg-bondw small{white-space:nowrap}
/* 2026-10-30 ユーザー：ライン完成が殺風景 → くす玉（チャッピー）と、能力の札（stat_board）で */
.sg-line-result{position:relative;padding-top:100px}
.sg-line-result .sg-kusu{position:absolute;left:-8%;right:-8%;top:-18px;width:116%;height:auto;pointer-events:none;animation:sgKusu .35s ease-out both}
@keyframes sgKusu{from{opacity:0;transform:translateY(-14px)}}
.sg-line-result .sg-line-title{position:relative;z-index:1;-webkit-text-stroke:0;paint-order:stroke;text-shadow:0 0 3px #fff6df,0 0 3px #fff6df,2px 2px 0 #fff6df;font-size:clamp(28px,8.5vw,36px);margin:4px 0 6px;text-shadow:2px 2px 0 #fff6df}
.sg-line-gains{gap:6px;margin:8px 0 16px}
.sg-line-gains .sg-st{background:#2a1f16 url(art/sg/stat_board.png) center/100% 100%;padding:4px 0 2px;border-radius:4px}
.sg-line-gains .sg-st span{color:#f3dfb0;font-size:13px}.sg-line-gains .sg-st b{color:#ffd84a;font-size:26px;line-height:1.2}
.modal:has(.sg-wheel.stopped) [data-sg="spin"]{opacity:1!important;filter:none!important}
/* 2026-10-30 ユーザー：まちかどの結果を専用の画面に（出来事の絵・伸びた能力の札） */
.sg-res-art{margin:-4px -4px 6px;height:180px;border:3px solid #563518;border-radius:4px;overflow:hidden;background:#e9d29a;display:grid;place-items:center}
.sg-res-art.low{height:118px}
.sg-res-art img{width:100%;height:100%;object-fit:cover}.sg-res-art img.icon{width:auto;height:84%;object-fit:contain}
.sg-res-text{margin:6px 4px;text-align:center;font:900 17px/1.45 var(--game-font);color:#502c13}
.sg-res-gains{grid-template-columns:repeat(3,minmax(0,1fr));margin:6px 0 10px}
#app .sg-bingo .sg-bagbtn,#app .sg-bingo .sg-bagbtn b{text-align:center;align-items:center;justify-content:center}
#app .sg-bingo .sg-bagbtn b{display:block;width:100%}
.modal [data-sg="spin"].sg-decided{font-size:16px!important;white-space:nowrap;padding-left:8px!important;padding-right:8px!important}
.sg-res-art img{object-position:50% 62%}.sg-res-art.low img{object-position:50% 70%}
/* 2026-10-30 ユーザー「これなに」：帳面の上に小さく浮く綴じ紐の棒は意味が伝わらないので出さない */
.sg-book>img[src$="book_frame.png"],.sg-book>.sg-art[src*="book_frame"]{display:none!important}
/* 2026-10-30 ユーザー：仲間えらび。上のすき間をなくす・並べかえを見えるように・札は顔を隠さない（商才はランクだけ）・★と+を横1列に */
.page-setup .su-deckhead{position:static;top:auto;padding-bottom:2px}
.page-setup .su-decks{margin-top:0}
.page-setup .su-sort{margin:4px 0 2px;flex-wrap:nowrap}
.su-shlabel{display:inline-flex;align-items:center;gap:2px;margin-right:auto;font:900 11px var(--game-font);color:#5a3a1c;white-space:nowrap}.su-shlabel img{height:20px;width:auto}
.pk .spec.sh-only,.su-slot .spec.sh-only{position:absolute;top:2px;right:2px;left:auto;width:22px;height:22px;padding:0;background:none;border:0}
.pk .spec.sh-only img,.su-slot .spec.sh-only img{width:100%;height:100%;object-fit:contain}
.pk small{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:1px;white-space:nowrap}
.pk small>*{flex-shrink:0}
/* 選んでいる並べかえも、ほかのボタンと同じ大きさ（2026-10-30） */
#app .page-setup .su-sort .btn.small{flex:0 0 auto;min-width:64px;height:34px;min-height:34px;padding:0 10px!important;font-size:13px!important;margin:0}
#app .page-setup .su-sort .btn.small.primary{border-width:7px 14px 8px!important;border-image-width:7px 14px 8px!important}
#app .page-setup .su-sort .btn.su-filt.filt{color:#a3220f!important}
/* しぼりこみを足しても1行に収める（2026-10-30） */
#app .page-setup .su-sort{gap:3px}
#app .page-setup .su-sort .btn.small{min-width:0;flex:1 1 auto;padding:0 4px!important;font-size:12px!important;border-width:6px 9px 7px!important;border-image-width:6px 9px 7px!important}
#app .page-setup .su-sort .btn.su-filt{flex:1.4 1 auto}
.page-setup .su-shlabel{margin-right:2px}.page-setup .su-shlabel img{height:18px}
/* 2026-10-30 ユーザー：編成の名前（左）・ロック・番号（右寄せ・少し小さく） */
.page-setup .su-decks{display:flex;align-items:center;gap:4px}
.page-setup .su-dname{flex:1 1 auto;min-width:0;height:32px;padding:0 6px;text-align:left;font:900 15px var(--game-font);color:#3a2a1c;background:none;border:0;border-bottom:2px dashed #b08a5a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.page-setup .su-lock{flex:0 0 auto;height:28px;padding:0 6px;font:900 11px var(--game-font);color:#5a3a1c;background:#f3e2bd;border:2px solid #8a5a2a;border-radius:4px;white-space:nowrap}
.page-setup .su-lock.on{background:#a3311c;color:#fff6df;border-color:#5a160c}
.page-setup .su-dks{display:flex;gap:3px;flex:0 0 auto;margin-left:auto}
.page-setup .su-dk{width:32px!important;height:32px!important;font-size:14px!important}
.pk-grid.locked .pk{opacity:.55;pointer-events:none}.pk-grid.locked .pk.on{opacity:1}
.su-name-in{width:80%;font:900 18px var(--game-font);padding:6px 8px;border:2px solid #8a5a2a;border-radius:4px;background:#fffaf0;text-align:center}
/* 編成ロックは錠前の絵（チャッピー）。開いている＝ロックなし、閉じている＝ロック中 */
.page-setup .su-lock{width:34px;height:34px;padding:0;background:none;border:0;display:grid;place-items:center}
.page-setup .su-lock img{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 2px 0 #2a1f16)}
.page-setup .su-lock:not(.on) img{opacity:1}
.page-setup .su-lock.on{background:none}
#app .page-setup .su-decks .su-clear{flex:0 0 auto;min-width:0;height:30px;min-height:30px;padding:0 4px!important;font-size:12px!important;border-width:6px 9px 7px!important;border-image-width:6px 9px 7px!important;margin:0;white-space:nowrap}
.name-err{margin:0 0 6px;text-align:center;color:#a3220f;font-weight:900;font-size:13px}
.pf-row{display:flex;align-items:center;gap:8px;margin:10px 4px 6px}.pf-row span{font-size:13px;font-weight:900;color:#6d5a40}.pf-row b{flex:1;min-width:0;font:900 18px var(--game-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-note{margin:0 0 8px;text-align:center;font-size:12px;color:#6d5a40}
/* 2026-10-30 ユーザー：窓の見出しが上の縄の飾りにかぶる → 窓を少し縦に伸ばして見出しを下げる */
.overlay>.modal{padding-top:14px}
/* 受け取り箱の札をミッションの帯から少し上へ */
.ib-btn{margin-top:0!important;margin-bottom:6px!important}
/* 2026-10-30 ユーザー：受け取り箱の文字は板なしの文字の絵（チャッピー） */
#app .ib-btn{border:0!important;border-image:none!important;background:none!important;box-shadow:none!important;height:44px;padding:0 4px 0 52px!important;display:flex;align-items:center}
#app .ib-btn .ib-moji{height:30px;width:auto;filter:drop-shadow(0 2px 0 #1a0f08)}
/* 2026-10-30 設定の窓：タブ（オプション／修行）。中身の高さは固定（タブを替えても窓が伸び縮みしない） */
.set-tabs{display:flex;gap:6px;margin:4px 0 0}
.set-tab{flex:1;height:36px;font:900 15px var(--game-font);color:#5a3a1c;background:#e9d6ac;border:2px solid #8a5a2a;border-bottom:0;border-radius:6px 6px 0 0}
.set-tab.on{background:#fff6df;color:#a3311c}
.set-body{min-height:176px;margin-top:0!important;padding:12px 8px;background:#fff6df;border:2px solid #8a5a2a;border-radius:0 0 6px 6px}
/* 設定のタブは木の板の絵（えらんでいる＝明るい板、ほか＝灰の板） */
.set-tab{border-style:solid!important;border-width:6px 14px 7px!important;border-image-width:6px 14px 7px!important;border-radius:0;height:40px}
.set-tabs{margin-bottom:6px}.set-body{border-radius:6px}
/* 2026-10-30 音量（BGM・効果音 0〜10）。棒はゲージの絵 */
.ts-row>b{display:flex;align-items:baseline;gap:6px}.vol-row>b{display:flex;align-items:baseline;gap:6px}.vol-row>b small{font-size:11px;color:#8a6a4a}
.vol{display:flex;align-items:center;gap:6px}
#app .vol .btn.small{flex:0 0 40px;min-width:0;height:36px;min-height:36px;padding:0!important;font-size:18px!important;margin:0}
.vol-bar{position:relative;flex:1;height:26px;background:url(art/ui/bar/gd_frame.png) center/100% 100% no-repeat}
.vol-bar i{position:absolute;left:5.5%;top:22%;bottom:22%;max-width:89%;background:url(art/ui/bar/gd_fill.png) left center/auto 100% no-repeat;background-size:100% 100%}
.vol-bar i{width:calc(var(--w,0) * 1%)}
.vol em{flex:0 0 22px;font:900 16px var(--game-font);font-style:normal;text-align:center}
.ts-row>b small{font-size:11px;color:#8a6a4a}
/* 設定：タブ3つを1行に・中身の高さはいちばん高いオプションに合わせて固定 */
.set-tab{font-size:13px!important;white-space:nowrap;padding:0 2px!important}
.set-body{height:262px;min-height:262px;box-sizing:border-box}
/* 設定・修行の中の修行地タブ */
.set-sub{display:flex;gap:6px;margin:-4px 0 4px}
.set-stab{flex:1;height:30px;font:900 12px var(--game-font);white-space:nowrap;border-style:solid!important;border-width:5px 12px 6px!important;border-image-width:5px 12px 6px!important}
.set-body{height:300px;min-height:300px}
.set-body .ts-row{gap:4px}.set-body.ts-list{gap:8px}
.set-body .ts-seg .btn{font-size:14px!important}
.set-note{font-size:11px;color:#8a6a4a;text-align:right}
/* 2026-10-30 ユーザー：音量・速さの −/＋ を真ん中に（板の縁が太くて中が狭かった） */
#app .vol .btn.small{display:flex!important;align-items:center;justify-content:center;line-height:1!important;border-width:5px 8px 6px!important;border-image-width:5px 8px 6px!important;padding:0!important;font-size:20px!important}
/* 2026-10-30 ユーザー：止まったマスの帯が上に出るとコマが隠れる → 帯は下（「○マス目に到着」の上）に。「タップで次へ」は上に */
.sg-stage-cue.landed,.sg-stage-cue.stamping{top:auto!important;bottom:22px;border-bottom:0;border-top:3px solid #aa732b}
.sg-tap{bottom:auto!important;top:8px}
/* 2026-10-30 はんこのパラパラ漫画（印の真上に重ねる）と、ポンと押された印 */
.sg-hanko-flip{position:absolute;right:-36px;top:calc(50% - 94px);width:108px;height:108px;z-index:9;pointer-events:none;filter:drop-shadow(0 4px 2px #0005)}
.sg-seal.sg-stamp-pop{animation:sgStampPop .32s cubic-bezier(.2,1.8,.4,1) both;opacity:.92}
@keyframes sgStampPop{0%{transform:translateY(-50%) scale(1.7);opacity:0}45%{opacity:1}100%{transform:translateY(-50%) scale(1)}}
/* 2026-10-30 ガチャの実が割れるパラパラ漫画（カードの上に重ねる・金はカットインの真ん中に大きく） */
.g-flip{position:absolute;left:50%;top:50%;width:170%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:5;pointer-events:none}
.g-flip.big{width:min(86vw,360px)!important;height:min(86vw,360px)!important;inset:auto!important;left:50%!important;top:50%!important;margin:0!important;border:0!important;background-color:transparent!important;animation:none!important}
.g-card .g-flip~.g-back,.g-card:has(.g-flip) .g-back{opacity:0}
.g-cut.flipping .g-orb>.fruit,.g-cut.flipping .g-orb>i:not(.g-flip){opacity:0}
.g-orb{position:relative}
/* 金の実：新しいパラパラ漫画を見せる。前の★3の絵（光線つき）と放射状の光は出さない（ユーザー：日章旗のような光線はいや） */
.g-cut.flipping .g-star3,.g-cut.flipping .g-rays,.g-anim .g-rays{display:none!important}
.g-cut .g-flip.big{z-index:30}
.g-cut.flipping .g-orb{animation:none;filter:none}
/* ★3のカットインの背景：光線の絵をやめて、やわらかい光（ユーザー：日章旗のような光線はいや） */
.g-cut::before{background:radial-gradient(circle at 50% 46%,#fff3c4 0,#e7b84a55 22%,#3a2a6a 55%,#0b0816 85%)!important;filter:none!important}
.g-flip{box-shadow:none!important;filter:none!important;outline:0!important;border-radius:0!important;background-color:transparent!important;border:0!important}
.g-cut>.g-flip.big{position:absolute;transform:translate(-50%,-55%)}
/* ★3の決めポーズ（ドット絵のパラパラ漫画） */
.g-kime{display:block;image-rendering:pixelated;filter:drop-shadow(0 0 14px #ff5a5a) drop-shadow(0 0 14px #5aa8ff) drop-shadow(0 0 10px #fff35a)}
.g-reveal .mon-img.g-kime-back{animation:gKimeBack .25s ease-out}
@keyframes gKimeBack{from{opacity:.6}}
/* 2026-10-30 ユーザー：止まったマスの帯と「○マス目に到着」の間の隙間をなくす（帯の高さをそろえる） */
.sg-travel-note{height:22px;line-height:22px;padding:0 6px;box-sizing:border-box}
/* 2026-10-30 ユーザー：受け取り箱のボタンに背景の絵（赤の国の荷受け所。チャッピー） */
#app .ib-btn{background:#3a2412 url(art/ui/inbox_bg.jpg) center 40%/cover no-repeat!important;height:50px;border-radius:6px;box-shadow:inset 0 0 0 2px #2a170b,inset 0 0 14px #0008,0 2px 0 #1a0f08!important;padding-left:58px!important}
/* 2026-10-30 ユーザー：ピックアップ・提供割合・巻物の文字を板の真ん中に（下に寄っていた） */
#app .g4-btns .btn{padding-bottom:3px!important;line-height:1}
/* 2026-10-30 ユーザー：はじめての10連のあとのブル。ふき出しを横いっぱいに、ブルは大きく下に（空きをなくす） */
.ff-say{display:flex;flex-direction:column;align-items:center;margin:18px 0 4px}
.ff-say .guide-say{flex:none;width:100%;box-sizing:border-box;margin:0 0 16px;padding:12px 12px 10px;text-align:center}
.ff-say .guide-say b{position:absolute;left:10px;top:-12px}
.ff-say .guide-say p{font-size:16px;line-height:1.7}
.ff-say .guide-say::before{left:50%;bottom:-20px;transform:translateX(-50%);border:10px solid transparent;border-top:14px solid #2a1f16;border-bottom:0}
.ff-say img{height:118px;width:auto;filter:drop-shadow(2px 3px 0 #2a1f16)}
/* 2026-10-31 決める前の10連を見直すボタン（2つのボタンの下、真ん中） */
#app .g3-first-view{display:block;margin:4px auto 0!important;height:30px;min-height:0;padding:0 14px 3px!important;font-size:13px}
/* 2026-10-31 ユーザー：ホームの背景にうっすらドット（前もって縮めた絵 art/bg/home3_dot.png を、ぼかさずに広げて見せる） */
.home2-bg{background-image:url(art/bg/home3_dot.png)!important;image-rendering:pixelated}
/* 2026-10-31 ユーザー：仲間一覧とガチャの背景にも、ホームと同じくらいのうっすらドット（前もって縮めた絵をぼかさず広げる） */
.nk-bg{background:linear-gradient(#1a0f0859,#1a0f0859),url(art/bg/nakama_dot.png) center/cover no-repeat,url(art/bg/train_dot.png) 22% center/cover no-repeat,#1d1510!important;image-rendering:pixelated}
.nk-bg.after{background:linear-gradient(#1a0f0859,#1a0f0859),url(art/bg/nakama_after_dot.png) center/cover no-repeat,url(art/bg/train_dot.png) 78% center/cover no-repeat,#1d1510!important}
.gacha2-bg{background-image:url(art/bg/gacha_dot.png)!important;image-rendering:pixelated}
/* 2026-10-31 ユーザー：仲間の詳細。レベル解放はボタンだけにして、押したら重ねて見せる */
.nk-lvbtn{display:flex;align-items:center;justify-content:center;gap:8px;height:38px;min-height:0;margin:2px 0 0!important;font-size:15px;padding:0 10px 3px!important}
.nk-lvbtn small{font-size:11px;opacity:.85}
.nk-lvbox{position:absolute;inset:0;z-index:19;display:flex;align-items:center;justify-content:center;background:#000a;padding:10px}
.nk-lvbox-in{width:100%;border-style:solid;border-width:10px 22px 10px;border-image:url(art/ui/mat/washi.png) 30 60 30 60 fill/10px 22px 10px stretch;filter:drop-shadow(0 4px 0 #2a1f16);padding:4px 0 10px;color:#3a2614;display:flex;flex-direction:column;gap:6px}
.nk-lvbox-x{align-self:center;margin:4px 0 0!important}
/* 得意・商才は1段に（名前が長い得意でも折り返さない） */
.nk2 .nk-tags2{flex-wrap:nowrap}
.nk2 .nk-tags2 li{padding:1px 6px;gap:3px;white-space:nowrap;min-width:0}
.nk2 .nk-tags2 b{font-size:14px}
/* ★を上げる／レベルを上げるが横にはみ出さない */
.nk-grow2 .nk-g{min-width:0;overflow:hidden}
.nk-grow2 .nk-g small{font-size:11px;gap:2px}
.nk-grow2 .ico{width:14px;height:14px}
#app .nk-grow2 .nk-g,#app .nk-lvbtn{border-width:8px 12px!important;border-image-width:8px 12px!important}
#app .nk-lvbtn{white-space:nowrap;flex-direction:row}
.nk-grow2 .nk-g small{font-size:10.5px}
#app .nk-grow2 .nk-g{padding-left:0!important;padding-right:0!important;border-width:8px 9px!important;border-image-width:8px 9px!important}
.nk-grow2 .nk-g small{gap:1px}.nk-grow2 .ico{width:13px;height:13px}
/* 2026-10-31 ユーザー：技の「通常・技1・奥義」の札が外枠と同じ枝と紅葉でガチャガチャ → 縄でつるした木の札（チャッピー） */
.nk2 .nk-skills em{border-style:solid!important;border-image:url(art/ui/nk_tag2.png) 22 70 22 70 fill/4px 11px 4px 11px stretch!important;color:#3a2410!important;padding:3px 10px 2px!important}
.nk2 .nk-skills li.ougi em{border-image-source:url(art/ui/nk_tag2_ougi.png)!important;color:#fff6df!important}
/* 2026-10-31 ユーザー：レベル解放の窓の中身がはみ出していた → 窓の内側に余白、5枚を等しい幅に、見出しは2段 */
.nk-lvbox{padding:10px 14px}
.nk-lvbox-in{padding:6px 4px 10px!important;max-width:340px}
.nk-lvbox .nk-h{flex-direction:column;align-items:flex-start!important;gap:2px;margin:0 2px}
.nk-lvbox .nk-perk-next{align-self:flex-end}
.nk-lvbox .nk-perks{grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin:2px 2px 4px}
.nk-lvbox .nk-perk{min-width:0;overflow:hidden;padding:3px 1px 4px}
.nk-lvbox .nk-perk b{font-size:10.5px;max-width:100%;overflow:hidden;text-overflow:clip}
.nk-lvbox .nk-perk small,.nk-lvbox .nk-perk-sh{font-size:9.5px}
.nk-lvbox{padding:8px 4px}
.nk-lvbox-in{max-width:none;border-width:10px 12px!important;border-image-width:10px 12px!important}
.nk-lvbox .nk-perk b{font-size:11.5px}.nk-lvbox .nk-perk small,.nk-lvbox .nk-perk-sh{font-size:10.5px}
.nk-lvbox .nk-perk img{width:32px!important;height:32px!important}
/* 札の名前は2行まで（どの札も同じ高さ） */
.nk-lvbox .nk-perk b,.nk-lvbox .nk-perk b.long,.nk-lvbox .nk-perk b.long2{white-space:normal;font-size:11px;letter-spacing:0;line-height:1.15;height:2.3em;display:flex;align-items:center;justify-content:center;text-align:center;overflow:visible}
/* 窓の中は横5枚でなく、縦に5行（名前が長くても折り返さない） */
.nk-lvbox .nk-perks{grid-template-columns:1fr;gap:3px}
.nk-lvbox .nk-perk{flex-direction:row;justify-content:flex-start;gap:8px;padding:3px 10px!important}
.nk-lvbox .nk-perk img{width:28px!important;height:28px!important}
.nk-lvbox .nk-perk small{font-size:12px;width:38px;text-align:left}
.nk-lvbox .nk-perk b,.nk-lvbox .nk-perk b.long,.nk-lvbox .nk-perk b.long2{flex:1;height:auto;justify-content:flex-start;text-align:left;white-space:nowrap;font-size:14px}
.nk-lvbox .nk-perk .nk-perk-sh{font-size:12px;font-style:normal}
.nk-lvbox .nk-perk .nk-perk-sh{flex:none;white-space:nowrap}.nk-lvbox .nk-perk b{min-width:0}
/* 二つ名つきの名前：上に小さく二つ名、下に名前 */
.nm2{display:inline-flex;flex-direction:column;align-items:center;line-height:1.05;vertical-align:middle;white-space:nowrap}
.nm2>small{font-size:.58em;letter-spacing:.02em;opacity:.9;font-weight:inherit}
.nm2>b{font:inherit}
.nk-name .nm2,.nk-id .nm2{align-items:flex-start}
.page-nakama .nk-card .nk-name:has(.nm2){font-size:12px;letter-spacing:0;line-height:1;overflow:visible}
.page-nakama .nk-card .nk-name .nm2>small{font-size:.7em}
/* 2026-10-31 ユーザー：仲間一覧の名前の欄をそろえる。全員、二つ名の行ぶん1行あけて（二つ名の行は少し低く）、名前は下の行に */
.page-nakama .nk-card .nk-name{height:21px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;line-height:1.05;overflow:visible}
.page-nakama .nk-card .nk-name .nm2{line-height:1}
.page-nakama .nk-card .nk-name .nm2>small{font-size:8px;line-height:9px;height:9px}
.page-nakama .nk-card .nk-name:has(.nm2){font-size:11px}
/* 二つ名の行をもう少し低く（文字も縦につぶす） */
.page-nakama .nk-card .nk-name{height:18px}
.page-nakama .nk-card .nk-name .nm2>small{font-size:8px;line-height:6px;height:6px;transform:scaleY(.75);transform-origin:center bottom}
/* 2026-10-31 実機調査：全部止まったあとも、キャラの小さな動きを続ける（止まった絵にしない）。立ち止まったコマと、戦闘画面のコマの背中が小さく息をする */
@keyframes sxIdleBreath{50%{translate:0 -2%}}
.sx-lcd.stop .sx-walk img.on{animation:sxIdleBreath 1.8s ease-in-out infinite}
.sx-lcd.pk .pk-hero:not(.pslash):not(.phit){animation:sxIdleBreath 2.2s ease-in-out infinite}
/* 2026-10-31 実機調査：レア役を止めた直後、コマが一動作（小さく跳ねてふり向く）。約0.9秒で終わる */
@keyframes sxReact{30%{translate:0 -10%}60%{translate:0 0}}
.sx-lcd .sx-walk.react img.on,.sx-lcd .sx-srun.react img.on{animation:sxReact .45s ease-out 2}
/* 2026-10-31 実機調査：決着の絵。負けは敵が奥へ逃げて消える（倒れる sxDead とは別の出口） */
.sx-mon.flee img{transition:translate .7s ease-in,opacity .7s ease-in;translate:30% -12%;opacity:0}
/* 2026-10-31 スロット：ウェイトカットの札（2段の文字） */
#sl-host .sx-opt.sx-opt2{font-size:9px;line-height:1.05;padding-top:2px;padding-bottom:2px}
/* 2026-10-31 ユーザー：スロットのパラパラ漫画（sa01〜21）。8枚を重ねて .on の1枚だけ見せる。絵は 512×512 で人物が少し小さいので、今の歩きより少し大きい箱（足の位置は同じ） */
.sx-anim{display:none;position:absolute;left:3%;bottom:3.6%;height:47%;aspect-ratio:1/1;z-index:6;pointer-events:none}
.sx-anim.on{display:block}
.sx-anim img{position:absolute;inset:0;width:100%!important;height:100%!important;visibility:hidden;image-rendering:pixelated}
.sx-anim .fa.on img.on{visibility:visible}
/* 2026-10-31 ユーザー：「主人公の絵がダブってる」→ 古い歩き・走りは中の img に visibility:visible!important があり、箱を visibility で隠しても見えていた。箱ごと display で消す */
.sx-lcd.anim-on .sx-walk,.sx-lcd.anim-on .sx-srun,.sx-lcd.anim-on .sx-run{display:none!important}
.sx-lcd.anim-on .pk-hero{visibility:hidden!important}
.sx-anim .fa:not(.on){display:none!important}
.sx-lcd.stop .sx-anim.ma .fa.on img.on{animation:sxIdleBreath 1.8s ease-in-out infinite}
.sx-lcd.pk .sx-anim.ma{left:1%;bottom:-2%;height:62%}
/* 2026-10-31 ユーザー：「ん？」の前兆（03）のあいだは立ち止まっているので、道のスクロールも止める。ART中はコマを真ん中に */
.sx-lcd.hint3 .rd-strip{animation-play-state:paused!important}
.sx-lcd.m-art .sx-anim.ma{left:50%;translate:-50% 0;bottom:3%;height:58%}
/* 2026-10-31 ユーザー：突入画面の勝ち（09）・負け（10）と、7を狙え（11）のコマ。絵がある時は今の1枚絵を隠す */
.sx-entry .sx-anim.en-anim{left:auto;right:-4%;bottom:-2%;height:76%;z-index:3}
.sx-entry.has-anim .en-art{visibility:hidden!important}
.sx-aim .sx-anim.aim-anim{left:-6%;bottom:0;height:54%;z-index:4}
.sx-aim.has-anim .aim-koma{visibility:hidden!important}
/* 2026-10-31 ユーザー：上乗せのコマ（14）・雷獣（17〜21）のパラパラ漫画。絵がある時は今の1枚絵を隠す */
.sx-upfx.anim .sx-anim.up-anim{display:block;left:50%;bottom:0;height:92%;translate:-50% 0;z-index:3}
.sx-mon .sx-anim.mon-anim{left:-5%;bottom:0;width:110%;height:auto;z-index:3}
.sx-mon.has-anim>img{visibility:hidden!important}
.sx-mon.has-anim.dead .mon-anim img,.sx-mon.has-anim.flee .mon-anim img{animation:none!important;transition:none!important;translate:none!important;opacity:1!important}
.sx-lcd .sx-mon .sx-anim.mon-anim img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;animation:none!important;filter:none}
/* 2026-10-31 Codex検証：V1・C8「上乗せへの切り替えで主人公が2人重なる」。全面の画面（突入画面・上乗せ・ボーナス確定・7を狙え）が出ているあいだは、
   下のふだんの主人公（歩き・走り・背中・パラパラ漫画）を一瞬で消す。全面の画面どうしは上のものだけを見せる（上乗せのフェードの途中で前の画面の主人公が透けないように）。
   全面の画面の上に前兆のはずれの告知（気のせいか……）は出さない */
.sx-lcd:is(:has(>.sx-entry.on),:has(>.sx-upfx.on),:has(>.sx-kk.on),.aim7) :is(.sx-walk,.sx-srun,.sx-run,.sx-anim.ma){display:none!important}
.sx-lcd:is(:has(>.sx-entry.on),:has(>.sx-upfx.on),:has(>.sx-kk.on),.aim7) .pk-hero{visibility:hidden!important}
.sx-lcd:has(>.sx-upfx.on) :is(.sx-entry,.sx-aim,.sx-kk){display:none!important}
.sx-lcd:has(>.sx-kk.on) :is(.sx-entry,.sx-aim){display:none!important}
.sx-lcd:is(:has(>.sx-entry.on),:has(>.sx-upfx.on),:has(>.sx-kk.on)) .sx-big.lose{display:none!important}
/* 2026-10-31 Codex検証：V2・C2 連続演出の追跡（3段目）は、通常時でもARTと同じ走り（koma_srun）。背中の1枚絵は隠す */
.sx-lcd.chase .sx-srun{display:block;position:absolute;left:28%;bottom:2%;height:52%;aspect-ratio:1;translate:-50% 0;z-index:6;pointer-events:none;animation:runBob .16s ease-in-out infinite alternate}
.sx-lcd.chase .pk-hero,.sx-lcd.chase .sx-walk{visibility:hidden!important}
/* 2026-11-01 ユーザー：上乗せの数字は画面の真ん中に。GET は数字にかぶせず、右下にごく小さく */
.sx-upfx.v2.num .up-num{top:0;bottom:0;display:flex;align-items:center;justify-content:center}
.sx-upfx.v2.num .up-get{left:auto;right:3%;top:auto;bottom:4%;width:20%!important}
/* 2026-11-01 ユーザー：青い丸はリプレイの合図。採取の玉は青い丸にしない（緑のゆら結晶）。ナビは鈴の色（黄） */
.sx-gather .gem{border-radius:0;width:16px;height:22px;background:linear-gradient(160deg,#eaffd8,#6ad06a 45%,#1d7a3a);clip-path:polygon(50% 0,100% 30%,100% 75%,50% 100%,0 75%,0 30%);border:0;filter:drop-shadow(0 0 2px #1a1210)}
.sx-navi b{background:radial-gradient(circle at 50% 35%,#fff2a8,#e0a414 70%);border-color:#fff6d0;box-shadow:0 0 14px #ffc83a;color:#4a2a00}
/* 2026-11-01 ユーザー：上乗せ50G以下は少し小さく（100G以上は今の大きさ） */
.sx-upfx.v2.num .up-num.sm .up-plate{width:80%!important;margin-left:0}
.sx-upfx.v2.num .up-num.sm .up-pl{left:7%;width:13%!important}
/* 2026-11-01 ユーザー：前兆の光は白。強さは白い光の強さ（w1 弱い→w3 強い） */
.sx[data-frame=w1]::after{border-color:#ffffffaa;box-shadow:0 0 10px #ffffff88,inset 0 0 6px #ffffff66}
.sx[data-frame=w2]::after{border-color:#fff;box-shadow:0 0 20px #fff,inset 0 0 12px #ffffffaa;animation:sxLamp .25s steps(2) infinite}
.sx[data-frame=w3]::after{border-color:#fff;box-shadow:0 0 34px 6px #fff,inset 0 0 22px #fff;animation:sxLamp .12s steps(2) infinite}
/* 2026-11-01 ユーザー：最後のゲームは液晶の真ん中に「ラスト」 */
.sx-last{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:30;text-align:center;font:900 22cqh/1 "RocknRoll One",sans-serif;color:#ffe25a;-webkit-text-stroke:2px #3a1200;text-shadow:0 3px 0 #3a1200,0 0 16px #ff8a1a;opacity:0;pointer-events:none}
.sx-last.on{animation:sxLast 1.6s ease-out both}
@keyframes sxLast{0%{opacity:0;transform:translateY(-50%) scale(1.8)}12%{opacity:1;transform:translateY(-50%) scale(1)}80%{opacity:1;transform:translateY(-50%) scale(1)}100%{opacity:0;transform:translateY(-50%) scale(1)}}
/* 2026-11-01 ユーザー：「ん？」「気のせいか」は主人公のセリフ。頭の上の吹き出し（しっぽは短く口元へ） */
.sx-say{position:absolute;left:5%;bottom:53%;z-index:12;display:none;padding:.9cqh 2.6cqh;background:#fffaf0;color:#2a1608;border:3px solid #2a1608;border-radius:999px;font:800 6.6cqh/1.25 "RocknRoll One",sans-serif;text-align:center;white-space:nowrap;pointer-events:none}
.sx-say::after{content:"";position:absolute;left:24%;bottom:-2.6cqh;width:3cqh;height:3cqh;background:#fffaf0;border-right:3px solid #2a1608;border-bottom:3px solid #2a1608;clip-path:polygon(100% 0,100% 100%,0 100%);transform:skewX(-20deg)}
.sx-say.on{display:block;animation:sxSay .18s ease-out both}
@keyframes sxSay{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:none}}
.sx-lcd.m-art .sx-say{left:50%;bottom:62%;translate:-50% 0}
.sx-lcd.pk .sx-say{left:4%;bottom:60%}
.sx-lcd:is(:has(>.sx-entry.on),:has(>.sx-upfx.on),:has(>.sx-kk.on)) .sx-say{display:none!important}
.sx-lcd.m-art .sx-say::after{left:44%}
/* 2026-11-01 ユーザー：関所突破・雷鳴ラッシュ突入は、チャッピーの一枚絵を画面いっぱいに（文字の絵を上に） */
.sx-entry .en-pic{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;z-index:1;animation:upBgIn .3s ease-out both}
.sx-entry.res-pic .en-art,.sx-entry.res-pic .en-anim,.sx-entry.res-pic .en-sub{display:none!important}
.sx-entry.res-pic .en-ttl{z-index:3;left:0;right:0;top:6%;display:flex;flex-direction:column;align-items:center;-webkit-text-stroke:0}
.sx-entry.res-pic .en-ttl::after{content:none}
.sx-entry.res-pic .en-ttl img.en-moji{width:min(78%,320px)}
.sx-entry.res-rush .en-ttl img.en-logo{width:min(70%,300px);height:auto}
.sx-entry.res-rush .en-ttl img.en-moji{width:min(52%,220px);margin-top:-2%}
.sx-entry.res-pic .en-ttl em{font-size:30px;-webkit-text-stroke:6px #2a1408;paint-order:stroke fill}
/* 2026-11-01 ユーザー：雷の演出は CSS で描いた形をやめ、チャッピーの落雷パラパラ漫画（8コマ）に */
@keyframes boltStrip{0%{background-position:0 0;opacity:1}99%{opacity:1}100%{background-position:100% 0;opacity:0}}
.sx-rare .bolt,.sx-upfx .bolt{clip-path:none!important;background:url(art/slot/bolt_strip.png) 0 0/800% 100% no-repeat!important;width:auto!important;aspect-ratio:3/4;filter:drop-shadow(0 0 8px #8ad0ff);animation:boltStrip .5s steps(7,jump-none) both!important}
.sx-rare .bolt.b2{animation-delay:.14s!important}
.sx-upfx .bolt.b2{animation-delay:.16s!important}
.sx-fz .fz-bolt{inset:auto;left:30%;top:0;height:100%;width:auto;aspect-ratio:3/4;background:url(art/slot/bolt_strip.png) 0 0/800% 100% no-repeat!important;opacity:0}
.sx-fz.fzb .fz-bolt{animation:boltStrip .5s steps(7,jump-none) both!important}
.sx-lcd>.bolt.rjb{position:absolute;left:4%;top:0;height:92%;z-index:9;pointer-events:none;background:url(art/slot/bolt_strip.png) 0 0/800% 100% no-repeat;aspect-ratio:3/4;filter:drop-shadow(0 0 10px #8ad0ff);animation:boltStrip .5s steps(7,jump-none) both}
.sx-entry.res-rush .en-pic{object-position:18% 50%}.sx-entry.res-pic:not(.res-rush) .en-pic{object-position:58% 50%}
.sx-entry.res-rush .en-ttl{top:3%}.sx-entry.res-rush .en-ttl img.en-logo{width:min(46%,200px)!important}.sx-entry.res-rush .en-ttl img.en-moji{width:min(34%,150px)!important;margin-top:-1%}.sx-entry.res-rush .en-ttl em{font-size:22px}
/* 2026-11-01 ユーザー：「ボーナス確定！」は液晶の上下のまん中に（％で上からの位置を決め打ちしていたので下にずれていた） */
.sx-kk .kk-t2.solo{top:0!important;bottom:0!important;margin:auto 0}
.sx-kk .kk-t1{top:12%}
.sx-kk .kk-t2{bottom:12%}
/* 2026-11-01 ユーザー：ボーナスがそろった画面は主人公を出さない（じゃま）。ロゴは上下左右のまん中 */
.sx-entry.res-bonus .en-art,.sx-entry.res-bonus .en-anim{display:none!important}
.sx-entry.res-bonus .en-ttl{top:0!important;bottom:0!important;left:0!important;right:0!important;justify-content:center;align-items:center}
/* 2026-11-02 Codex検証：C27 虹の「ボーナス確定！」は画面の上下まん中に（前は下から12%で約25px下・上の「雷が落ちた！」と重なっていた）。
   確定は高さ40%で中央、「雷が落ちた！」はその上のすきま（高さ22%）に小さく。液晶の高さ（cqh）でそろえるので、画面の大きさが変わっても重ならない */
.sx-kk.rb .kk-t2{left:0;right:0;top:0;bottom:0;margin:auto;width:auto!important;height:40cqh!important;max-width:94%;object-fit:contain}
.sx-kk.rb .kk-t1{left:0;right:0;top:4cqh;margin:0 auto;width:auto!important;height:22cqh!important;max-width:90%;object-fit:contain}
/* 2026-11-03 時成通り：結果のひと言（話し手の名札＋セリフ） */
.sg-say{margin:4px 8px;font-size:13px;line-height:1.45;text-align:left;color:#3a2410}
.sg-say span{display:inline-block;margin-right:6px;padding:0 6px;background:#5a3b1c;color:#f6e7c4;font-size:11px;border-radius:2px;vertical-align:1px}
