/* © 2026 PassQuest Team (https://passquest.jp). All rights reserved. 無断複製・転載・改変を禁じます。 */
/* =========================================================================
 * tap_targets.css — «押せる範囲» だけを広げる（見た目は1ミリも変えません）
 *                                                            2026-09-17
 * 【なぜ】6機種で実測したところ、よく使うボタンの高さが 33〜42px でした。
 *   押しやすさの目安は Apple 44px / Android 48px です。
 *   壊れてはいませんが、働きながら勉強される方が 片手で操作すると
 *   押しまちがえやすい大きさです。
 *
 * 【やりかた】
 *   ボタンの «上下» に、透明な当たり判定をかぶせます。
 *     ・見た目（背景・枠・文字）は いっさい変わりません
 *     ・«上下» だけです。左右は広げません
 *       （♪OFF と ▾ のように 横に0pxで並ぶボタンがあり、
 *         左右に広げると 隣を奪ってしまうためです）
 *
 * 【効かないところがあります】
 *   ヘッダーの中の ⚔Normal・⏱OFF・ITEM・BGMの▾ は、
 *   ヘッダー自体の高さで切られるため、この方法では広がりません。
 *   （実測で確認済み。広げるにはヘッダーを高くする必要があり、
 *     それは «見た目が変わる» ので していません）
 *
 * 【元に戻すとき】
 *   index.html から この <link> の行を消すだけです。
 * ========================================================================= */

/* かぶせる箱を置くための土台。位置の指定が無いものにだけ効きます。 */
.pq-tap,
#hdr-back-btn,
#bgm-toggle-btn,
#bgm-pick-btn,
#mode-toggle-btn,
#timer-toggle-btn,
#header-wordbank-btn,
#title-login-btn,
#title-bgm-btn,
#lang-dropdown-trigger,
#title-menu-trigger,
.pq-diff-btn,
.lt-native-caret,
.lt-native-main,
.ov-back-btn,
#ov-back-btn,
#pq-ann-back,
#fc-back-btn {
    position: relative;
}
/* 「位置を固定」しているものは そのままにする（動かすと画面が崩れます） */
#title-plan-hint,
#title-menu-trigger,
#ov-back-btn,
#pq-ann-back {
    position: fixed;
}

/* ここからが «透明な当たり判定»。
   ::before を使います（::after を すでに使っているボタンがあるため）。 */
#hdr-back-btn::before,
#bgm-toggle-btn::before,
#bgm-pick-btn::before,
#mode-toggle-btn::before,
#timer-toggle-btn::before,
#header-wordbank-btn::before,
#title-login-btn::before,
#title-bgm-btn::before,
#lang-dropdown-trigger::before,
#title-menu-trigger::before,
#title-plan-hint::before,
.pq-diff-btn::before,
.lt-native-caret::before,
.lt-native-main::before,
#ov-back-btn::before,
#pq-ann-back::before,
#fc-back-btn::before,
.pq-tap::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -6px;
    bottom: -6px;
    background: transparent;
    /* ★ 親のまとまり（.header-btn-group など）が先に当たってしまうので、
       ひとつ前に出します。透明なので 見た目は変わりません。 */
    z-index: 2;
    pointer-events: auto;
}

/* ボタンの中身が 透明の箱に隠れないように、中身を前に出します */
#hdr-back-btn > *,
#bgm-toggle-btn > *,
#mode-toggle-btn > *,
#timer-toggle-btn > *,
#header-wordbank-btn > *,
#title-login-btn > *,
#title-bgm-btn > *,
#lang-dropdown-trigger > *,
#title-menu-trigger > *,
#title-plan-hint > *,
.pq-diff-btn > *,
.lt-native-main > *,
#ov-back-btn > *,
#pq-ann-back > *,
#fc-back-btn > * {
    position: relative;
    z-index: 3;
}
