html, body { margin: 0; padding: 0; width: 100%; height: 100%; background: #110d1c; overflow: hidden;
                 touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
                 -webkit-tap-highlight-color: transparent; overscroll-behavior: none; }
    #unity-canvas { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100dvh; display: block;
                    background: #221a38; outline: none; }
    #loading { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
               color: #ff9a3c; font: bold 32px sans-serif; letter-spacing: 2px; }
    #bar { width: 260px; max-width: 70vw; height: 10px; background: #332a4a; margin-top: 18px; border-radius: 5px; overflow: hidden; }
    #fill { height: 100%; width: 0; background: #ff9a3c; }
    #msg { font-size: 14px; margin-top: 12px; color: #aaa; letter-spacing: 0; }

    /* 全画面ボタン（全画面にできるブラウザだけ出す） */
    #fullscreen { position: fixed; top: max(8px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right));
                  width: 40px; height: 40px; border: 0; border-radius: 8px; background: rgba(0,0,0,0.35);
                  color: #fff; font: bold 22px sans-serif; display: none; z-index: 11; }

    /* スマホを縦にしているときのお願い */
    #rotate { position: fixed; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center;
              background: rgba(17, 13, 28, 0.94); color: #fff; font: bold 20px sans-serif; text-align: center; z-index: 10; gap: 18px; }
    #rotate .phone { width: 44px; height: 76px; border: 4px solid #ff9a3c; border-radius: 9px; animation: turn 2s ease-in-out infinite; }
    #rotate small { font-weight: normal; font-size: 14px; color: #bbb; }
    @keyframes turn { 0%, 30% { transform: rotate(0deg); } 60%, 100% { transform: rotate(90deg); } }
    @media (orientation: portrait) and (pointer: coarse) { #rotate { display: flex; } }