/*
 * Kvanta5 cross-browser background layout guard
 *
 * Background canvases use large device-pixel-ratio backing stores.
 * Chromium and WebKit must never be allowed to treat those intrinsic
 * canvas dimensions as normal document-flow dimensions.
 */

/*
 * Preserve an ordinary top-to-bottom document layout.
 *
 * The fixed background layers do not need the body itself to use
 * dynamic viewport units.
 */
html {
    height:
        100% !important;

    min-height:
        100% !important;
}

body {
    display:
        block !important;

    position:
        relative !important;

    height:
        auto !important;

    min-height:
        100% !important;

    margin-top:
        0 !important;

    padding-top:
        0 !important;

    overflow-x:
        hidden !important;
}

/*
 * Catch the static background and every current or experimental
 * Kvanta5 canvas that may remain in the layout.
 *
 * width/height use percentages rather than dvw/dvh so Safari and
 * Chromium cannot create an oversized scrolling area from dynamic
 * viewport-unit or intrinsic-canvas calculations.
 */
#kv5-wave-background,
body > canvas[id^="kv5-"] {
    position:
        fixed !important;

    inset:
        0 !important;

    top:
        0 !important;

    right:
        0 !important;

    bottom:
        0 !important;

    left:
        0 !important;

    display:
        block !important;

    width:
        100% !important;

    height:
        100% !important;

    min-width:
        0 !important;

    min-height:
        0 !important;

    max-width:
        none !important;

    max-height:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;

    vertical-align:
        top !important;

    box-sizing:
        border-box !important;

    pointer-events:
        none !important;

    overflow:
        hidden !important;

    overflow-anchor:
        none !important;

    contain:
        strict !important;
}

/*
 * Keep the static base and animated canvas beneath the application.
 * DOM order continues to place the particle canvas above the static
 * background while both remain below the Explorer interface.
 */
#kv5-wave-background {
    z-index:
        0 !important;
}

body > canvas[id^="kv5-"] {
    z-index:
        0 !important;
}

/*
 * Explicitly anchor the actual Explorer interface in normal flow
 * above all background layers.
 */
body > nav.navbar,
body > .bg-main {
    position:
        relative !important;

    top:
        auto !important;

    right:
        auto !important;

    bottom:
        auto !important;

    left:
        auto !important;

    transform:
        none !important;

    float:
        none !important;

    overflow-anchor:
        auto;

    z-index:
        2;
}

/*
 * Preserve the existing navbar dropdown layering.
 */
body > nav.navbar {
    z-index:
        1080 !important;
}

/*
 * Preserve the existing fixed RocksDB attribution.
 */
#kv5-rocksdb-badge {
    position:
        fixed !important;

    z-index:
        20 !important;
}