/* The "Get the app" bar at the top of the page. Its own colours, so it looks the same on every page. */
.ia-bar {
    --ia-bg: #f7f5fa; --ia-text: #1b1426; --ia-muted: #6e6680; --ia-line: #e7e2ee;
    --ia-btn-bg: #3b1f5c; --ia-btn-text: #fff;
    display: flex; align-items: center; gap: 12px;
    padding: 10px 16px; background: var(--ia-bg); color: var(--ia-text);
    border-bottom: 1px solid var(--ia-line);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.ia-bar[hidden], .ia-bar [hidden] { display: none !important; }
@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .ia-bar { --ia-bg: #1d1628; --ia-text: #f3eff8; --ia-muted: #b3abc2; --ia-line: #2f2640; --ia-btn-bg: #f2b33d; --ia-btn-text: #1b1426; }
}
html[data-theme="dark"] .ia-bar { --ia-bg: #1d1628; --ia-text: #f3eff8; --ia-muted: #b3abc2; --ia-line: #2f2640; --ia-btn-bg: #f2b33d; --ia-btn-text: #1b1426; }
.ia-icon { width: 40px; height: 40px; border-radius: 10px; flex: none; }
.ia-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; line-height: 1.35; }
.ia-text strong { font-size: 0.9375rem; font-weight: 700; }
.ia-hint { font-size: 0.8125rem; color: var(--ia-muted); }
.ia-share { width: 14px; height: 14px; vertical-align: -2px; }

/* The site-wide button look (full width, big padding) is undone inside the bar */
.ia-bar button.ia-install, .ia-bar button.ia-close {
    flex: none; width: auto; min-width: 0; min-height: 0; margin: 0; border: 0; box-shadow: none;
    font-family: inherit; cursor: pointer;
}
.ia-bar button.ia-install {
    border-radius: 999px; padding: 9px 18px;
    background: var(--ia-btn-bg); color: var(--ia-btn-text); font-weight: 700; font-size: 0.875rem;
}
.ia-bar button.ia-close {
    width: 32px; height: 32px; padding: 0; border-radius: 50%;
    background: transparent; color: var(--ia-muted); font-size: 1.375rem; line-height: 1;
}
.ia-bar button.ia-close:hover { background: var(--ia-line); }