.controller-browser-notice[hidden] { display: none; }
.controller-browser-notice { position: fixed; z-index: 10000; top: calc(84px + env(safe-area-inset-top, 0px)); left: 12px; right: 12px; margin-inline: auto; width: min(460px, calc(100% - 24px)); box-sizing: border-box; padding: 16px; border: 1px solid #d2d2d7; border-radius: 16px; background: #fff; color: #1d1d1f; box-shadow: 0 8px 32px #0002; font: 14px/1.6 -apple-system, BlinkMacSystemFont, sans-serif; }
.controller-browser-arrow { position: fixed; top: calc(4px + env(safe-area-inset-top, 0px)); right: calc(12px + env(safe-area-inset-right, 0px)); width: 90px; height: 80px; fill: none; stroke: #06c; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 1px 2px #fff); pointer-events: none; }
.controller-browser-notice strong, .controller-browser-notice span, .controller-browser-notice small { display: block; }
.controller-browser-notice button { margin: 10px 8px 0 0; padding: 6px 12px; background: #f5f5f7; color: #0066cc; border: 0; border-radius: 8px; cursor: pointer; font: inherit; }
.controller-browser-notice input { box-sizing: border-box; width: 100%; margin-top: 8px; }

.controller-browser-notice .controller-browser-instruction { margin-top: 8px; font-size: 16px; font-weight: 600; }
.controller-browser-notice .controller-browser-fallback { margin-top: 8px; color: #6e6e73; }
