:root{--gold:#b89a5c;--gold2:#d8bd78;--ink:#e8dcc0;--dim:#9a8f78;--bg:#0a0908;--red:#c0392b}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#07060a;overflow:hidden;color:var(--ink);
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP","MS Mincho",serif;touch-action:none;user-select:none;-webkit-user-select:none}
#c{position:fixed;inset:0;width:100%;height:100%;display:block}
#ui{position:fixed;inset:0;pointer-events:none}
#ui>*{pointer-events:none}
.hide{display:none!important}
.panel{background:linear-gradient(#17130f,#0b0908);border:2px solid var(--gold);border-radius:3px;
  box-shadow:0 0 0 1px #000,inset 0 0 0 2px #0b0908,inset 0 0 0 3px #4a3d24,0 10px 34px #000c;color:var(--ink)}
button{font:inherit;color:var(--ink);cursor:pointer}
.btn{display:block;width:100%;text-align:left;font-size:19px;letter-spacing:.08em;padding:11px 16px;margin:0 0 8px;
  background:linear-gradient(#2a2217,#14100b);border:1px solid #6a5530;border-radius:2px;pointer-events:auto;position:relative}
.btn:hover,.btn:focus-visible,.btn.sel{outline:none;border-color:var(--gold2);background:linear-gradient(#4a3a1f,#251c0e);color:#fff4d0;box-shadow:0 0 14px #b89a5c55}
.btn:before{content:"";display:inline-block;width:0;height:0;border-left:8px solid transparent;margin-right:0;transition:.12s}
.btn:hover:before,.btn:focus-visible:before,.btn.sel:before{border-left-color:var(--gold2);border-top:6px solid transparent;border-bottom:6px solid transparent;margin-right:8px}
.btn[disabled]{opacity:.42;cursor:default;pointer-events:none}
.btn.c{text-align:center}.btn.c:before{display:none}
.btn.primary{border-color:#f0dc9a;background:linear-gradient(#86682c,#4e3a14);color:#fff8de;font-weight:700;box-shadow:0 0 20px #d8bd7877}
.tcol .btn:not(.primary):not(.quiet){background:linear-gradient(#2a2217,#14100b);border-color:#6a5530}
.btn.quiet{font-size:14px;padding:7px 12px;color:var(--dim);background:rgba(16,13,9,.55);border-color:#4a3d24}.btn.quiet:hover,.btn.quiet:focus-visible{color:var(--ink)}
.mini{font-size:12px;padding:3px 9px;background:#241c10;border:1px solid #6a5530;border-radius:2px;pointer-events:auto}
.mini:hover{border-color:var(--gold2)}
.bar{position:relative;height:16px;background:#1c0e0e;border:1px solid #5a4a2c;overflow:hidden}
.bar i{position:absolute;inset:0;width:100%;background:linear-gradient(#5fb36a,#2c7a3a);transition:width .35s}
.bar.e i{background:linear-gradient(#d65a4a,#8a2418)}
.bar span{position:absolute;inset:0;text-align:center;font-size:12px;line-height:16px;text-shadow:0 1px 2px #000}
#hud{position:absolute;inset:0}
#chip{position:absolute;left:max(10px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));width:176px;padding:8px 10px;font-size:14px}
#chip .r1,#chip .r3{display:flex;justify-content:space-between;align-items:center}
#chip .r1{margin-bottom:5px}#chip .r3{margin-top:6px}
#chip b{color:var(--gold2);letter-spacing:.1em}
#mini{position:absolute;right:max(10px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));width:132px;height:132px;
  background:rgba(8,6,5,.72);border:2px solid var(--gold);box-shadow:0 0 0 1px #000,0 6px 20px #000a;pointer-events:auto;cursor:zoom-in}
#credit{position:absolute;left:0;right:0;bottom:0;text-align:center;font-size:10.5px;line-height:1.5;color:#8a8070;padding:16px 10px calc(5px + env(safe-area-inset-bottom));text-shadow:0 1px 3px #000;pointer-events:none}
body:not(.indungeon) #credit{background:linear-gradient(rgba(5,4,3,0),rgba(5,4,3,.97) 42%)}
#credit a{color:#a89a78;pointer-events:auto}
@keyframes fadein{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
#fx{position:absolute;inset:0;overflow:hidden}
#red{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(150,0,0,0) 30%,rgba(190,10,10,.75) 100%);opacity:0}
#red.go{animation:redf .55s ease-out}
@keyframes redf{0%{opacity:1}100%{opacity:0}}
#white{position:absolute;inset:0;background:#fff;opacity:0}
#white.go{animation:whitef .3s ease-out}
@keyframes whitef{0%{opacity:.5}100%{opacity:0}}
.dmg{position:absolute;transform:translate(-50%,-50%);font-size:46px;font-weight:700;letter-spacing:.04em;color:#fff;text-shadow:0 0 6px #000,0 2px 0 #000,0 0 18px #ff8a30;animation:dmgf 1.0s ease-out forwards;white-space:nowrap}
.dmg.crit{font-size:64px;color:#ffe27a;text-shadow:0 0 6px #000,0 2px 0 #7a3a00,0 0 26px #ff9a30}
.dmg.miss{font-size:34px;color:#c8c2b4;text-shadow:0 0 5px #000}
.dmg.heal{color:#9ff0a8;text-shadow:0 0 6px #000,0 0 18px #3ac86a}
.dmg.me{color:#ff7a6a;text-shadow:0 0 6px #000,0 2px 0 #300,0 0 20px #e02a1a}
@keyframes dmgf{0%{opacity:0;margin-top:14px;scale:.6}12%{opacity:1;scale:1.18}25%{scale:1}70%{opacity:1}100%{opacity:0;margin-top:-62px}}
/* 画面（街・店・ステータス） */
#screen{position:absolute;inset:0}
.col{position:absolute;right:max(16px,env(safe-area-inset-right));top:50%;transform:translateY(-52%);width:min(380px,calc(100% - 32px));padding:18px 18px 12px;pointer-events:auto;max-height:calc(100% - 64px);overflow:auto}
.col h2{margin:0 0 4px;font-size:24px;letter-spacing:.2em;color:var(--gold2);font-weight:700;text-align:center}
.col .sub{margin:0 0 14px;text-align:center;color:var(--dim);font-size:14px;line-height:1.6}
.col .info{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:var(--dim);margin:0 0 12px;padding:6px 8px;background:#0d0b09;border:1px solid #3a3020}
.col .info b{color:var(--ink);font-weight:400}
.title{position:absolute;left:0;right:0;top:12%;text-align:center;pointer-events:none}
.title h1{margin:0 auto;max-width:92vw;font-size:min(54px,8vw);letter-spacing:.08em;line-height:1.2;font-weight:700;color:#efe3c0;text-shadow:0 0 38px #04060cf0,0 0 22px #b89a5c88,0 3px 0 #000,0 0 3px #000}
.title p{margin:10px 0 0;font-size:16px;letter-spacing:.3em;color:var(--dim)}
.tcol{position:absolute;left:50%;bottom:18%;transform:translateX(-50%);width:min(340px,calc(100% - 40px));pointer-events:auto}
.tabs{display:flex;gap:6px;margin-bottom:10px}.tabs .btn{margin:0;flex:1;text-align:center;font-size:16px;padding:8px}.tabs .btn:before{display:none}
.row{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;padding:8px 10px;margin-bottom:6px;border:1px solid #3a3020;background:linear-gradient(#1a150f,#100d09);pointer-events:auto}
.row .nm{font-size:17px}.row .ef{font-size:13px;color:var(--dim)}.row .pr{grid-row:1/3;grid-column:2;text-align:right}
.row .pr .btn{width:auto;margin:0;font-size:15px;padding:6px 12px;display:inline-block;text-align:center}.row .pr .btn:before{display:none}
.row .pr small{display:block;color:var(--gold2);font-size:13px;margin-bottom:3px}
.sec{margin:12px 0 6px;font-size:14px;letter-spacing:.2em;color:var(--gold);border-bottom:1px solid #4a3d24;padding-bottom:3px}
.stat{display:grid;grid-template-columns:auto 1fr;gap:3px 14px;font-size:17px;margin:4px 0 8px}.stat span:nth-child(odd){color:var(--dim)}
.note{font-size:14px;color:var(--gold2);text-align:center;min-height:21px;margin:4px 0 8px}
/* モーダル・オーバーレイ */
#modal,#over{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:auto;background:rgba(0,0,0,.5)}
#modal .panel{width:min(420px,calc(100% - 32px));padding:20px 22px 14px;max-height:calc(100% - 40px);overflow:auto}
#modal p{margin:0 0 14px;line-height:1.75;font-size:17px;white-space:pre-line}
#modal h3{margin:0 0 10px;text-align:center;color:var(--gold2);letter-spacing:.2em;font-size:21px}
#modal .two{display:flex;gap:10px}#modal .two .btn{margin:0;text-align:center}
#over{flex-direction:column;text-align:center;background:radial-gradient(ellipse at center,rgba(20,0,0,.55),rgba(0,0,0,.94));animation:fadein 1.4s}
#over h1{font-size:min(74px,13vw);letter-spacing:.3em;margin:0 0 8px;font-weight:700;text-shadow:0 0 30px #000}
#over p{font-size:18px;letter-spacing:.14em;color:#c8bca0;margin:0 0 26px;line-height:1.8}
#over.go h1{color:#a02018;text-shadow:0 0 28px #e0301899,0 3px 0 #000}
#over.win{background:radial-gradient(ellipse at center,rgba(60,48,10,.5),rgba(0,0,0,.92))}
#over.win h1{color:#f0d480;text-shadow:0 0 34px #e8b84acc,0 3px 0 #000}
#over .btn{width:260px;margin:0 auto}
#mapBig{width:min(86vmin,640px);height:min(86vmin,640px);background:rgba(8,6,5,.92);border:2px solid var(--gold);box-shadow:0 0 0 1px #000,0 10px 40px #000}
#loading{position:absolute;inset:0;background:#07060a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:9;transition:opacity .6s;pointer-events:auto}
#loading.off{opacity:0;pointer-events:none}
#loading .lt{letter-spacing:.3em;color:var(--dim)}
#loading .lb{width:220px;height:3px;background:#1c1710}#loading .lb i{display:block;height:100%;width:0;background:var(--gold);transition:width .3s}
@media (max-width:700px){
  .col{right:50%;transform:translate(50%,0);top:auto;bottom:calc(54px + env(safe-area-inset-bottom));width:calc(100% - 20px);max-height:56%;padding:14px 14px 8px}
  .col h2{font-size:21px}
  .btn{font-size:17px;padding:10px 14px;margin-bottom:6px}
  #chip{width:150px;padding:6px 8px;font-size:12.5px}
  #mini{width:104px;height:104px}
  .tcol{bottom:22%}
  .title h1{letter-spacing:.04em;font-size:7.6vw}.title p{letter-spacing:.14em;font-size:14px}
  .dmg{font-size:38px}.dmg.crit{font-size:52px}
  #credit{font-size:9px;line-height:1.4}
}
.banner{position:absolute;left:0;right:0;top:30%;text-align:center;font-size:min(54px,9vw);letter-spacing:.3em;color:#efe3c0;text-shadow:0 0 24px #b89a5c99,0 3px 0 #000;animation:banf 2.6s ease-out forwards;pointer-events:none}
.banner small{display:block;font-size:.34em;letter-spacing:.3em;color:var(--dim);margin-top:6px}
@keyframes banf{0%{opacity:0;transform:scale(1.08)}15%{opacity:1;transform:none}70%{opacity:1}100%{opacity:0}}
#fade{position:absolute;inset:0;background:#000;opacity:0;transition:opacity .45s;pointer-events:none}
.help{font-size:15px;line-height:1.8;margin:0 0 12px}.help b{color:var(--gold2);font-weight:400}
.kbd{display:inline-block;border:1px solid #6a5530;border-radius:3px;padding:0 6px;margin:0 1px;background:#1c160e;font-size:13px}


.bar span{white-space:nowrap}

/* ---- アクション版の画面 ---- */
.bar.xp{height:5px;margin-top:3px;border-color:#3a3020}.bar.xp i{background:linear-gradient(#e8c860,#b8902c)}
#chip{width:196px}#chip .r3{gap:6px}#hPot{font-size:13px;color:var(--dim)}
#bossBar{position:absolute;left:50%;top:max(12px,env(safe-area-inset-top));transform:translateX(-50%);min-width:min(420px,60vw);padding:8px 18px 10px;text-align:center}
#bossBar b{font-size:19px;letter-spacing:.3em;color:#e8b0a0}#bossBar .bar{margin-top:6px;height:12px}
.ebar{position:absolute;transform:translate(-50%,-100%);width:54px;height:6px;background:#1c0e0e;border:1px solid #000;box-shadow:0 0 4px #000;pointer-events:none}
.ebar i{display:block;height:100%;background:linear-gradient(#d65a4a,#8a2418)}
.dmg.exp{font-size:26px;color:#bfe0ff;text-shadow:0 0 6px #000,0 0 14px #4a90e0}
.dmg.gold{font-size:24px;color:#ffe27a;text-shadow:0 0 6px #000,0 0 12px #c89a20}
.dmg.block{font-size:30px;color:#ffd9a0}
#toast{position:absolute;left:50%;top:24%;transform:translateX(-50%);text-align:center;font-size:min(34px,6vw);letter-spacing:.2em;color:#ffe9a0;text-shadow:0 0 18px #e8b84a,0 3px 0 #000;pointer-events:none;animation:banf 2.8s ease-out forwards;white-space:nowrap}
#toast small{display:block;font-size:.5em;letter-spacing:.12em;color:#e8dcc0;margin-top:6px;text-shadow:0 1px 3px #000}
#tips{position:absolute;left:max(10px,env(safe-area-inset-left));bottom:calc(30px + env(safe-area-inset-bottom));padding:10px 12px;font-size:13px;line-height:1.75;pointer-events:auto;max-width:300px}
#tips .mini{float:right;margin:0 0 4px 8px}
#tips .kbd{font-size:12px;padding:0 5px}
#stick{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:calc(40px + env(safe-area-inset-bottom));width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle,rgba(30,24,14,.35),rgba(30,24,14,.6));border:2px solid #6a5530;pointer-events:auto;touch-action:none;display:none}
#stick i{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#d8bd78,#7a6028);border:2px solid #f0e2b0;box-shadow:0 2px 10px #000a}
#abtns{position:absolute;right:max(14px,env(safe-area-inset-right));bottom:calc(36px + env(safe-area-inset-bottom));width:210px;height:190px;display:none}
#abtns button{position:absolute;border-radius:50%;background:rgba(20,16,11,.72);border:2px solid #8a6a30;color:#f0e2b0;font-size:19px;letter-spacing:.05em;pointer-events:auto;touch-action:none;backdrop-filter:blur(3px);padding:0}
#abtns button:active,#abtns button.on{background:rgba(120,90,30,.9);border-color:var(--gold2)}
#bAtk{right:0;bottom:0;width:96px;height:96px;font-size:24px!important;border-color:#d8bd78!important}
#bBlk{right:106px;bottom:6px;width:70px;height:70px}
#bRoll{right:60px;bottom:106px;width:70px;height:70px;font-size:16px!important}
#bPot{right:0;bottom:106px;width:54px;height:54px;font-size:16px!important}
@media (pointer:coarse),(max-width:900px){#stick,#abtns{display:block}#tips{bottom:auto;top:max(118px,calc(env(safe-area-inset-top) + 108px));max-width:240px}}
@media (max-width:700px){#bossBar{top:calc(max(10px,env(safe-area-inset-top)) + 100px)}#chip{width:160px}}
.bar.xp{background:#14100a}

/* 左上の欄は折り返さない（名前8文字・所持金・Lv30 でも収める） */
#chip{width:auto;min-width:196px;max-width:calc(100vw - 150px)}
#chip *{white-space:nowrap}
#chip .r1,#chip .r3{gap:8px}
#hName{font-size:14px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;margin:-2px 0 5px;max-width:100%}
#chip .r3 span{flex:0 0 auto}
.col .info span{white-space:nowrap}
@media (max-width:700px){#chip{width:auto;min-width:150px;max-width:calc(100vw - 134px);padding:6px 8px}#hName{font-size:12.5px}#chip .r3{gap:6px}#chip .mini{padding:3px 6px}}

/* ---- 街・場所の画面・会話・インベントリ（ChatRPG と同じ6か所。うすぐらい雰囲気にそろえる） ---- */
#ui > #musicBtn{position:absolute;right:max(10px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));z-index:6;pointer-events:auto;font:inherit;font-size:13px;letter-spacing:.1em;color:var(--gold2);
  background:rgba(14,11,8,.78);border:1px solid #6a5530;border-radius:2px;padding:5px 11px;cursor:pointer;backdrop-filter:blur(3px)}
#ui > #musicBtn:hover{border-color:var(--gold2)}#ui > #musicBtn.off{color:#8a8070;text-decoration:line-through}
body.indungeon #ui > #musicBtn{top:calc(max(10px,env(safe-area-inset-top)) + 144px);padding:4px 8px;font-size:12px}
@media (max-width:700px){body.indungeon #ui > #musicBtn{top:calc(max(10px,env(safe-area-inset-top)) + 116px)}}
#ui > #notices{position:absolute;left:50%;top:38%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
.notice{background:rgba(14,11,8,.86);border:1px solid var(--gold);color:#ffe9a0;padding:6px 16px;font-size:18px;letter-spacing:.08em;text-shadow:0 0 10px #e8b84a;animation:banf 4.2s ease-out forwards;white-space:nowrap}
.townwrap,.loc,.inv-overlay{pointer-events:auto}
.townwrap{position:absolute;inset:0;overflow:auto;padding:max(16px,env(safe-area-inset-top)) 16px 84px;background:radial-gradient(ellipse at center,rgba(5,4,3,.55),rgba(3,2,2,.88));user-select:text;-webkit-user-select:text}
.tw-head{text-align:center;margin:6px 0 14px}.tw-head h1{margin:0 auto;max-width:94%;font-size:min(34px,7vw);letter-spacing:.06em;line-height:1.2;color:#efe3c0;text-shadow:0 0 22px #b89a5c88,0 3px 0 #000}
@media (max-width:700px){.tw-head{padding:0 58px}}
.title h1 small,.tw-head h1 small{display:block;margin-top:6px;font-size:.5em;font-weight:400;letter-spacing:.32em;color:var(--dim);text-shadow:0 2px 0 #000}
.tw-head p{margin:6px 0 0;color:var(--dim);letter-spacing:.2em;font-size:14px}
.loc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1040px;margin:0 auto}
.loc-card{background:linear-gradient(#17130f,#0b0908);border:1px solid #6a5530;border-radius:3px;overflow:hidden;cursor:pointer;box-shadow:0 6px 20px #000a;transition:.15s}
.loc-card:hover,.loc-card:focus-visible{outline:none;border-color:var(--gold2);box-shadow:0 0 18px #b89a5c66,0 6px 20px #000a;transform:translateY(-2px)}
.loc-card-img{height:112px;background-size:cover;background-position:center;filter:brightness(.62) saturate(.85);border-bottom:1px solid #4a3d24}
.loc-card-t{padding:8px 12px 2px;font-size:19px;letter-spacing:.12em;color:var(--gold2)}
.loc-card-d{padding:0 12px 11px;font-size:12.5px;line-height:1.55;color:var(--dim)}
.pinfo,.dmgmt{max-width:1040px;margin:14px auto 0;padding:12px 16px}
.pinfo-head{display:flex;align-items:baseline;gap:12px;margin-bottom:8px}.pname{font-size:20px;color:var(--gold2);letter-spacing:.1em}.ptitle{font-size:13px;color:var(--dim)}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:6px 0}
.stat-item{background:#0d0b09;border:1px solid #3a3020;padding:6px 10px}.stat-label{font-size:12px;color:var(--dim)}.stat-value{font-size:18px;color:var(--ink)}
.pinfo .btn{width:auto;display:inline-block;margin:10px 0 0;padding:8px 18px}
.dmgmt h3{margin:0 0 8px;font-size:15px;letter-spacing:.2em;color:var(--gold)}
.dmgmt .two{display:flex;gap:8px;flex-wrap:wrap}.dmgmt .btn{width:auto;flex:1 1 150px;margin:0;font-size:14px;padding:8px 10px;text-align:center}.dmgmt .btn:before{display:none}
.loc{position:absolute;inset:0;overflow:hidden}
.loc-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.4) saturate(.8)}
.loc:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 35%,rgba(0,0,0,.75) 100%);pointer-events:none}
.loc-main{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:minmax(300px,440px) minmax(0,1fr);gap:14px;padding:max(14px,env(safe-area-inset-top)) 14px 14px}
.loc-main.nochat{grid-template-columns:minmax(300px,520px)}
.loc-left{overflow:auto;padding-right:4px;min-height:0}
.loc-left h2{margin:0 0 2px;font-size:26px;letter-spacing:.16em;color:var(--gold2);text-shadow:0 2px 0 #000,0 0 14px #000}
.loc-left .sub{text-align:left;margin:0 0 10px;text-shadow:0 1px 3px #000}
.loc-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.loc-row .btn{width:auto;margin:0;font-size:15px;padding:8px 12px;text-align:center}.loc-row .btn:before{display:none}
.loc-row .back{background:linear-gradient(#5a3a1c,#2c1c0c);border-color:var(--gold)}
.chars{display:flex;flex-direction:column;gap:7px;margin-bottom:10px}
.char{display:flex;gap:10px;align-items:center;background:rgba(14,11,8,.82);border:1px solid #4a3d24;padding:7px;cursor:pointer;pointer-events:auto}
.char:hover{border-color:var(--gold2)}.char.active{border-color:var(--gold2);background:rgba(60,46,22,.85);box-shadow:0 0 12px #b89a5c55}
.char-av{width:58px;height:58px;object-fit:cover;border:1px solid #6a5530;flex:0 0 auto}
.char-info{min-width:0;flex:1}.char-info h3{margin:0;font-size:16px;letter-spacing:.06em;color:var(--ink)}.char-info p{margin:1px 0 4px;font-size:12.5px;color:var(--dim)}
.trust-bar{height:6px;background:#1c0e0e;border:1px solid #3a3020}.trust-fill{height:100%;background:linear-gradient(#e8c860,#b8902c)}.char-info small{font-size:11.5px;color:var(--dim)}
.actions{padding:10px 12px}.actions h3{margin:0 0 8px;font-size:15px;letter-spacing:.2em;color:var(--gold)}
.actions .btn{margin-bottom:6px;font-size:16px;padding:8px 14px}
.actions .items{max-height:46vh;overflow:auto}.actions .tabs{margin-bottom:10px}
.row .ds{font-size:12px;color:var(--dim);font-weight:400}.row .ef{font-size:13px;color:var(--gold2)}.row .ef.heal{color:#9ff0a8}
.row .nm strong{font-weight:400;font-size:17px}
.chatp{display:flex;flex-direction:column;min-height:0;padding:12px;background:linear-gradient(rgba(23,19,15,.9),rgba(11,9,8,.93))}
.chat-info{font-size:13px;color:#cfc4a6;margin-bottom:8px;min-height:18px}
.chat-msgs{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:2px 2px 6px;user-select:text;-webkit-user-select:text}
.chat-note{text-align:center;color:var(--dim);font-size:14px;padding:8px}.chat-note.gold{color:var(--gold2);background:rgba(184,154,92,.15);border:1px solid #4a3d24}
.msg{max-width:88%;padding:7px 11px;border:1px solid #3a3020;font-size:15px;line-height:1.6;word-break:break-word}
.msg.player{align-self:flex-end;background:rgba(90,66,26,.55);border-color:#7a6028}.msg.character{align-self:flex-start;background:rgba(18,15,11,.9)}
.msg.loading{opacity:.7}.rep{margin-top:3px;text-align:right;font-size:11px;color:var(--dim)}.rep-b{font:inherit;font-size:11px;color:var(--dim);background:none;border:0;padding:2px 6px;cursor:pointer;text-decoration:underline;opacity:.7}.rep-b:hover,.rep-b:focus-visible{opacity:1;color:var(--gold2)}.rep-q,.rep-s{color:var(--dim)}.msg-h{font-size:12px;color:var(--gold2);letter-spacing:.08em;margin-bottom:2px}
.chat-in{display:flex;gap:8px;margin-top:8px}
.chat-in input,.inv-panel input{flex:1;min-width:0;font:inherit;font-size:16px;padding:9px 11px;background:#0d0b09;color:#f0e6c8;border:1px solid #6a5530;border-radius:2px;pointer-events:auto;user-select:text;-webkit-user-select:text}
.chat-in input.glow{border-color:#ffd700;box-shadow:0 0 8px rgba(255,215,0,.6)}.chat-in input:disabled{opacity:.6}
.chat-in .send{width:auto;margin:0;padding:8px 18px;text-align:center}.chat-in .send:before{display:none}
#ui > .inv-overlay{pointer-events:auto;position:absolute;inset:0;z-index:7;background:rgba(0,0,0,.62);display:flex;align-items:center;justify-content:center}
.inv-panel{width:min(640px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;padding:14px 16px;user-select:text;-webkit-user-select:text}
.inv-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.inv-head h2{margin:0;font-size:22px;letter-spacing:.2em;color:var(--gold2)}
.inv-body h3{margin:12px 0 6px;font-size:14px;letter-spacing:.2em;color:var(--gold);border-bottom:1px solid #4a3d24;padding-bottom:3px}
.name-row{display:flex;gap:8px}.name-row .btn{width:auto;margin:0;padding:8px 16px;text-align:center}.name-row .btn:before{display:none}
.equipped{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.eslot{display:flex;gap:10px;align-items:center;padding:8px;background:#0d0b09;border:1px solid #3a3020}.eslot.has{cursor:pointer;border-color:#6a5530}.eslot.has:hover{border-color:var(--gold2)}
.eslot .ic{font-size:24px}.item-name{font-size:14px;color:var(--ink)}.item-stats,.item-info{font-size:12.5px;color:var(--gold2)}
.inv-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.islot{min-height:62px;background:#0d0b09;border:1px solid #2c2418;padding:4px;font-size:11.5px}.islot.has{border-color:#6a5530;cursor:pointer}.islot.has:hover{border-color:var(--gold2);background:#1c160e}
.islot .item-name{font-size:12px}
@media (max-width:800px){
  .loc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.loc-card-img{height:84px}.loc-card-t{font-size:16px}.loc-card-d{font-size:11.5px;line-height:1.45}
  .loc-main{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,54%) minmax(0,1fr);gap:8px;padding:max(8px,env(safe-area-inset-top)) 8px 8px}
  .loc-main.nochat{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
  .loc-left h2{font-size:21px;padding-right:62px}.char{padding:5px;gap:8px}.char-av{width:40px;height:40px}.char-info h3{font-size:14.5px}.char-info p{font-size:11.5px;margin:0 0 3px}.chars{gap:5px}.loc-left .sub{font-size:13px;margin-bottom:6px}.loc-row{margin-bottom:6px}
  .inv-grid{grid-template-columns:repeat(4,1fr)}.equipped{grid-template-columns:1fr}
  .msg{font-size:14px}
}

body.inloc #credit{display:none}

/* 古の迷宮：階の一覧 */
.floors{display:grid;gap:6px;margin:0 0 10px}
.floor{display:flex;align-items:center;gap:10px;background:rgba(14,11,8,.82);border:1px solid #4a3d24;padding:7px 10px;cursor:pointer;pointer-events:auto;user-select:none}
.floor:hover,.floor:focus-visible{border-color:var(--gold2);outline:none}
.floor.sel{border-color:var(--gold2);background:rgba(60,46,22,.88);box-shadow:0 0 14px #b89a5c55}
.floor .fno{flex:0 0 46px;text-align:center;font-size:19px;letter-spacing:.04em;color:var(--gold2)}
.floor .fi{min-width:0;flex:1}.floor .fi h4{margin:0;font-size:15.5px;letter-spacing:.06em;color:var(--ink);font-weight:600}.floor .fi small{font-size:12px;color:var(--dim)}
.floor .fst{flex:0 0 auto;font-size:12px;color:#9ccf9c;letter-spacing:.06em}
.floor.sel .fst{color:#ffe9a8}
.floor.locked{opacity:.5;cursor:default;background:rgba(10,8,6,.7);border-style:dashed}
.floor.locked .fno{color:#7a6e58}.floor.locked .fst{color:#8a8070}
.fhead{margin:8px 0 6px;font-size:12.5px;letter-spacing:.14em;color:var(--dim)}
.fprog{margin:0 0 6px}.fprog small{display:block;margin-top:4px;font-size:12.5px;color:var(--dim)}
@media (max-width:800px){.floor{padding:6px 8px;gap:8px}.floor .fno{flex-basis:38px;font-size:16px}.floor .fi h4{font-size:14px}.floor .fi small{font-size:11px}.floor .fst{font-size:11px}}

.floor.ro{cursor:default}.floor.ro:hover{border-color:#4a3d24}.floor.ro.locked:hover{border-color:#4a3d24}

/* 街のステータスを右側へ：広い画面では右の列、せまい画面では上に細く出す */
.tw-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;max-width:1360px;margin:0 auto;align-items:start}
.tw-body .loc-grid{max-width:none;margin:0}
.tw-side{position:sticky;top:0}
.tw-side .pinfo,.tw-side .dmgmt{max-width:none;margin:0 0 12px}
.tw-side .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.tstat{align-self:start;justify-self:end;width:230px;padding:10px 12px}
.tstat .ts-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.tstat .ts-head b{color:var(--gold2);font-size:17px;letter-spacing:.08em}.tstat .ts-head span{color:var(--ink);font-size:14px}
.tstat .ts-hp{height:20px}.tstat .ts-hp span{line-height:20px;font-size:13px}
.tstat .ts-row{display:flex;justify-content:space-between;margin-top:6px;font-size:14px;color:var(--ink)}.tstat .ts-row [data-s=ad]{color:var(--dim);font-size:13px}
.townwrap > .tstat.strip{display:none}
.loc-main{grid-template-columns:minmax(300px,440px) minmax(0,1fr) 230px}
.loc-main.nochat{grid-template-columns:minmax(300px,520px) minmax(0,1fr)}
@media (max-width:900px){.tw-body{grid-template-columns:minmax(0,1fr)}.tw-side{position:static}}
@media (max-width:800px){
  .townwrap > .tstat.strip{display:grid;width:auto;margin:0 0 10px}
  .tstat{width:auto;justify-self:stretch;padding:6px 10px;order:-1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:10px;align-items:center}
  .tstat .ts-head{margin:0;gap:6px}.tstat .ts-head b{font-size:14px}.tstat .ts-head span{font-size:12px}
  .tstat .ts-row{margin:0;gap:8px;font-size:13px}.tstat .ts-row [data-s=ad]{display:none}
  .loc-main{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,54%) minmax(0,1fr)}
  .loc-main.nochat{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
}
.loc-main .tstat{margin-top:46px}   /* 右上の「音」ボタンに重ならないように */
@media (max-width:800px){.loc-main .tstat{margin-top:0;padding-right:70px}}

/* 起動時の読み込み中の絵のギャラリー（#loading.boot のあいだだけ出る） */
#loading .gbar{display:flex;flex-direction:column;align-items:center;gap:14px}
#loading.boot{justify-content:flex-start;gap:0}
#loading .gal{display:none;position:relative;flex:1 1 auto;width:100%;min-height:0}
#loading.boot .gal{display:block;min-height:40vh}
#loading.boot .gbar{gap:8px;padding:10px 0 max(16px,env(safe-area-inset-bottom))}
.gal{background:radial-gradient(ellipse at center,#16120c 0,#07060a 75%)}
.gph{position:absolute;left:0;right:0;top:12px;bottom:34px;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 24px;color:var(--dim);font-size:14px;letter-spacing:.2em}.gph.gone{display:none}
.gstage{position:absolute;left:0;right:0;top:12px;bottom:34px}
.gi{display:none;position:absolute;left:0;top:0;right:0;bottom:0;background:center center / contain no-repeat;pointer-events:none}
.gi.cur{display:block}   /* フェードはしない（アニメーションが動かない端末でも、絵が必ず見えるように、すぐ切り替える） */
.gz{position:absolute;top:0;bottom:0;width:50%;background:transparent;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;color:rgba(239,227,192,.0);font-size:56px;display:flex;align-items:center;transition:color .2s}
.gz.l{left:0;justify-content:flex-start;padding-left:10px}.gz.r{right:0;justify-content:flex-end;padding-right:10px}
.gz.l::after{content:'‹'}.gz.r::after{content:'›'}
.gz:hover,.gz:focus-visible{color:rgba(239,227,192,.65);outline:none}
@media (pointer:coarse){.gz{color:rgba(239,227,192,.28)}}
.gc{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-size:12px;letter-spacing:.1em;color:var(--dim);pointer-events:none}

/* あそびかた：画面の中央に大きく */
#modal .panel.wide{width:min(600px,calc(100% - 24px));padding:22px 24px 16px}
#modal .help{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px 18px;align-items:baseline;margin:0 0 14px;font-size:18px;line-height:1.6}
#modal .help .hk{color:var(--gold2);letter-spacing:.12em;white-space:nowrap}
#modal .help .kbd{font-size:16px;padding:2px 9px;margin:0 2px}
#modal p.hn{font-size:15px;color:var(--dim);text-align:center;margin:0 0 12px}
@media (max-width:520px){#modal .help{font-size:15.5px;gap:8px 12px}#modal .help .kbd{font-size:14px;padding:1px 7px}#modal .panel.wide{padding:16px 14px 12px}}
body.help-open #musicBtn{visibility:hidden}   /* あそびかたを出している間は、右上の「音」ボタンを隠す（枠の角に重ならないように） */

#chip .r3{gap:6px}#chip .r3 .mini{padding:2px 8px}#hPot{pointer-events:auto}

/* 捨てる・売る */
.islot{position:relative}.islot .del{position:absolute;right:3px;bottom:3px;font-size:11px;padding:1px 6px;color:#e0907a;border-color:#6a3a2c}
.prow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 8px;margin:0 0 6px;background:#0d0b09;border:1px solid #3a3020;font-size:14px}
.prow .del{color:#e0907a;border-color:#6a3a2c;flex:0 0 auto}
.inv-confirm{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.65);pointer-events:auto}
.inv-confirm .panel{width:min(360px,calc(100% - 32px));padding:18px 18px 12px}.inv-confirm p{margin:0 0 14px;line-height:1.7;white-space:pre-line;font-size:16px}
.inv-confirm .two{display:flex;gap:10px}.inv-confirm .two .btn{margin:0;text-align:center}
#modal{z-index:20}#over{z-index:21}   /* 店・場所の画面（z-index:1）より前に出す（確かめの窓が、後ろに隠れないように） */
.btn.dis{opacity:.45}
.wing-list{display:grid;gap:6px;margin:8px 0 10px}.wing-list .btn{margin:0;text-align:center}
/* Google アカウントに保存（町の右側の欄） */
.gsync{margin:0 0 10px}
.sync-note{font-size:13px;color:var(--dim);margin:0 0 8px;line-height:1.6}
.gsi-btn{min-height:40px;display:flex;justify-content:center;margin:0 0 4px}
.sync-user{margin:0 0 4px;font-size:14px;word-break:break-all}
.sync-state{margin:0 0 8px;font-size:13px;color:var(--gold2);min-height:19px}
.gsync .btn{width:auto;margin:0;padding:6px 14px;font-size:14px}.gsync .btn:before{display:none}