.testflight-guide[hidden] { display: none !important; }
.testflight-guide { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); background: rgba(9, 20, 35, .82); overflow: hidden; }
.testflight-guide-card { position: relative; width: min(1226px, 100%); height: min(850px, 86dvh); max-height: 86dvh; display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 20px; overflow: hidden; border: 3px solid #dc8b27; border-radius: 16px; background: #fff7df; color: #442711; box-shadow: 0 18px 55px rgba(0,0,0,.45); text-align: center; }
.testflight-guide-card h2 { margin: 0; padding: 0 48px; font-size: clamp(20px, 4vw, 30px); line-height: 1.3; }
.testflight-guide-close { position: absolute; top: 10px; left: 10px; z-index: 4; width: 42px; height: 42px; padding: 0; border: 2px solid #9e4614; border-radius: 50%; background: #fff0ca; color: #7c2f0d; font: 700 31px/36px Arial, sans-serif; cursor: pointer; }
.testflight-guide-video { position: relative; flex: 1 1 auto; min-height: 0; width: 100%; overflow: hidden; border-radius: 10px; background: #000; }
.testflight-guide-video video { display: block; width: 100%; height: 100%; object-fit: contain; cursor: pointer; }
.testflight-video-pause { position: absolute; inset: 50% auto auto 50%; z-index: 2; width: 76px; height: 76px; padding: 0; transform: translate(-50%, -50%); border: 3px solid rgba(255,255,255,.9); border-radius: 50%; background: rgba(0,0,0,.62); color: #fff; font: 700 34px/1 sans-serif; cursor: pointer; box-shadow: 0 4px 18px rgba(0,0,0,.4); }
.testflight-video-pause[hidden] { display: none; }
.testflight-guide-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; width: 100%; }
.testflight-guide-actions button { min-width: 130px; min-height: 46px; padding: 9px 18px; border: 2px solid #9e4614; border-radius: 10px; background: linear-gradient(#f7bb55, #de7b2c); color: #3d230e; font-family: inherit; font-size: 17px; font-weight: 700; cursor: pointer; }
.testflight-guide-actions button:focus-visible, .testflight-guide-video video:focus-visible, .testflight-video-pause:focus-visible, .testflight-guide-close:focus-visible { outline: 3px solid #1b65ad; outline-offset: 3px; }
body.testflight-guide-open { overflow: hidden; }
@keyframes forum-button-blink { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.23); } }
#openTestflightGuide, #openRegister { animation: forum-button-blink 2.2s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { #openTestflightGuide, #openRegister { animation: none; } }
@media (max-width: 600px) { .testflight-guide { padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); } .testflight-guide-card { width: 100%; height: min(850px, 86dvh); max-height: 86dvh; padding: 12px; gap: 10px; } .testflight-guide-close { top: 7px; left: 7px; width: 38px; height: 38px; font-size: 28px; line-height: 32px; } }
@media (max-height: 520px) and (orientation: landscape) { .testflight-guide { padding: 6px max(8px, env(safe-area-inset-right)) 6px max(8px, env(safe-area-inset-left)); } .testflight-guide-card { height: 86dvh; max-height: 86dvh; padding: 8px 12px; gap: 6px; } .testflight-guide-card h2 { font-size: 18px; line-height: 1.15; } .testflight-guide-actions button { min-height: 38px; padding: 5px 14px; font-size: 15px; } }