/* Phone app hints (console/app/app.js): the menu's panel language since Menü v2 „Kino“ (console/menu/menu.css: dark glass, no coloured
   edge, the action as a milk-white button), above everything, inside the safe area. */
@font-face { font-family: 'Lexend'; src: url('/console/menu/fonts/lexend.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
.app-hint, .app-full {
  position: fixed; z-index: 1000; font: 500 15px/1.4 'Lexend', 'Avenir Next', 'Futura', sans-serif; color: #f3ead8;
  background: rgba(16, 17, 22, .92); border: 0; border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.app-hint {
  left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); top: max(12px, env(safe-area-inset-top));
  display: flex; gap: 14px; align-items: center; padding: 12px 12px 12px 18px;
}
.app-hint button, .app-full { min-height: 44px; min-width: 44px; cursor: pointer; }
.app-hint button { flex: none; font: 600 15px/1 'Lexend', 'Avenir Next', 'Futura', sans-serif; color: #07080c; background: #f3ead8; border: 0; border-radius: 12px; padding: 0 18px; }
/* Top middle, never in a thumb zone (Spieltester 26.10.: bottom right it covered the jump button, repeat of findings 70/73); it goes
   a while after the game started (app.js FULL_AWAY_MS). */
.app-full { left: 50%; top: max(12px, env(safe-area-inset-top)); transform: translateX(-50%); padding: 0 18px; font-weight: 600; transition: opacity .4s ease, visibility .4s; }
.app-full.is-away { opacity: 0; visibility: hidden; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .app-full { transition: none; } }

/* The strip under the status bar (clock, Dynamic Island) is a solid band in the menu's deepest colour, in Safari and in the
   home-screen app alike (Alex 12.10.: „oben der Rand ist … immer unscharf“ – Safari blurs what lies there, and in the app the
   moving nebula under the clock looked smeared). Height 0 where there is no status bar (desktop, TV). */
html::after { content: ''; position: fixed; top: 0; left: 0; right: 0; height: env(safe-area-inset-top); background: #07080c; z-index: 2000; pointer-events: none; }