.app-navigation { display:flex; flex-wrap:wrap; gap:0.4rem 1.2rem; padding:0.4rem 1rem; flex:none; }
.app-page { display:flex; flex-direction:column; height:100vh; height:100dvh; }
.opf-view { display:flex; flex:1; flex-direction:column; min-height:0; }
.opf-time { padding:0.35rem 1rem; font-weight:600; flex:none; }
.opf-slider { padding:0.75rem 1.75rem 1.25rem; flex:none; min-height:76px; }
.opf-slider .dash-slider-mark { color:#ddd; white-space:nowrap; font-size:12px; line-height:1.2; }
.opf-slider .dash-slider-mark::before {
    content:""; position:absolute; left:50%; bottom:calc(100% + 8px);
    width:1px; height:5px; background:#9ca3af;
}

.opf-loading {
    position:absolute; top:0.75rem; right:0.75rem; padding:0.4rem 0.7rem;
    background:#222; color:#eee; border-radius:4px; font-size:0.9rem;
    pointer-events:none;
}