/* ============================================================
   pc.css — PC 表示 (Figma: PC 47:2736)
   青い背景 + ヤシの葉 + 中央にスマホ枠（420 × 780〜820）
============================================================ */
@media (min-width:768px) and (min-height:600px){
  body{
    background:var(--pc-blue);
    align-items:center;
    position:relative;
  }
  body::before{
    content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
    background:
      url("../assets/img/pc_background_top_left.png") left top / 420px auto no-repeat,
      url("../assets/img/pc_background_bottom_right.png") right bottom / 360px auto no-repeat;
  }
  body::after{
    content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
    background:url("../assets/img/ui/texture.jpg") 0 0 / 614px 614px repeat;
    mix-blend-mode:color-burn; opacity:.3;
  }
  #stage{
    position:relative; z-index:1;
    width:420px; max-width:420px;
    height:min(820px, calc(100vh - 40px));
    border-radius:40px;
    box-shadow:0 20px 60px rgba(0,0,0,.25);
  }
  #stage.shake{ animation-name:shakePc; }
  @keyframes shakePc{
    25%{ transform:translateX(-7px); }
    50%{ transform:translateX(6px); }
    75%{ transform:translateX(-4px); }
  }
  /* PC ではセーフエリアなし */
  :root{ --safe-top:0px; --safe-bottom:0px; }
  .btn:hover .btn-inner{ filter:brightness(1.05); }
}
