/* =========================================
   Hamburger (A案) SP only - FINAL (Unified)
   - 対象navは #nephilim-nav（header.phpで付けたID）
   - SP：タブ固定（四角形）
   - OPEN時：MENU ⇄ CLOSE
   - nav：画面最上部（top:0）から全面展開
   - z：タブが常に最前面
   ====================================== */
@media (max-width: 768px) {

  /* -----------------------------
     Tab（右上固定・ベーシック四角）
     ----------------------------- */
  .nephilim-nav-tab{
    position: fixed;
    top: 8px;
    right: 8px;

    width: 72px;
    height: 40px;

    z-index: 100000;      /* navより上 */
    pointer-events: auto;

    display: grid;
    place-items: center;

    border: none;
    background: transparent;
    color: rgba(0,0,0,0.85);

    padding: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  /* 文字はCSS側で管理（HTML直書きなら消すのが理想） */
  .nephilim-nav-tab::after{
    content: "MENU";
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
  }
  body.nephilim-nav-open .nephilim-nav-tab::after{
    content: "CLOSE";
  }

  /* 背景：素直な角丸矩形 */
  .nephilim-nav-tab::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;

    background: rgba(255,255,255,0.90);
    border: 1px solid rgba(0,0,0,0.22);
    border-radius: 8px;

    box-shadow:
      0 4px 10px rgba(0,0,0,0.12),
      0 1px 2px rgba(0,0,0,0.08);
  }

  /* OPEN時：タブを少し強調 */
  body.nephilim-nav-open .nephilim-nav-tab::before{
    background: rgba(255,255,255,0.98);
    border-color: rgba(0,0,0,0.35);
    box-shadow:
      0 6px 18px rgba(0,0,0,0.22),
      0 2px 6px rgba(0,0,0,0.12);
  }

  /* -----------------------------
     Nav（SP：画面最上部から展開）
     ----------------------------- */

  /* 通常時は隠す（最重要） */
  #nephilim-nav{
    display: none;
  }

  /* 開いたときだけ表示 */
  body.nephilim-nav-open #nephilim-nav{
    display: block;
  }

  /* 画面最上部から全面展開（タブと被ってOK） */
  #nephilim-nav{
    position: fixed;
    top: 0;
    right: 0;

    width: 100vw;
    height: 100vh;

    background: rgba(255,255,255,0.94);
    box-shadow: 0 10px 28px rgba(0,0,0,0.18);

    z-index: 90000;       /* タブより下 */
    overflow-y: auto;
    pointer-events: auto;
  }

  /* WPメニュー中身 */
  #nephilim-nav ul{
    list-style: none;
    margin: 0;

    /* タブ領域ぶんだけ上を空ける（被ってもOKだが視認性のため） */
    padding: 64px 14px 16px;
  }

  #nephilim-nav li{
    margin: 0;
  }

  #nephilim-nav a{
    display: block;
    padding: 14px 10px;

    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    color: rgba(0,0,0,0.85);

    border-radius: 10px;
  }

  #nephilim-nav a:active{
    background: rgba(0,0,0,0.06);
  }
}

/* PCではタブ非表示（navは通常表示のまま） */
@media (min-width: 769px) {
  .nephilim-nav-tab{ display: none; }
}
