/* Play Guide base styles. Each screen's styling lives inline in the template inside index.html. */

@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/figtree-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/figtree-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/figtree-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/figtree-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/fredoka-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/fredoka-latin-600-normal.woff2) format('woff2'); }

html, body { margin: 0; height: 100%; }
html { background: #E3E9F1; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { background: #E3E9F1; color: #1D2433; overscroll-behavior: none; }
#app { height: 100vh; height: 100dvh; }

button, a, select, input { -webkit-tap-highlight-color: rgba(37, 87, 214, 0.12); touch-action: manipulation; }
:focus-visible { outline: 3px solid #2557D6; outline-offset: 2px; }
select { -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%234E5869' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px !important; }

/* File pickers live off-screen; buttons in the app open them. */
.pg-hidden-input { position: fixed; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }