/* Native-app-only styles (Capacitor). Everything is scoped under .is-native, set by 60-mobile.js. */
.is-native body { -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none; }
.is-native .topbar { padding-top: env(safe-area-inset-top); height: calc(var(--topbar-h) + env(safe-area-inset-top)); }
.is-native .rail, .is-native .subnav-head { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
.is-native .content { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom) + 72px); padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); }
.is-native .auth-panel { padding-top: calc(2rem + env(safe-area-inset-top)); padding-bottom: calc(2rem + env(safe-area-inset-bottom)); }
.is-native .toast-stack { bottom: calc(1.25rem + env(safe-area-inset-bottom) + 64px); }
.is-native .offcanvas.drawer .offcanvas-header { padding-top: calc(1.1rem + env(safe-area-inset-top)); }
.is-native .offcanvas.drawer .offcanvas-body { padding-bottom: calc(1.4rem + env(safe-area-inset-bottom)); }
.is-native .search-trigger kbd, .is-native .palette-foot { display: none; }
.is-native .btn { min-height: 42px; }
.is-native .btn-sm { min-height: 34px; }

.native-overlay { position: fixed; inset: 0; z-index: 5000; display: grid; place-items: center; padding: calc(1.5rem + env(safe-area-inset-top)) 1.25rem calc(1.5rem + env(safe-area-inset-bottom)); background: radial-gradient(900px 500px at 0% 0%, rgba(var(--brand-rgb), .18), transparent 60%), var(--bg); }
.native-overlay-card { width: 100%; max-width: 380px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: 1.75rem; }

.native-fab { position: fixed; right: calc(1.1rem + env(safe-area-inset-right)); bottom: calc(1.1rem + env(safe-area-inset-bottom)); z-index: 1045; width: 58px; height: 58px; border-radius: 18px; border: 0; display: grid; place-items: center; color: var(--brand-ink); background: linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 60%, #34d399)); box-shadow: 0 12px 28px -10px rgba(var(--brand-rgb), .8); animation: pop-in var(--dur-slow) var(--ease-spring); transition: transform var(--dur-fast) var(--ease); }
.native-fab:active { transform: scale(.94); }
.native-fab .icon { width: 24px; height: 24px; }

.net-banner { position: fixed; left: 0; right: 0; top: 0; z-index: 4500; padding: calc(.45rem + env(safe-area-inset-top)) 1rem .45rem; text-align: center; font-size: .82rem; font-weight: 600; color: #fff; background: var(--warn); animation: rise var(--dur) var(--ease); }
.native-fab { z-index: 1040; }
body:has(.offcanvas.show) .native-fab, body:has(.modal.show) .native-fab { display: none; }