:root{--ink:#23304a;--paper:#fdf6ec;--gold:#ffce5c;--gold-deep:#d6a32f;
    --hp:#ff6f61;--hp-bg:#2c3a52;--xp:#6fd0c8;--xp-bg:#243044;--mp:#7aa6ff;--mp-bg:#22304a;
    --panel:rgba(20,28,50,.97);--ally:#7fd96b;--coin:#ffd34d;--soul:#c9a0ff;
    --gold-soft:#ffe9a0;--gold-dark:#8a6a1d;--brass:#b08a36;
    --serif:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
    --gloss:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.14) 42%,rgba(0,0,0,.18) 52%,rgba(255,255,255,.12) 86%,rgba(255,255,255,.3));}
  *{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
  html,body{height:100%;overflow:hidden;background:#101826;}
  body{font-family:var(--serif);font-weight:500;
    color:var(--paper);user-select:none;-webkit-user-select:none;touch-action:none;}
  /* ゲーム本体は中央の固定幅カラム(#stage)に収める＝ウィンドウ幅で難易度が変わらない（レターボックス） */
  /* 9:16固定レターボックス。PCは高さ基準（高さ=ウィンドウに収まる範囲で固定）・スマホは幅基準。00_core.jsのresize()と一致 */
  #stage{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);aspect-ratio:9/16;
    width:min(100vw,calc(100vh * 9 / 16),600px);height:auto;overflow:hidden;box-shadow:0 0 40px rgba(0,0,0,.5);}
  #game{display:block;width:100%;height:100%;}
  #verLabel{position:fixed;right:8px;bottom:6px;z-index:11;font-size:10px;color:rgba(233,200,120,.5);pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.6);letter-spacing:.8px;}
  .overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;
    padding:18px;text-align:center;z-index:10;
    background:
      radial-gradient(1.6px 1.6px at 18% 22%, rgba(255,255,255,.45) 50%, transparent 51%),
      radial-gradient(1px 1px at 71% 15%, rgba(255,255,255,.38) 50%, transparent 51%),
      radial-gradient(1.4px 1.4px at 85% 41%, rgba(255,242,205,.34) 50%, transparent 51%),
      radial-gradient(1px 1px at 31% 57%, rgba(216,230,255,.30) 50%, transparent 51%),
      radial-gradient(1.2px 1.2px at 60% 78%, rgba(255,255,255,.26) 50%, transparent 51%),
      radial-gradient(1px 1px at 9% 82%, rgba(255,255,255,.24) 50%, transparent 51%),
      radial-gradient(1.4px 1.4px at 44% 9%, rgba(216,230,255,.30) 50%, transparent 51%),
      radial-gradient(circle at 50% 32%, rgba(70,102,164,.50), rgba(9,14,27,.97) 78%);
    backdrop-filter:blur(3px);}
  .overlay.show{display:flex;}
  .card{position:relative;width:min(460px,94vw);max-height:90vh;overflow-y:auto;
    background:
      radial-gradient(circle at 15px 15px,var(--gold-soft) 0 1.6px,rgba(214,163,47,.95) 2.6px,transparent 3.6px) padding-box,
      radial-gradient(circle at calc(100% - 15px) 15px,var(--gold-soft) 0 1.6px,rgba(214,163,47,.95) 2.6px,transparent 3.6px) padding-box,
      radial-gradient(circle at 15px calc(100% - 15px),var(--gold-soft) 0 1.6px,rgba(214,163,47,.95) 2.6px,transparent 3.6px) padding-box,
      radial-gradient(circle at calc(100% - 15px) calc(100% - 15px),var(--gold-soft) 0 1.6px,rgba(214,163,47,.95) 2.6px,transparent 3.6px) padding-box,
      radial-gradient(120% 90% at 50% 0%,rgba(86,112,168,.22),transparent 55%) padding-box,
      linear-gradient(var(--panel),var(--panel)) padding-box,
      linear-gradient(160deg,#f0cf78 0%,#94702a 30%,#ffe9ad 50%,#94702a 70%,#f0cf78 100%) border-box;
    border:2px solid transparent;border-radius:22px;padding:6px 16px 22px;
    box-shadow:0 18px 50px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.4),0 0 26px rgba(255,214,106,.10),
      inset 0 0 0 1px rgba(255,226,150,.17),inset 0 1px 0 rgba(255,255,255,.05);}
  h1{font-family:var(--serif);font-weight:800;font-size:27px;line-height:1.3;letter-spacing:.06em;color:var(--gold);margin-bottom:6px;text-shadow:0 2px 0 rgba(0,0,0,.25),0 0 14px rgba(0,0,0,.35);}
  .sub{font-size:14px;color:#d8e2ee;margin-bottom:16px;line-height:1.85;letter-spacing:.04em;}
  .howto{background:linear-gradient(180deg,rgba(255,238,200,.085),rgba(255,238,200,.04));
    border:1px solid rgba(214,163,47,.38);border-radius:14px;padding:13px 15px;margin:14px 0 16px;
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),inset 0 0 22px rgba(0,0,0,.18);
    font-size:14px;line-height:1.95;letter-spacing:.02em;text-align:left;} .howto b{color:var(--gold-soft);}
  .btn{display:block;width:100%;font-family:inherit;font-size:18px;font-weight:800;letter-spacing:.08em;color:#3b2c0e;
    background:linear-gradient(180deg,#fff3c2 0%,#ffe49a 28%,var(--gold) 64%,#edb83e 100%);
    border:none;border-radius:14px;padding:15px;cursor:pointer;
    box-shadow:0 5px 0 var(--gold-deep),0 7px 16px rgba(0,0,0,.32),0 0 0 1px rgba(90,62,12,.55),
      inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 4px rgba(158,104,20,.3),inset 0 0 0 1px rgba(255,250,220,.45);
    text-shadow:0 1px 0 rgba(255,255,255,.4);transition:transform .05s,box-shadow .05s,filter .12s;margin-top:8px;}
  .btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--gold-deep),0 2px 6px rgba(0,0,0,.28),0 0 0 1px rgba(90,62,12,.55),inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 3px rgba(158,104,20,.22);}
  a.btn{text-decoration:none;text-align:center;box-sizing:border-box;}
  .btn.sec{background:linear-gradient(180deg,rgba(96,116,160,.30),rgba(30,42,70,.55));color:var(--paper);font-weight:700;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(0,0,0,.25),0 2px 8px rgba(0,0,0,.3);
    border:1.5px solid rgba(214,163,47,.5);border-radius:14px;font-size:15px;padding:12px;text-shadow:0 1px 2px rgba(0,0,0,.5);}
  /* コレクション：ヘッダー固定・本体スクロール・もどる下固定／ジャンルタブ */
  #collectionCard,#invCard{display:flex;flex-direction:column;padding:0;overflow:hidden;}
  #collectionCard .col-head,#invCard .col-head{padding:12px 16px 8px;flex:0 0 auto;}
  #collectionCard .col-body,#invCard .col-body{flex:1 1 auto;overflow-y:auto;padding:6px 16px 8px;}
  #collectionCard .coll-foot,#invCard .coll-foot{flex:0 0 auto;padding:10px 16px 14px;border-top:1px solid rgba(255,255,255,.12);background:var(--panel);}
  .col-tabs{display:flex;gap:6px;margin-top:10px;}
  .col-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.2;padding:7px 2px;border-radius:11px;
    border:1px solid rgba(214,163,47,.35);font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;
    background:linear-gradient(180deg,rgba(86,112,160,.25),rgba(24,34,58,.6));color:#cfe0f0;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:background .1s;}
  .col-tab.on{background:linear-gradient(180deg,#fff3c2,#ffe49a 35%,var(--gold));color:#2c1f06;border-color:var(--gold-dark);
    box-shadow:0 0 10px rgba(255,206,92,.35),inset 0 1px 0 rgba(255,255,255,.65);text-shadow:0 1px 0 rgba(255,255,255,.35);}
  .col-cnt{font-size:10px;opacity:.75;font-weight:600;}
  .choices{display:flex;flex-direction:column;gap:10px;margin-top:6px;}
  /* レベルアップ直後0.45秒は選択不可（連打での誤爆ふせぎ） */
  .choices.locked .choice{pointer-events:none;opacity:.45;filter:grayscale(.4);}
  .choice{display:flex;width:100%;align-items:center;gap:13px;font-family:inherit;
    background:linear-gradient(180deg,rgba(96,116,160,.22),rgba(22,32,56,.55));
    border:2px solid rgba(214,163,47,.5);border-radius:15px;padding:12px 14px;cursor:pointer;text-align:left;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(0,0,0,.25),0 2px 6px rgba(0,0,0,.25);
    transition:transform .05s,border-color .15s,background .15s,box-shadow .15s,opacity .2s,filter .2s;}
  /* レベルアップ決定演出：選択カードが金グロー（静的・点滅なし）、他はlockedの沈みが効く */
  .choices.locked .choice.picked{opacity:1;filter:none;border-color:var(--gold);box-shadow:0 0 16px rgba(255,211,92,.5);transform:scale(1.03);}
  .choice:active{transform:scale(.98);}
  .choice:hover{border-color:var(--gold);background:linear-gradient(180deg,rgba(255,216,120,.16),rgba(255,206,92,.06));
    box-shadow:inset 0 1px 0 rgba(255,236,170,.22),0 3px 12px rgba(0,0,0,.28),0 0 12px rgba(255,206,92,.18);}
  .choice.off{opacity:.4;cursor:not-allowed;}
  .choice .ic{font-size:30px;width:44px;text-align:center;flex:0 0 auto;}
  .choice .tx{flex:1;min-width:0;}
  .choice .nm{font-size:16px;font-weight:700;color:var(--paper);}
  .choice .ds{font-size:12.5px;color:#cfe0f0;line-height:1.4;margin-top:2px;}
  .choice .pr{font-size:14px;font-weight:700;color:var(--coin);flex:0 0 auto;white-space:nowrap;}
  .choice .pr.soul{color:var(--soul);}
  .choice .lv{font-size:11px;color:#8fa3bf;}
  .tag{font-size:11px;font-weight:700;letter-spacing:.05em;padding:1px 7px;border-radius:6px;margin-right:6px;
    border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);}
  .tag.w{background:rgba(255,206,92,.25);color:var(--gold);} .tag.a{background:rgba(127,217,107,.22);color:var(--ally);}
  .tag.s{background:rgba(122,166,255,.25);color:var(--mp);} .tag.ev{background:rgba(255,140,200,.25);color:#ff9ad6;}
  .tag.set{background:rgba(127,217,107,.3);color:#bff0b0;}
  .shop-h{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--gold-soft);text-align:left;margin:16px 2px 8px;padding-bottom:4px;}
  .shop-h::before{content:'◆';flex:0 0 auto;font-size:9px;color:var(--gold-deep);text-shadow:0 0 5px rgba(255,214,106,.55);}
  .shop-h::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(230,190,100,.75),rgba(230,190,100,.05));}
  .shop-sticky{position:sticky;top:0;z-index:4;background:var(--panel);padding:12px 0 8px;margin:0 0 4px;border-bottom:1px solid rgba(255,255,255,.1);}
  .shop-sticky h1{margin-bottom:2px;}
  .slots-row{display:flex;gap:8px;justify-content:center;margin:6px 0 4px;}
  .slot-mini{width:54px;height:54px;border-radius:13px;background:rgba(122,166,255,.12);border:2px dashed rgba(122,166,255,.5);
    display:flex;align-items:center;justify-content:center;font-size:26px;position:relative;}
  .slot-mini .x{position:absolute;top:-6px;right:-6px;font-size:13px;background:#ff6f61;border-radius:50%;width:20px;height:20px;line-height:20px;color:#fff;}
  .gold-big{font-size:17px;color:var(--coin);font-weight:700;}
  .chest-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:4px 0 6px;}
  .chest-cell{display:flex;flex-direction:column;align-items:center;gap:4px;background:rgba(255,255,255,.05);border-radius:12px;padding:8px 6px;width:84px;}
  .chest-ico{width:50px;height:42px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:26px;border:2px solid #888;}
  .chest-cnt{font-size:13px;font-weight:700;}
  .mini-btn{font-family:inherit;font-size:11px;font-weight:800;letter-spacing:.04em;border:none;border-radius:7px;padding:4px 0;width:100%;cursor:pointer;color:#2c1f06;
    box-shadow:0 2px 0 rgba(40,28,6,.5),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .05s,box-shadow .05s;}
  .mini-btn.open{background:linear-gradient(180deg,#ffe49a,var(--gold));}
  .mini-btn.fuse{background:linear-gradient(180deg,#d6c4ff,#a87fff);color:#fff;}
  .mini-btn:disabled{opacity:.35;cursor:not-allowed;}

  #hud{position:fixed;top:0;left:0;right:0;z-index:5;padding:10px 12px;pointer-events:none;display:none;}
  /* 右上のポーズボタン(40px)用に全バーへ右ガター。3本のバー右端がそろい、ボタンと重ならない */
  .bar-wrap{margin-bottom:5px;padding-right:52px;}
  .bar-label{font-size:11px;font-weight:700;letter-spacing:.12em;color:#f3e8cf;margin-bottom:2px;
    text-shadow:0 1px 2px rgba(0,0,0,.75),0 0 6px rgba(0,0,0,.4);display:flex;justify-content:space-between;}
  .bar{height:12px;border-radius:7px;overflow:hidden;background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.12) 60%),var(--hp-bg);
    border:1px solid var(--brass);
    box-shadow:0 0 0 1px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.5),inset 0 1px 3px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,233,160,.14);}
  .bar .fill{height:100%;transition:width .12s linear;}
  #hpFill{background:var(--gloss),linear-gradient(90deg,#ff9b8e,var(--hp));}
  #mpBar{background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.12) 60%),var(--mp-bg);}
  #mpFill{background:var(--gloss),linear-gradient(90deg,#a8c4ff,var(--mp));}
  #xpBar{background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.12) 60%),var(--xp-bg);height:9px;}
  #xpFill{background:var(--gloss),linear-gradient(90deg,#9be8da,var(--xp));}
  #topInfo{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:13px;text-shadow:0 1px 3px rgba(0,0,0,.7);}
  #topInfo .pill{background:linear-gradient(180deg,rgba(58,76,112,.72),rgba(16,24,44,.82));
    border:1px solid rgba(214,163,47,.55);border-radius:999px;padding:3px 11px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 1px 3px rgba(0,0,0,.4);}
  #timer{font-size:20px;font-weight:700;color:var(--gold);} #gold{color:var(--coin);font-weight:700;}
  /* HUDバッジ3行：仲間／ウェポン／強化。各行に色つきラベル */
  #allyBar,#weaponBar,#itemBar{display:none;flex-wrap:wrap;align-items:center;gap:5px;margin-top:5px;}
  #allyBar{margin-top:7px;}
  .bar-tag{flex:0 0 auto;font-size:10px;font-weight:700;line-height:1;padding:3px 7px;border-radius:7px;background:rgba(0,0,0,.32);text-shadow:0 1px 2px rgba(0,0,0,.6);}
  .bar-tag.a{color:var(--ally);} .bar-tag.w{color:var(--gold);} .bar-tag.s{color:var(--mp);}
  .ally-chip{display:inline-flex;align-items:center;gap:2px;
    background:linear-gradient(180deg,rgba(86,112,152,.48),rgba(22,32,52,.74));
    border:1px solid rgba(127,217,107,.45);border-radius:9px;padding:2px 7px;font-size:15px;
    text-shadow:0 1px 2px rgba(0,0,0,.6);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 2px rgba(0,0,0,.22),0 1px 3px rgba(0,0,0,.28);}
  .ally-chip b{font-size:11px;color:var(--ally);} .ally-chip.ev{border-color:#ff9ad6;} .ally-chip.ev b{color:#ff9ad6;}
  .item-chip{display:inline-flex;align-items:center;gap:2px;
    background:linear-gradient(180deg,rgba(86,112,152,.48),rgba(22,32,52,.74));
    border:1px solid rgba(255,206,92,.5);border-radius:9px;padding:2px 7px;font-size:15px;
    text-shadow:0 1px 2px rgba(0,0,0,.6);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 2px rgba(0,0,0,.22),0 1px 3px rgba(0,0,0,.28);}
  .item-chip b{font-size:11px;color:var(--gold);}
  .item-chip.up{border-color:rgba(122,166,255,.5);} .item-chip.up b{color:var(--mp);}

  #bossBar{margin-top:8px;width:100%;max-width:440px;display:none;pointer-events:none;text-align:center;}
  #bossName{font-size:13px;font-weight:800;letter-spacing:.08em;color:#ffb3de;text-shadow:0 1px 3px #000,0 0 8px rgba(232,69,107,.5);margin-bottom:2px;}
  #bossBar .bb{height:13px;border-radius:7px;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.15) 60%),#3a1a2a;
    border:1px solid var(--brass);box-shadow:0 0 0 1px rgba(0,0,0,.7),inset 0 1px 3px rgba(0,0,0,.6);overflow:hidden;}
  #bossFill{height:100%;background:var(--gloss),linear-gradient(90deg,#ff7b9e,#e8456b);transition:width .1s linear;}
  /* ボスHP30%未満: 暖色＋1.6秒周期のごく緩い明滅（brightness 1→1.18＝点滅とは知覚されない安全域） */
  #bossFill.low{background:linear-gradient(90deg,#ffc35c,#e8762b);animation:bossLow 1.6s ease-in-out infinite;}
  @keyframes bossLow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18)}}

  #pauseBtn{position:fixed;top:9px;right:10px;z-index:7;width:40px;height:40px;border-radius:12px;
    background:linear-gradient(180deg,rgba(64,82,120,.85),rgba(18,26,46,.9));
    border:1.5px solid rgba(214,163,47,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 2px 6px rgba(0,0,0,.4);
    color:var(--paper);font-size:17px;cursor:pointer;display:none;align-items:center;justify-content:center;}
  #pauseBtn.show{display:flex;}
  #audioQuick{position:fixed;top:56px;right:10px;z-index:12;display:none;flex-direction:column;gap:5px;}
  #audioQuick.show{display:flex;}
  #audioQuick button{width:40px;height:36px;border-radius:10px;background:linear-gradient(180deg,rgba(64,82,120,.85),rgba(18,26,46,.9));
    border:1.5px solid rgba(214,163,47,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 5px rgba(0,0,0,.35);
    color:var(--paper);font-size:14px;cursor:pointer;opacity:.78;transition:opacity .1s;}
  #audioQuick button.off{opacity:.35;filter:grayscale(.7);}
  #audioQuick button:active{opacity:1;}
  #spellBar{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:6;display:none;gap:12px;}
  .slot-btn{width:62px;height:62px;border-radius:16px;
    background:
      radial-gradient(circle at 50% 46%,rgba(122,166,255,0) 17px,rgba(122,166,255,.22) 18px,rgba(122,166,255,0) 20px),
      radial-gradient(circle at 50% 28%,rgba(140,176,255,.26),rgba(20,30,56,0) 62%),
      linear-gradient(180deg,rgba(56,72,108,.92),rgba(14,22,42,.94));
    border:2px solid rgba(122,166,255,.55);
    box-shadow:0 0 0 1px rgba(0,0,0,.55),0 3px 8px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.18),inset 0 -3px 6px rgba(0,0,0,.4),0 0 12px rgba(122,166,255,.22);
    display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:26px;cursor:pointer;position:relative;color:#fff;}
  .slot-btn .cost{position:absolute;bottom:2px;font-size:9px;font-weight:700;letter-spacing:.04em;color:#b8d0ff;text-shadow:0 1px 2px rgba(0,0,0,.8);}
  .slot-btn .cd{position:absolute;inset:0;border-radius:14px;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;}
  .slot-btn.empty{border-style:dashed;opacity:.5;font-size:22px;} .slot-btn.dim{opacity:.42;}
  .slot-btn .key{position:absolute;top:-7px;left:-7px;font-size:10px;background:linear-gradient(180deg,#ffe9a0,#d6a32f);color:#2c1f06;border-radius:6px;padding:0 5px;font-weight:800;box-shadow:0 1px 2px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.5);}
  .stat-line{font-size:13px;color:#cfe0f0;line-height:1.9;margin-top:4px;} .stat-line b{color:var(--gold);}
  #tapHint{position:fixed;left:50%;bottom:24%;transform:translateX(-50%);z-index:5;display:none;font-size:14px;color:#fdf3da;
    background:linear-gradient(180deg,rgba(56,72,108,.78),rgba(18,26,46,.82));
    border:1px solid rgba(214,163,47,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 2px 8px rgba(0,0,0,.4);
    padding:6px 16px;border-radius:20px;letter-spacing:.03em;animation:bob 1.2s ease-in-out infinite;}
  @keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}
  #townToast,#chestToast{position:fixed;left:50%;top:14%;transform:translateX(-50%);z-index:6;display:none;font-size:15px;font-weight:700;color:#fff8e8;
    background:linear-gradient(180deg,#c2913a 0%,#a6781f 55%,#8a6219 100%);
    padding:8px 22px;border-radius:6px;text-align:center;letter-spacing:.05em;text-shadow:0 1px 2px rgba(0,0,0,.55);
    border-top:1px solid rgba(255,240,200,.75);border-bottom:2px solid rgba(70,48,8,.85);
    box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,233,160,.3),inset 0 -6px 10px rgba(0,0,0,.18);}
  #chestToast{background:linear-gradient(180deg,#9a64d8 0%,#7a44bc 55%,#5e2f9a 100%);border-bottom-color:rgba(40,16,70,.9);}

  #rainbow{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:0;mix-blend-mode:screen;
    background:linear-gradient(120deg,#ff0040,#ff8a00,#ffe600,#36ff5e,#00e0ff,#3b6bff,#c64bff,#ff0040);background-size:300% 300%;transition:opacity .25s;}
  #rainbow.on{opacity:.55;animation:rbhue 0.9s linear infinite, rbmove 1.6s linear infinite;}
  @keyframes rbhue{to{filter:hue-rotate(360deg);}} @keyframes rbmove{to{background-position:300% 0;}}
  /* レベルアップ演出：やわらかい金の輝き＋バナー＋星＋光の輪（HSP配慮：強い点滅なし・1回きり・なめらか） */
  #lvlFx,#evoFx{position:fixed;inset:0;z-index:13;pointer-events:none;display:none;overflow:hidden;}
  #lvlFx.show,#evoFx.show{display:block;}
  #lvlFx.show::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(255,206,92,.30),rgba(255,206,92,0) 62%);animation:lvlGlow .95s ease-out forwards;}
  @keyframes lvlGlow{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
  #lvlBanner{position:absolute;left:0;right:0;top:30%;text-align:center;font-weight:900;font-size:34px;letter-spacing:1px;color:#fff;text-shadow:0 2px 0 #b6791e,0 0 18px rgba(255,206,92,.9);animation:lvlPop .95s cubic-bezier(.2,1.4,.35,1) forwards;}
  #lvlBanner .sp{font-size:26px;}
  @keyframes lvlPop{0%{transform:scale(.55);opacity:0}22%{opacity:1}38%{transform:scale(1.12)}55%{transform:scale(1)}82%{opacity:1}100%{opacity:0;transform:scale(1)}}
  #lvlRing{position:absolute;left:50%;top:42%;width:46px;height:46px;margin:-23px 0 0 -23px;border:3px solid rgba(255,206,92,.85);border-radius:50%;animation:lvlRingA .85s ease-out forwards;}
  @keyframes lvlRingA{0%{transform:scale(.3);opacity:.85}100%{transform:scale(6.5);opacity:0}}
  .lvlStar{position:absolute;font-size:18px;will-change:transform,opacity;animation:lvlStarA 1s ease-out forwards;}
  @keyframes lvlStarA{0%{transform:translateY(8px) scale(.4);opacity:0}28%{opacity:1}100%{transform:translateY(-72px) scale(1);opacity:0}}
  /* 進化（合体）：光の柱＋金の輝き（本人が合体したときのみ＝レインボー演出と同じ扱い） */
  #evoFx .beam{position:absolute;left:50%;top:0;bottom:0;width:90px;margin-left:-45px;
    background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,240,180,.85),rgba(255,206,92,.5),rgba(255,255,255,0));
    filter:blur(2px);transform-origin:50% 50%;animation:evoBeam 1.15s ease-out forwards;}
  @keyframes evoBeam{0%{transform:scaleY(.2) scaleX(.4);opacity:0}25%{opacity:1;transform:scaleY(1) scaleX(1)}70%{opacity:.9}100%{opacity:0;transform:scaleX(1.6)}}
  #openIcon{font-size:90px;line-height:1;margin:6px 0;}
  #openIcon.shake{animation:shk .12s linear infinite;} @keyframes shk{0%{transform:translate(-3px,0) rotate(-4deg)}50%{transform:translate(3px,-2px) rotate(4deg)}100%{transform:translate(-3px,0)}}
  #openIcon.pop{animation:pop .4s ease-out;} @keyframes pop{0%{transform:scale(.5)}60%{transform:scale(1.4)}100%{transform:scale(1)}}


  /* ===== 上質ファンタジー・テーマ追加分（レイアウト不変・アニメなし） ===== */
  /* 金グラデのタイトル文字。インラインで color 指定がある h1（力つきた…等）は従来色のまま */
  @supports ((-webkit-background-clip:text) or (background-clip:text)){
    h1:not([style*="color"]){
      background:linear-gradient(180deg,#fff6cf 0%,#ffd76a 42%,#dfa733 70%,#ffe9a0 100%);
      -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
      text-shadow:none;
      filter:drop-shadow(0 1.5px 0 rgba(96,64,10,.5)) drop-shadow(0 0 12px rgba(255,214,106,.3));}
  }
  .btn:hover{filter:brightness(1.05);}
  .btn:focus-visible{outline:2px solid rgba(255,228,154,.85);outline-offset:2px;}
  .choice:focus-visible{outline:none;border-color:#ffe49a;
    box-shadow:inset 0 1px 0 rgba(255,236,170,.22),0 0 0 3px rgba(255,206,92,.35);}
  /* タイトルのクレジット行（控えめ・リンクは新規タブ） */
  #titleCredit{margin-top:12px;font-size:11px;color:#b0a88f;line-height:1.7;letter-spacing:.5px;}
  #titleCredit a{color:#9cc0ff;text-decoration:none;}
  #titleCredit a:active{color:var(--gold);}


  /* ===== v1.1 デザイン一新「黄金と羊皮紙の冒険譚」追加分 =====
     方針：点滅アニメなし（静的グロー/2秒未満の明滅は追加しない）・HUDにbackdrop-filter不使用・
     セレクタ/DOM不変・375px幅で寸法維持 */

  /* --- カード四隅の金飾り：L字ブラケット（::before・8レイヤー）＋内側ヘアライン（::after）。
         pointer-events:noneで操作不干渉。スクロールするカードでは内容と共に流れるが、
         四隅の宝石鋲（.card背景レイヤー）は常に定位置に残る2段構え --- */
  .card::before{content:'';position:absolute;inset:7px;pointer-events:none;z-index:2;opacity:.9;
    background-image:
      linear-gradient(90deg,#caa14a,#ffe9a0),linear-gradient(180deg,#caa14a,#ffe9a0),
      linear-gradient(270deg,#caa14a,#ffe9a0),linear-gradient(180deg,#caa14a,#ffe9a0),
      linear-gradient(90deg,#caa14a,#ffe9a0),linear-gradient(0deg,#caa14a,#ffe9a0),
      linear-gradient(270deg,#caa14a,#ffe9a0),linear-gradient(0deg,#caa14a,#ffe9a0);
    background-size:15px 2px,2px 15px,15px 2px,2px 15px,15px 2px,2px 15px,15px 2px,2px 15px;
    background-position:0 0,0 0,100% 0,100% 0,0 100%,0 100%,100% 100%,100% 100%;
    background-repeat:no-repeat;}
  .card::after{content:'';position:absolute;inset:6px;border:1px solid rgba(255,222,140,.20);border-radius:17px;pointer-events:none;z-index:1;}
  /* タイトルカードだけ紋章のような金のオーラを一段強く（静的） */
  #titleScreen .card{box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.4),0 0 44px rgba(255,214,106,.15),
    inset 0 0 0 1px rgba(255,226,150,.2),inset 0 1px 0 rgba(255,255,255,.06);}

  /* --- タイトルh1の飾り罫：上下に「金の罫＋中央の宝石＋脇の光点」＝紋章風 --- */
  #titleScreen h1{position:relative;padding-top:12px;}
  #titleScreen h1::before,#titleScreen h1::after{content:'';display:block;width:76%;height:9px;margin:0 auto;
    background:
      radial-gradient(circle at 50% 50%,#fff6d8 0 1.4px,rgba(214,163,47,.95) 2.4px,transparent 3.6px),
      radial-gradient(circle at calc(50% - 15px) 50%,rgba(255,233,160,.9) 0 1px,transparent 2.2px),
      radial-gradient(circle at calc(50% + 15px) 50%,rgba(255,233,160,.9) 0 1px,transparent 2.2px),
      linear-gradient(90deg,transparent 0,rgba(230,190,100,.85) 22%,rgba(255,233,160,.95) 50%,rgba(230,190,100,.85) 78%,transparent 100%) 50% 50%/100% 1px no-repeat;}
  #titleScreen h1::before{margin-bottom:7px;}
  #titleScreen h1::after{margin-top:9px;}

  /* --- 呪文スロット：破線の円＝魔法陣（静的・回転なし）。空きスロットは石のくぼみ --- */
  .slot-btn:not(.empty)::after{content:'';position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;
    border-radius:50%;border:1px dashed rgba(150,184,255,.34);pointer-events:none;}
  .slot-btn.empty{background:linear-gradient(180deg,rgba(40,52,82,.55),rgba(12,20,38,.7));
    box-shadow:inset 0 2px 6px rgba(0,0,0,.45),inset 0 -1px 0 rgba(255,255,255,.06);color:#8fa3bf;}

  /* --- トーストの布バナー：両端の燕尾リボン（z-index:-1で本体の後ろへ） --- */
  #townToast::before,#townToast::after,#chestToast::before,#chestToast::after{content:'';position:absolute;top:5px;bottom:5px;width:10px;z-index:-1;}
  #townToast::before,#chestToast::before{left:-8px;clip-path:polygon(100% 0,100% 100%,0 100%,38% 50%,0 0);}
  #townToast::after,#chestToast::after{right:-8px;clip-path:polygon(0 0,0 100%,100% 100%,62% 50%,100% 0);}
  #townToast::before,#townToast::after{background:#7c5713;}
  #chestToast::before,#chestToast::after{background:#532a8a;}

  /* --- スクロールバー＝真鍮の細枠（コレクション/インベントリ本体＋通常カード） --- */
  .card,#collectionCard .col-body,#invCard .col-body{scrollbar-width:thin;scrollbar-color:rgba(214,163,47,.7) rgba(10,16,30,.35);}
  .card::-webkit-scrollbar,#collectionCard .col-body::-webkit-scrollbar,#invCard .col-body::-webkit-scrollbar{width:8px;}
  .card::-webkit-scrollbar-track,#collectionCard .col-body::-webkit-scrollbar-track,#invCard .col-body::-webkit-scrollbar-track{background:rgba(10,16,30,.4);border-radius:8px;}
  .card::-webkit-scrollbar-thumb,#collectionCard .col-body::-webkit-scrollbar-thumb,#invCard .col-body::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#d8b258,#8a6a1d);border-radius:8px;border:2px solid rgba(10,16,30,.55);}

  /* --- こまかな質感（可読性・統一感） --- */
  body{-webkit-font-smoothing:antialiased;}
  .bar-tag{border:1px solid rgba(255,233,160,.18);}
  .choice .nm{letter-spacing:.03em;}
  .mini-btn:active{transform:translateY(2px);box-shadow:0 0 0 rgba(40,28,6,.5),inset 0 1px 0 rgba(255,255,255,.4);}
  #volPanel input[type=range]{accent-color:var(--gold);}
  #titleCredit a{color:#e9c878;}
  #timer{letter-spacing:.04em;}
  .stat-line b{letter-spacing:.04em;}

  /* クールダウン数字を魔法陣リングより前面に（ジャッジ指摘対応） */
  .slot-btn:not(.empty)::after{z-index:0;}
  .slot-btn .cd{z-index:1;}

  /* ===== タイトル画面のコンパクト化（375x667で1画面に収める。世界観はそのまま密度だけ調整） ===== */
  #titleScreen h1{margin-top:8px!important;padding-top:4px;font-size:24px;}
  #titleScreen h1::before{margin-bottom:4px;height:8px;}
  #titleScreen h1::after{margin-top:5px;height:8px;}
  #titleScreen .sub{margin-bottom:9px;line-height:1.55;font-size:12.5px;}
  #titleScreen .howto{line-height:1.6;padding:9px 13px;margin:8px 0 10px;font-size:12.5px;}
  #titleScreen .btn{padding:12px;margin-top:7px;}
  #titleScreen .btn.sec{padding:9px;}
  #titleScreen #titleCredit{margin-top:7px;line-height:1.5;font-size:10px;}
  #titleScreen .card{padding-bottom:13px;}