/* Shared floating install action; keep all styles inside this component. */
.nl-pwa-dock, .nl-pwa-small, .nl-pwa-help {
    --nl-pwa-offset: calc(24px + env(safe-area-inset-bottom, 0px) + var(--nl-pwa-bottom-offset, 0px));
    --nl-pwa-surface: #fff;
    --nl-pwa-ink: #263451;
    --nl-pwa-muted: #68748c;
    --nl-pwa-line: #e7e3f4;
    box-sizing: border-box;
    font-family: inherit;
    color: var(--nl-pwa-ink);
}
.nl-pwa-small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    inline-size: max-content;
    min-block-size: 48px;
    max-inline-size: calc(100vw - 32px);
    padding-block: 7px;
    padding-inline: 8px 13px;
    border: 1px solid var(--nl-pwa-line);
    border-radius: 999px;
    background: var(--nl-pwa-surface);
    box-shadow: 0 5px 22px rgba(39, 28, 81, .13);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: box-shadow .18s ease, transform .18s ease;
}
.nl-pwa-small:disabled { cursor: progress; opacity: .7; }
.nl-pwa-dock {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: fixed;
    z-index: 1030;
    inset-inline-end: max(16px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
    bottom: var(--nl-pwa-offset);
}
.nl-pwa-dock[hidden], [data-nl-pwa-install][hidden] { display: none !important; }
.nl-pwa-dismiss {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 44px;
    block-size: 44px;
    flex-shrink: 0;
    border: 1px solid var(--nl-pwa-line);
    border-radius: 50%;
    background: var(--nl-pwa-surface);
    color: var(--nl-pwa-muted);
    box-shadow: 0 4px 16px rgba(39, 28, 81, .10);
    font: inherit;
    font-size: 22px;
    cursor: pointer;
}
.nl-pwa-menu { font: inherit; cursor: pointer; }
.nlm-mobile-nav .nl-pwa-menu, .nlm-desktop-nav .nl-pwa-menu {
    gap: 8px;
    min-height: 44px;
    padding: 9px 12px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    text-align: start;
    white-space: nowrap;
}
.nlm-mobile-nav .nl-pwa-menu { width: 100%; }
.nlm-mobile-nav .nl-pwa-menu:hover, .nlm-desktop-nav .nl-pwa-menu:hover { background: var(--nlm-soft, #f1edff); }
.sidebar-nav .nl-pwa-menu {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    width: 100%;
    padding: 10px 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    text-align: start;
}
.nl-pwa-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 32px;
    block-size: 32px;
    border-radius: 50%;
    background: #f1edff;
    flex-shrink: 0;
}
.nl-pwa-mark img { inline-size: 28px; block-size: 28px; border-radius: 50%; object-fit: contain; }
.nl-pwa-small svg { pointer-events: none; flex-shrink: 0; }
.nl-pwa-download { inline-size: 17px; block-size: 17px; color: #7664d9; }
.nl-pwa-help {
    position: fixed;
    z-index: 1031;
    inset-inline-end: max(16px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
    bottom: calc(var(--nl-pwa-offset) + 60px);
    inline-size: min(288px, calc(100vw - 32px));
    max-block-size: calc(100vh - var(--nl-pwa-offset) - 76px);
    max-block-size: calc(100dvh - var(--nl-pwa-offset) - 76px);
    overflow-y: auto;
    background: var(--nl-pwa-surface);
    border: 1px solid var(--nl-pwa-line);
    box-shadow: 0 8px 28px rgba(39, 28, 81, .15);
    border-radius: 18px;
    padding: 12px 14px 14px;
    text-align: start;
    animation: nl-pwa-help-in .16s ease-out;
}
.nl-pwa-help[hidden] { display: none !important; }
.nl-pwa-help-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.nl-pwa-help-head strong { font-size: 14px; font-weight: 650; }
.nl-pwa-help-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: var(--nl-pwa-muted);
    inline-size: 44px;
    block-size: 44px;
    font-size: 22px;
    border-radius: 50%;
    cursor: pointer;
    flex-shrink: 0;
}
.nl-pwa-help p { margin: 3px 0 0; font-size: 12px; line-height: 1.6; color: var(--nl-pwa-muted); }
.nl-pwa-steps { display: grid; gap: 8px; list-style: none; margin: 12px 0 0; padding: 0; }
.nl-pwa-steps li { display: flex; align-items: center; gap: 10px; font-size: 13px; line-height: 1.5; }
.nl-pwa-steps svg { color: #7664d9; flex-shrink: 0; }
.nl-pwa-help p.nl-pwa-note { margin-top: 12px; font-size: 11px; }
.nl-pwa-help-main {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 44px;
    padding: 10px 14px;
    margin-top: 12px;
    border-radius: 12px;
    background: #7664d9;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}
.nl-pwa-small:focus-visible, .nl-pwa-dismiss:focus-visible, .nl-pwa-menu:focus-visible, .nl-pwa-help button:focus-visible, .nl-pwa-help a:focus-visible { outline: 3px solid #9d86fb; outline-offset: 3px; }
html[data-theme="dark"] :is(.nl-pwa-dock, .nl-pwa-small, .nl-pwa-help),
body.dark :is(.nl-pwa-dock, .nl-pwa-small, .nl-pwa-help),
body.dark-mode :is(.nl-pwa-dock, .nl-pwa-small, .nl-pwa-help) {
    --nl-pwa-surface: #1b2339;
    --nl-pwa-ink: #f2f5ff;
    --nl-pwa-muted: #bdc6db;
    --nl-pwa-line: #39425a;
}
html[data-theme="dark"] .nl-pwa-mark, body.dark .nl-pwa-mark, body.dark-mode .nl-pwa-mark { background: #302b48; }
html[data-theme="dark"] :is(.nl-pwa-download, .nl-pwa-steps svg),
body.dark :is(.nl-pwa-download, .nl-pwa-steps svg),
body.dark-mode :is(.nl-pwa-download, .nl-pwa-steps svg) { color: #c1afff; }
@media (max-width: 600px) {
    .nl-pwa-dock, .nl-pwa-small, .nl-pwa-help { --nl-pwa-offset: calc(80px + env(safe-area-inset-bottom, 0px) + var(--nl-pwa-bottom-offset, 0px)); }
}
@media (hover: hover) and (pointer: fine) {
    .nl-pwa-small:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(39, 28, 81, .19); }
}
@keyframes nl-pwa-help-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
    .nl-pwa-small { transition: none; }
    .nl-pwa-help { animation: none; }
}
