@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&family=JetBrains+Mono:wght@400;600&display=swap');

  *{box-sizing:border-box;}

  html,body{
    margin:0; padding:0; height:100%;
    background:
      radial-gradient(circle at 18% 18%, rgba(255,83,145,.24) 0 2%, transparent 18%),
      radial-gradient(circle at 82% 28%, rgba(74,180,255,.20) 0 3%, transparent 20%),
      radial-gradient(ellipse at 50% -12%, #693c83 0%, transparent 55%),
      repeating-linear-gradient(115deg, rgba(255,255,255,.018) 0 2px, transparent 2px 18px),
      linear-gradient(180deg, #251342 0%, #100b28 100%);
    color:#faf3e6;
    font-family:'JetBrains Mono', monospace;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
    -webkit-tap-highlight-color:transparent;
    user-select:none; -webkit-user-select:none; overscroll-behavior:none; touch-action:manipulation;
  }

  .stage{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 12px 22px; width:100%; max-width:640px; }

  .title{
    font-family:'Zen Maru Gothic', sans-serif; font-weight:900; font-size:23px; letter-spacing:1px;
    background:linear-gradient(90deg, #ff8ec7, #ffd98a, #8ecbff);
    -webkit-background-clip:text; background-clip:text; color:transparent; margin:0;
  }
  .subtitle{ font-family:'Zen Maru Gothic', sans-serif; font-size:11px; color:#cdc3d9; margin:-4px 0 0; text-align:center; }

  .arena{
    position:relative; display:flex; gap:5px; padding:9px; border-radius:20px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.045), transparent 22%),
      repeating-linear-gradient(90deg, rgba(255,217,138,.025) 0 1px, transparent 1px 14px),
      linear-gradient(160deg, #36225b 0%, #181238 62%, #12102d 100%);
    box-shadow:inset 0 0 0 2px rgba(255,217,138,.20), 0 20px 50px rgba(0,0,0,0.5);
  }

  /* touch-action:manipulationを明示。団子を置くタップ判定を盤面全体(panelEl)に広げた際、
     連打(ダブルタップ)がiOS Safariの「ダブルタップでズーム」ジェスチャーと誤認識され、
     画面が拡大してしまう不具合の対策。 */
  .panel{ display:flex; flex-direction:column; align-items:center; gap:3px; position:relative; width:150px; touch-action:manipulation; }
  /* 盤面(canvas)は常に元のフル幅サイズを維持。必殺技ボタンはcanvasの下、
     盤面を縮めずに生まれる余白部分に配置する(横並びにして盤面を圧迫しない)。*/
  .board-wrap{ position:relative; width:100%; display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
  .board-wrap canvas{ width:100%; }
  /* 左利き設定時はボタンを左側の余白に配置。*/
  body.lefty .board-wrap{ align-items:flex-start; }
  .panel.inactive{ display:none; }
  .panel-top{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:0 2px; gap:4px; }
  .p-name{ font-family:'Zen Maru Gothic', sans-serif; font-weight:700; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .p-type{ font-size:8.5px; color:#cdc3d9; background:rgba(255,255,255,0.08); border-radius:6px; padding:1px 5px; white-space:nowrap; }
  canvas{ display:block; border-radius:10px; touch-action:none; cursor:pointer; }
  .p-height{ font-family:'Zen Maru Gothic', sans-serif; font-size:10.5px; font-weight:700; color:#ffe27a; }
  .gauge-row{ display:flex; align-items:center; gap:5px; width:100%; }
  .gauge{ flex:1; height:6px; background:#17102f; border-radius:5px; overflow:hidden; }
  .gauge>i{ display:block; height:100%; width:0; background:linear-gradient(90deg,#ff8ec7,#ffd98a); transition:width .15s; }
  .gauge-text{ font-size:9px; color:#cdc3d9; min-width:26px; text-align:right; }

  .reach-banner{
    position:absolute; top:7px; right:7px; left:auto; transform:none;
    background:rgba(255,90,54,0.92); color:#fff; font-family:'Zen Maru Gothic',sans-serif;
    font-weight:900; font-size:10.5px; text-align:center; line-height:1.4; padding:6px 10px; border-radius:10px;
    z-index:8; animation:reachfade 1.05s ease-out forwards; pointer-events:none;
  }
  .reach-banner.hidden{ display:none; }
  @keyframes reachfade{ 0%{opacity:0;transform:translateY(-3px)} 18%{opacity:1;transform:none} 78%{opacity:1} 100%{opacity:0} }

  .overlay{
    position:absolute; inset:8px; border-radius:16px; background:rgba(24,16,51,0.96);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:10px; text-align:center; padding:16px; z-index:10; overflow-y:auto;
  }
  .hidden{display:none !important;}

  /* 広告表示中は画面全体を覆い、裏のゲームにタップが一切届かないようにする。
     GameMonetize/AdSense H5の実装が入るまでは、この中身をダミー表示にしておく。 */
  .ad-overlay{
    position:fixed; inset:0; z-index:9999;
    background:rgba(8,4,18,.97);
    display:flex; align-items:center; justify-content:center;
    pointer-events:auto; touch-action:none;
  }
  .ad-overlay-inner{
    color:#fff6b0; font-family:'Zen Maru Gothic',sans-serif; font-weight:900;
    text-align:center; font-size:14px;
  }
  .overlay.hidden{display:none !important;}
  .overlay h2{ font-family:'Zen Maru Gothic', sans-serif; font-size:18px; margin:0; color:#ffd98a; }
  .overlay p{ margin:0; font-size:12px; color:#cdc3d9; line-height:1.65; max-width:380px; }
  .overlay .winner{ font-family:'Zen Maru Gothic', sans-serif; font-size:21px; font-weight:900; margin:0; }

  .btn{
    font-family:'Zen Maru Gothic', sans-serif; font-weight:700; font-size:14px; color:#181033;
    background:linear-gradient(180deg, #ffd98a, #ff8a5b); border:none; border-radius:999px; padding:10px 26px; cursor:pointer;
  }
  .btn:active{ transform:scale(0.96); }
  .btn.alt{ background:linear-gradient(180deg, #a9d4ff, #4fa3ff); }
  .btnrow{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }

  .hint{ font-size:10.5px; color:#cdc3d9; opacity:0.8; text-align:center; }
  .hint b{ color:#ffd98a; }

  .battlehud{ font-family:'Zen Maru Gothic',sans-serif; display:flex; gap:12px; align-items:center; color:#ffd98a; font-weight:700; font-size:13px; }
  .battlehud.hidden{ display:none; }

  .modebar{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:2px}
  .smallbtn{font-family:'Zen Maru Gothic',sans-serif;background:#35285d;color:#faf3e6;border:1px solid #6b5a99;border-radius:999px;padding:6px 10px;cursor:pointer;font-size:10px}
  .smallbtn.active{background:#ffd98a;color:#181033;border-color:#ffd98a}

  /* character select cards */
  .chars{ display:grid; grid-template-columns:1fr 1fr; gap:7px; width:100%; max-width:420px; max-height:280px; overflow-y:auto; padding:2px; }
  .fchar-card{
    display:flex; flex-direction:column; gap:3px; align-items:flex-start; text-align:left;
    background:#2c2050; border:1px solid #6b5a99; border-radius:12px; padding:8px 9px; cursor:pointer; color:#faf3e6;
    font-family:'Zen Maru Gothic', sans-serif;
  }
  .fchar-card:active{ transform:scale(0.97); }
  .fc-top{ display:flex; align-items:center; gap:5px; }
  .fc-emoji{ font-size:16px; }
  .fc-name{ font-weight:700; font-size:12px; }
  .type-badge{ font-size:8px; border-radius:6px; padding:1px 6px; font-weight:700; }
  .type-badge[data-type="攻撃"]{ background:#ff5a36; color:#fff; }
  .type-badge[data-type="トリッキー"]{ background:#9b7cff; color:#fff; }
  .type-badge[data-type="妨害"]{ background:#2c2060; color:#cdb8ff; border:1px solid #6b5a99; }
  .type-badge[data-type="精密"]{ background:#ffd98a; color:#181033; }
  .type-badge[data-type="安定"]{ background:#7bc96f; color:#0f2a12; }
  .fc-skill{ font-size:10.5px; font-weight:700; color:#ffd98a; }
  .fc-desc{ font-size:9px; color:#cdc3d9; line-height:1.4; }

  /* skill / break splashes */
  .ultsplash{
    position:absolute; top:8px; left:50%; transform:translateX(-50%);
    z-index:14; pointer-events:none;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
    width:max-content; max-width:94%;
    background:rgba(255,255,255,0.96); color:#241a45;
    border:2px solid #ffd98a; border-radius:12px; text-align:center;
    padding:5px 11px;
    box-shadow:0 6px 16px rgba(0,0,0,.35);
    animation:skilltoast 0.85s ease-out forwards;
  }
  .ultsplash .sp-title{ font-family:'Zen Maru Gothic',sans-serif; font-weight:900; font-size:15px; color:#241a45; line-height:1.15; }
  .ultsplash .sp-next{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:10.5px; color:#c8283f; }
  .ultsplash.hit{ background:rgba(255,225,225,0.97); border-color:#ff5a5a; }
  .ultsplash.hit .sp-title, .ultsplash.hit .sp-next{ color:#7a0018; }
  @keyframes splashpop{ 0%{opacity:0; transform:scale(0.8);} 10%{opacity:1; transform:scale(1.03);} 20%{transform:scale(1);} 82%{opacity:1;} 100%{opacity:0;} }
  @keyframes skilltoast{0%{opacity:0;transform:translateX(-50%) translateY(-8px) scale(.85)}18%{opacity:1;transform:translateX(-50%) translateY(0) scale(1.05)}30%{transform:translateX(-50%) scale(1)}78%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-6px) scale(.97)}}

  .breaksplash{
    position:absolute; inset:6px; z-index:12; pointer-events:none;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    background:rgba(60,10,10,0.62); border-radius:14px; text-align:center;
    animation:splashpop 0.85s ease-out forwards;
  }
  .breaksplash .bs-title{ font-family:'Zen Maru Gothic',sans-serif; font-weight:900; font-size:14px; color:#ffb0b0; }
  .breaksplash .bs-lives{ font-size:13px; letter-spacing:2px; }

  .tiertext{
    position:absolute; top:38%; left:50%; transform:translateX(-50%);
    font-family:'Zen Maru Gothic',sans-serif; font-weight:900; z-index:9; pointer-events:none;
    animation:tierpop 0.6s ease-out forwards;
  }
  .tiertext.t-just{ font-size:19px; color:#ffe27a; text-shadow:0 0 10px rgba(255,226,122,0.9); animation-duration:0.9s; }
  .tiertext.t-perfect{ font-size:15px; color:#ff8ec7; text-shadow:0 0 6px rgba(255,142,199,0.7); }
  .tiertext.t-good{ font-size:11px; color:#cdc3d9; }
  @keyframes tierpop{ 0%{opacity:0; transform:translateX(-50%) translateY(4px) scale(0.7);} 20%{opacity:1; transform:translateX(-50%) translateY(0) scale(1.06);} 75%{opacity:1;} 100%{opacity:0; transform:translateX(-50%) translateY(-8px) scale(1);} }

  .panel.break-shake{ animation:panelshake .42s ease-out; }
  .panel.skill-cast-flash{ animation:skillcastglow .4s ease-out; }
  .panel.skill-hit-flash{ animation:skillhitglow .45s ease-out; }
  @keyframes skillcastglow{
    0%{ box-shadow: inset 0 0 0 0 rgba(255,217,138,0); }
    15%{ box-shadow: inset 0 0 26px 6px rgba(255,217,138,0.85); }
    100%{ box-shadow: inset 0 0 0 0 rgba(255,217,138,0); }
  }
  @keyframes skillhitglow{
    0%{ box-shadow: inset 0 0 0 0 rgba(255,46,77,0); }
    15%{ box-shadow: inset 0 0 30px 7px rgba(255,46,77,0.85); }
    100%{ box-shadow: inset 0 0 0 0 rgba(255,46,77,0); }
  }
  @keyframes panelshake{
    0%,100%{transform:translateX(0)}
    12%{transform:translateX(-9px) rotate(-1deg)}
    25%{transform:translateX(8px) rotate(1deg)}
    40%{transform:translateX(-6px)}
    58%{transform:translateX(5px)}
    76%{transform:translateX(-2px)}
  }
  .combotext{
    position:absolute; top:27%; left:50%; transform:translateX(-50%);
    z-index:13; pointer-events:none; white-space:nowrap;
    font-family:'Zen Maru Gothic',sans-serif; font-weight:900;
    font-size:22px; color:#ffe27a;
    text-shadow:0 2px 0 #a84d36,0 0 14px rgba(255,226,122,.95);
    animation:combopop .85s ease-out forwards;
  }
  @keyframes combopop{
    0%{opacity:0;transform:translateX(-50%) scale(.45) rotate(-7deg)}
    18%{opacity:1;transform:translateX(-50%) scale(1.25) rotate(4deg)}
    35%{transform:translateX(-50%) scale(1) rotate(0)}
    78%{opacity:1}
    100%{opacity:0;transform:translateX(-50%) translateY(-18px) scale(1.08)}
  }
  #endOverlay.victory .winner{
    color:#ffe27a;
    text-shadow:0 0 18px rgba(255,226,122,.8);
    animation:winnerbounce .72s cubic-bezier(.2,.8,.2,1) infinite alternate;
  }
  @keyframes winnerbounce{
    from{transform:translateY(0) scale(1)}
    to{transform:translateY(-8px) scale(1.09)}
  }
  .confetti-piece{
    position:absolute; top:-16px; width:8px; height:13px; z-index:20;
    pointer-events:none; border-radius:2px;
    animation:confettifall var(--dur) linear forwards;
  }
  @keyframes confettifall{
    0%{transform:translate3d(0,-10px,0) rotate(0deg);opacity:1}
    100%{transform:translate3d(var(--drift),390px,0) rotate(760deg);opacity:.1}
  }


  .stage::before,.stage::after{
    content:""; position:fixed; top:-18vh; width:22vw; height:115vh; z-index:-1;
    /* 軽量化: 画面全体サイズのblur(16px)を無限アニメさせるとiPhoneで毎フレーム
       合成し直しになりカクつくため、ぼかし・点滅をやめて静止グラデーションにした。 */
    opacity:.16; pointer-events:none; transform-origin:top center;
  }
  .stage::before{left:12vw;background:linear-gradient(180deg,#ff5d9e,transparent 70%);transform:rotate(16deg)}
  .stage::after{right:12vw;background:linear-gradient(180deg,#65c8ff,transparent 70%);transform:rotate(-16deg);animation-delay:-1.6s}
  @keyframes stagebeam{from{opacity:.08}to{opacity:.24}}
  .songline{
    position:absolute; left:50%; bottom:8px; transform:translateX(-50%);
    z-index:8; width:94%; text-align:center; pointer-events:none;
    font-family:'Zen Maru Gothic',sans-serif; font-weight:900; font-size:10px;
    color:#fff6b0; text-shadow:0 2px 5px #120b2c,0 0 8px rgba(255,217,138,.7);
    opacity:0; transition:opacity .15s;
  }
  .songline.show{opacity:.9}


  .bgm-toggle{
    position:relative; z-index:100;
    border:2px solid rgba(255,255,255,.22); border-radius:999px;
    background:rgba(18,12,43,.88); color:#fff6b0;
    padding:7px 12px; cursor:pointer;
    font-family:'Zen Maru Gothic',sans-serif; font-weight:900; font-size:11px;
    box-shadow:0 5px 18px rgba(0,0,0,.28);
  }

  .audio-toggles{
    position:fixed; top:12px; right:12px; z-index:100;
    display:flex; gap:7px; align-items:center;
  }
  .lyrics-toggle{color:#ffd6f4}
  .bgm-toggle:hover{transform:scale(1.04)}
  .bgm-toggle.off{color:#aaa;background:rgba(25,22,38,.9)}

  .dango-taunt{
    position:absolute; inset:0; z-index:30; pointer-events:none;
    display:flex; align-items:center; justify-content:center;
    background:rgba(15,10,35,.10);
    animation:tauntFade 1.35s ease-out forwards;
  }
  .taunt-card{
    display:flex; align-items:center; gap:12px;
    padding:12px 16px 12px 12px;
    border-radius:22px;
    background:rgba(255,250,230,.96);
    border:3px solid #ffb85c;
    box-shadow:0 12px 28px rgba(0,0,0,.35);
    transform:rotate(-3deg);
    animation:tauntPop .42s cubic-bezier(.2,1.5,.3,1);
  }
  .taunt-dango{
    width:70px; height:70px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:39px; position:relative;
    background:radial-gradient(circle at 35% 28%,#fff8d5 0 16%,#f6cf82 17% 70%,#d9984e 71%);
    box-shadow:inset -7px -8px 0 rgba(130,74,40,.12),0 6px 12px rgba(0,0,0,.18);
    animation:dangoLaugh .18s ease-in-out infinite alternate;
  }
  .taunt-dango::after{
    content:"ｗ"; position:absolute; right:-5px; top:-13px;
    color:#ff5d72; font-size:22px; font-weight:900;
    transform:rotate(15deg);
  }
  .taunt-copy{
    color:#3a234b; font-family:'Zen Maru Gothic',sans-serif;
    font-weight:900; font-size:15px; line-height:1.3;
    max-width:160px; text-align:left;
  }
  .taunt-copy small{
    display:block; margin-top:3px; color:#d55c55;
    font-size:9px; letter-spacing:.08em;
  }
  @keyframes tauntPop{
    0%{transform:scale(.35) rotate(-12deg);opacity:0}
    65%{transform:scale(1.12) rotate(3deg);opacity:1}
    100%{transform:scale(1) rotate(-3deg);opacity:1}
  }
  @keyframes dangoLaugh{
    from{transform:translateY(0) rotate(-5deg)}
    to{transform:translateY(-5px) rotate(5deg)}
  }
  @keyframes tauntFade{
    0%,75%{opacity:1}100%{opacity:0}
  }


  /* 歌は流すが、字幕だけ表示しない */
  #lyrics, #lyric, .lyrics, .lyric, .lyric-overlay, .vocal-text, [class*="lyric"]{
    display:none !important;
    visibility:hidden !important;
  }


  /* BGMの歌声は残す。画面上の歌詞字幕だけ完全に消す。 */
  #songline, .songline, #lyrics, #lyric, .lyrics, .lyric, .lyric-overlay,
  .vocal-text, [class*="lyric"] { display:none !important; visibility:hidden !important; }


  /* ===== MOBILE RELEASE PROTOTYPE ===== */
  html,body{width:100%;min-height:100%;overflow-x:hidden}
  body{margin:0;touch-action:manipulation}
  .stage{
    width:100vw !important; max-width:480px !important; min-width:0 !important;
    min-height:100dvh; margin:0 auto; padding:10px 10px 18px !important;
    box-sizing:border-box;
  }
  .title{font-size:clamp(25px,8vw,38px)!important;margin-top:6px!important}
  .subtitle{font-size:11px!important}
  .arena{
    width:100%!important; max-width:440px!important; min-height:510px!important;
    box-sizing:border-box; padding:8px!important; overflow:hidden!important;
  }
  .arena:not(.mode4){display:flex!important;justify-content:space-evenly!important;gap:8px!important}
  /* 利き手設定: CPU対戦・オンラインでは自分の盤面(panel0)を利き手側へ寄せる。
     ふたりで遊ぶ(ローカルVS)は1P/2Pが別人なので対象外(JS側でクラスを付けない)。 */
  .arena.self-right{flex-direction:row-reverse!important}
  /* 必殺技ボタンが自動発動になり不要になった分、盤面を少し大きくする。 */
  .arena:not(.mode4) .panel{width:min(48vw,208px)!important;flex:1 1 0}
  .arena:not(.mode4) canvas{width:100%!important;height:auto!important;max-height:64vh}
  .modebar{display:grid!important;grid-template-columns:repeat(3,1fr);gap:6px;width:100%}
  .modebar .smallbtn{width:100%;min-height:42px}
  .overlay{inset:5px!important;padding:12px!important}
  .chars{grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  .char-card{min-width:0!important}
  .btn{min-height:46px}
  .mobile-online-menu{display:grid;gap:9px;width:min(310px,90%)}
  .mobile-online-menu .btn{width:100%}
  .room-box{
    width:min(320px,92%);padding:12px;border:1px solid rgba(255,255,255,.15);
    border-radius:14px;background:rgba(255,255,255,.055)
  }
  .room-code{
    font-size:28px;font-weight:900;letter-spacing:.16em;color:#ffe27a;margin:7px 0
  }
  .join-code{
    width:100%;box-sizing:border-box;font-size:20px;text-align:center;letter-spacing:.14em;
    padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.2);
    background:#17102f;color:white;text-transform:uppercase
  }
  .online-note{font-size:10px!important;opacity:.72}
  @media (min-width: 760px){
    .stage{max-width:520px!important}
  }


/* v3.1 skill impact: 技が発動した瞬間を見逃さない */



/* Solo score HUD */
.solo-score{width:100%;display:flex;justify-content:space-between;gap:4px;padding:4px 7px;border-radius:8px;background:rgba(11,8,38,.72);border:1px solid rgba(255,226,122,.28);font-size:8.5px;font-weight:800;letter-spacing:.3px;color:#ddd6ff;box-sizing:border-box}
.solo-score b{color:#ffe27a;font-size:10px}
.solo-score.hidden{display:none}

/* ===== SOLO HIGH-DPI RESPONSIVE DISPLAY =====
   Physics stay at 150x300 logical units. The canvas backing bitmap is
   devicePixelRatio-aware in game.js, while CSS scales it uniformly. */
.arena.solo-mode{
  width:100%!important;
  max-width:440px!important;
  min-width:0!important;
  min-height:0!important;
  justify-content:center!important;
  padding:8px!important;
}
.arena.solo-mode .panel{
  width:min(72vw,270px)!important;
  max-width:270px!important;
  flex:0 1 auto!important;
}
.arena.solo-mode canvas{
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  aspect-ratio:1 / 2!important;
}
.arena.solo-mode .panel-top,
.arena.solo-mode .solo-score,
.arena.solo-mode .gauge-row{
  width:100%!important;
}

/* v5: persistent solo best-record panel */
.best-record-grid{display:grid;grid-template-columns:1fr;gap:8px;width:min(280px,90%)}
.best-record-grid>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 12px;border-radius:12px;background:rgba(11,8,38,.82);border:1px solid rgba(255,226,122,.32)}
.best-record-grid span{font-size:10px;font-weight:800;letter-spacing:.7px;color:#cfc8e8}
.best-record-grid b{font-family:'Zen Maru Gothic',sans-serif;font-size:20px;color:#ffe27a}

input,textarea{user-select:text;-webkit-user-select:text;touch-action:manipulation;}
.btn,.smallbtn,.fchar-card{touch-action:manipulation;}

/* RC4: manual skill activation */
.skill-btn{touch-action:manipulation;width:100%;border:0;border-radius:9px;padding:6px 8px;font-weight:900;font-size:10px;background:#2b2440;color:#817890;opacity:.55;pointer-events:none}
.skill-btn.ready{background:linear-gradient(90deg,#ffd84a,#ff8ec7);color:#25152f;opacity:1;pointer-events:auto;box-shadow:0 0 12px rgba(255,216,74,.55);animation:skillready .8s ease-in-out infinite alternate}

/* 必殺技はゲージが貯まったら自動発動する方式に戻したため、手動タップ用ボタンは非表示。
   その分、盤面(canvas)を少し大きく表示できるようにした(上のmobileメディアクエリ参照)。 */
.skill-btn.floating{
  display:none;
  position:static;
  flex:0 0 auto;
  width:52px; height:52px; max-width:none;
  margin:0;
  border-radius:14px; padding:4px;
  font-size:8.5px; line-height:1.15; text-align:center;
  box-shadow:0 4px 14px rgba(0,0,0,.35);
}

.hand-toggle{color:#bfe0ff}
@keyframes skillready{from{transform:scale(.98)}to{transform:scale(1.02)}}

/* ランダムマッチ(追加) */
.random-btn{font-size:17px!important;min-height:58px!important;background:linear-gradient(135deg,#ff8ac2,#ffb36b)!important;color:#2a1240!important;font-weight:900}
.random-status{font-weight:900;font-size:15px}
.random-elapsed{font-size:26px;font-weight:900;color:#ffe27a;margin:6px 0}
.random-actions{display:grid;gap:8px;margin-top:8px}
.random-actions .btn{width:100%;margin:0}
#randomWake:empty,#randomCount:empty{display:none}